Service Worker'a genel bakış

Servis çalışanları olağanüstü faydalar sunar ancak başlangıçta çalışmak zor olabilir. Çalışma kutusu, Service Worker'ların kullanımını kolaylaştırır. Ancak hizmet çalışanları zorlu sorunları çözdüğünden, bu teknolojinin herhangi bir soyutlanması da anlaşılmadan zor olacaktır. Böylece, bu belgelerin ilk birkaç kısmında Workbox ayrıntılarına geçmeden önce söz konusu temel teknoloji ele alınacaktır.

Service Worker'ların çalışan listesini görmek için adres çubuğunuza chrome://serviceworker-internals/ yazın.

Çalışan bir Service Worker listesi.

Service Worker'lar ne sağlar?

Servis çalışanları, web tarayıcıları ve web sunucuları arasında proxy görevi gören özel JavaScript öğeleridir. Sayfa performansını artırmanın yanı sıra çevrimdışı erişim sağlayarak güvenilirliği artırmayı amaçlar.

Kademeli olarak gelişen, uygulamaya benzer yaşam döngüsü

Service Worker'lar, mevcut web sitelerine yapılan bir geliştirmedir. Yani, Service Worker'ları desteklemeyen tarayıcılardaki kullanıcılar, bunları kullanan web sitelerini ziyaret ederse temel işlev bozulmaz. Web'in amacı budur.

Service Worker'lar, platforma özgü uygulamalara benzer bir yaşam döngüsü boyunca web sitelerini aşamalı olarak geliştirir. Yerel bir uygulama, uygulama mağazasından yüklendiğinde neler olduğunu düşünün:

  • Uygulamanın indirilmesi için bir istekte bulunuldu.
  • Uygulama indirilir ve yüklenir.
  • Uygulama kullanıma hazır ve başlatılabilir.
  • Uygulama, yeni sürümler için güncellenir.

Service Worker'ın yaşam döngüsü benzer olsa da progresif geliştirme yaklaşımı vardır. Yeni bir Service Worker'ın yüklendiği bir web sayfasının ilk ziyaretinde, bir sayfaya yapılan ilk ziyaret, hizmet çalışanı indirme işlemi sırasında temel işlevini sağlar. Service Worker yüklenip etkinleştirildikten sonra daha fazla güvenilirlik ve hız sunmak için sayfayı kontrol eder.

JavaScript odaklı önbelleğe alma API'sine erişim

Hizmet çalışanı teknolojisinin vazgeçilmez bir özelliği, HTTP önbelleğinden tamamen ayrı bir önbelleğe alma mekanizması olan Cache arayüzüdür. Cache arayüzüne, hizmet çalışanı kapsamında ve ana iş parçacığının kapsamında erişilebilir. Bu sayede, Cache örneğiyle kullanıcı odaklı etkileşimler için sayısız olasılık ortaya çıkıyor.

HTTP önbelleği, HTTP üst bilgilerinde belirtilen önbelleğe alma yönergelerinden etkilenirken Cache arayüzü, JavaScript aracılığıyla programlanabilir. Bu, ağ isteklerine yönelik yanıtların önbelleğe alma işleminin, belirli bir web sitesi için en uygun mantığa dayalı olabileceği anlamına gelir. Örneğin:

  • Statik öğeleri, bunlar için yapılan ilk istekte önbellekte depolayın ve yalnızca sonraki her istekte önbellekten sunun.
  • Sayfa işaretlemesini önbellekte depolayın, ancak yalnızca çevrimdışı senaryolarda önbellekten işaretleme sunun.
  • Önbellekten belirli öğeler için eski yanıtlar sunun, ancak bunları arka planda ağdan güncelleyin.
  • Ağdan kısmi içerik akışı yapın ve algı performansını iyileştirmek için bunu önbellekten bir uygulama kabuğuyla birleştirin.

Bunların her biri, bir önbelleğe alma stratejisine örnektir. Önbelleğe alma stratejileri çevrimdışı deneyimleri mümkün hale getirir ve yüksek gecikmeli yeniden doğrulama kontrollerini yan yana getirerek daha iyi performans sağlayabilir. Workbox'ı kullanmaya başlamadan önce, birkaç önbelleğe alma stratejisini ve bunların çalışmasını sağlayan kodu gözden geçirin.

