Frontend Röportaj Sorusu: Paralel Görev Limiti

Frontend Röportaj Sorusu: Paralel Görev Limiti

Frontend geliştirici pozisyonlarında sıkça karşılaşılan bir röportaj sorusu, “paralel görev limiti” konusudur. Bu soru, adayın asenkron programlama becerilerini, performans optimizasyonuna olan yaklaşımını ve problem çözme yeteneğini değerlendirmeyi amaçlar. Örneğin, aynı anda çok sayıda resim yüklenmesi gerektiğinde, sınırsız paralel işlem, tarayıcının kaynaklarını tüketebilir ve performans sorunlarına yol açabilir. Bu sorunun cevabı, tarayıcının kaynaklarını etkili bir şekilde kullanarak, aynı anda işlenen görev sayısını sınırlayan bir çözüm üretmeyi gerektirir.

Öncelikle, problemi daha iyi anlamak için bir senaryo düşünelim: Bir e-ticaret sitesi düşünün. Bu sitede yüzlerce ürünün resmi var ve bunların hepsi aynı anda yüklenmeye çalışılıyor. Bu durum, tarayıcının donmasına veya yavaşlamasına sebep olabilir. İşte burada “paralel görev limiti” devreye giriyor. Amacımız, aynı anda en fazla belirli sayıda (örneğin 5) resmin yüklenmesini sağlamak ve kalan resimlerin ise önceki resimler yüklendikten sonra sıraya girmesini garantilemektir. Bu, tarayıcının kaynaklarını daha verimli kullanmamızı ve kullanıcı deneyimini iyileştirmemizi sağlar.

Çözüm: Async/Await ve Promise.all

Bu sorunun yaygın çözümlerinden biri, async/await ve Promise.all fonksiyonlarını birlikte kullanmaktır. async/await, asenkron işlemleri senkron kod gibi yazmamızı sağlar ve okunabilirliği artırır. Promise.all ise, birden fazla Promise’ın sonuçlarını bekler ve hepsi çözümlendiğinde tek bir Promise döndürür. Bunları birleştirerek, paralel görev sayısını kontrol edebiliriz. Aşağıda bu tekniği gösteren bir örnek kod bulunmaktadır:

async function parallelTaskLimit(tasks, maxParallel) {
  const results = [];
  let running = 0;
  const queue = [...tasks];

  function processNext() {
    if (queue.length === 0 && running === 0) return;
    while (running < maxParallel && queue.length > 0) {
      running++;
      const task = queue.shift();
      task().then(result => {
        results.push(result);
        running--;
        processNext();
      });
    }
  }

  processNext();
  return await Promise.all(results);
}

//Örnek kullanım:
const tasks = Array.from({ length: 10 }, (_, i) => () => new Promise(resolve => setTimeout(() => resolve(Task ${i + 1}), 1000)));
parallelTaskLimit(tasks, 3).then(results => console.log(results));

Bu kodda, maxParallel parametresi aynı anda çalışacak görev sayısını belirler. Queue mantığıyla sıradaki görevler işlenir. Her bir görevin tamamlanması, processNext() fonksiyonu sayesinde bir sonraki görevin başlatılmasını tetikler. Bu sayede, aynı anda en fazla maxParallel kadar görev çalışır ve tarayıcı kaynakları daha verimli kullanılır.

Alternatif Yaklaşımlar ve İpuçları

Başka alternatifler de mevcuttur. Örneğin, bir görev kuyruğu sistemi kullanarak, görevleri daha sofistike bir şekilde yönetebilirsiniz. Bu, daha büyük ölçekli uygulamalar için daha uygun olabilir. Ancak, bu basit örnek, röportaj sorusunu cevaplamak için yeterli bir temel oluşturur. Bu tür sorularda sadece teknik bilgi değil, aynı zamanda problem çözme becerisi ve performans odaklı bir düşünce tarzı da oldukça önemlidir.

Sonuç olarak, “paralel görev limiti” sorusu, frontend geliştiriciler için önemli bir konuyu ele almaktadır. Bu soruyu cevaplayabilmek için, asenkron programlama kavramlarına hakim olmak ve performans optimizasyonuna duyarlı olmak gerekmektedir. Bu makalede ele aldığımız yöntemler, sizlere bu konuda yol gösterici olacaktır. Daha fazla bilgi için fatihsoysal.com adresini ziyaret edebilirsiniz.

Ek olarak, konuyu daha detaylı anlamak için aşağıdaki kaynağı inceleyebilirsiniz: https://dev.to/moniv9/frontend-interview-question-parallel-task-limit-118o

#Etiketler

Frontend, Javascript, Async Await, Promise, Parallel Task Limit, Röportaj Sorusu, Web Geliştirme, Performans Optimizasyonu, Promise.all