Eşzamansız ve etkinlik odaklı API

Ağ üzerinden veri aktarımı, yapısı gereği eşzamansızdır. Bir öğe istemek, sunucunun bu isteğe yanıt vermesi ve yanıtın indirilmesi zaman alır. Harcanan zaman çeşitli ve belirsizdir. Service Worker'lar, aşağıdaki gibi etkinlikler için geri çağırmalar kullanarak bu eşzamansızlığı etkinlik odaklı bir API aracılığıyla gerçekleştirir:

Etkinlikler, bilinen bir addEventListener API kullanılarak kaydedilebilir. Bu etkinliklerin tümü Cache arayüzü ile potansiyel olarak etkileşim kurabilir. Özellikle ağ istekleri gönderildiğinde geri çağırma çalıştırmak, aranan güvenilirliği ve hızı sağlamak açısından son derece önemlidir.

JavaScript'te eşzamansız çalışma yapmak için vaatlerin kullanılması gerekir. async ve await, sözler tarafından da desteklendiği için bu JavaScript özellikleri, daha iyi bir geliştirici deneyimi için Service Worker (ve Workbox) kodunu basitleştirmek amacıyla kullanılabilir.

Önbelleğe alma ve çalışma zamanında önbelleğe alma

Bir hizmet çalışanı ile Cache örneği arasındaki etkileşim, iki farklı önbelleğe alma kavramı içerir: önbelleğe alma ve çalışma zamanında önbelleğe alma. Bunların her biri, Service Worker'ın sunabileceği avantajların merkezinde yer alır.

Önceden önbelleğe alma, genellikle bir hizmet çalışanının kurulumu sırasında öğeleri önceden önbelleğe alma işlemidir. Önbelleğe alma sayesinde çevrimdışı erişim için gereken önemli statik öğeler ve materyaller indirilip bir Cache örneğinde depolanabilir. Bu tür önbelleğe alma işlemi, önceden önbelleğe alınmış öğeleri gerektiren sonraki sayfaların sayfa hızını da iyileştirir.

Çalışma zamanını önbelleğe alma, çalışma zamanı sırasında ağdan istenen öğelere bir önbelleğe alma stratejisinin uygulanmasıdır. Bu tür önbelleğe alma, kullanıcının daha önce ziyaret etmiş olduğu sayfalara ve öğelere çevrimdışı erişimi garanti ettiği için yararlıdır.

Cache arayüzünü bir Service Worker'da kullanmaya yönelik bu yaklaşımlar birlikte kullanıldığında kullanıcı deneyimine çok büyük bir avantaj sağlar ve sıradan web sayfalarında uygulamaya benzer davranışlar sağlar.

Ana iş parçacığından izolasyon

JavaScript performansının durumu, web'de sürekli gelişen bir zorluktur ve kullanıcı açısından bakıldığında bu durum cihaz özelliklerine ve yüksek hızlı internete erişime bağlıdır. Ne kadar çok JavaScript kullanılırsa keyifli kullanıcı deneyimleri sunan hızlı web siteleri oluşturmak da o kadar zor hale gelir.

Service Worker'lar, web çalışanları gibi gerçekleştirdikleri tüm işlerin kendi iş parçacıklarında gerçekleşmesinden kaynaklanır. Yani Service Worker görevleri, ana iş parçacığındaki diğer görevlerle dikkat çekmek için rekabet etmez. Service Worker'lar, tasarımı gereği kullanıcıya öncelik verir.

Önünüzdeki yol

Bu doküman yalnızca bir genel bakış niteliğindedir. Workbox'ı düzgün bir şekilde ele almadan önce Service Worker'lar ile ilgili olarak değinilmesi gereken birkaç konu daha vardır ancak endişelenmeyin: Service Worker'ları iyice anladığınızda Workbox kullanımı daha kolay ve verimli bir deneyim olacaktır.