Chrome Uzantıları: API'yi Anında Gezinme'yi destekleyecek şekilde genişletme

Dave Tapuska
Dave Tapuska

Özet: Extensions API, geri-ileri önbelleği destekleyecek şekilde güncellendi. en iyi uygulamaları görelim. Bu konuyla ilgili ayrıntıları aşağıda bulabilirsiniz.

Chrome, gezinmeyi hızlandırmak için yoğun bir şekilde çalışıyor. Anında Gezinme Geri/İleri Önbellek gibi teknolojiler (masaüstünde gönderildi Chrome 96) ve Spekülasyon Kuralları (Chrome 103'te shipped) hem eski hem de ileriye yönelik iyileşmeyi iyileştirir sahip olacaksınız. Bu gönderide, tarayıcıda yaptığımız güncellemeleri keşfedeceğiz. uzantı API'lerini kullanıma sunduk.

Sayfa türlerini anlama

Geri/İleri Önbelleğinin ve önceden işlemenin kullanıma sunulmasından önce sekmesinde yalnızca bir etkin sayfa bulunuyor. Her zaman görünür olan buydu. geri döndüğünde etkin sayfa yok olur (Sayfa B) Geçmişteki bir önceki sayfa tümüyle yeniden oluşturulacaktı (Sayfa A). Uzantıların, yaşam döngüsü sayfalarının ne kadarını oluşturduğunu çünkü bir sekme için yalnızca bir tane olması gerekir: etkin/görünür durumda.

Etkin sayfayı çıkarma
Etkin sayfanın çıkarılması.

Geri/İleri Önbellek ve önceden işleme ile artık bire bir olmaktan çıkmaz arasındaki ilişkiyi vurgular. Artık her sekmede aslında birden fazla öğe ve sayfaların ve sayfaların kaldırılması ve yeniden inşa edildi.

Örneğin, bir sayfa önceden işlenmiş (görünür olmayan) bir sayfa olarak çalışmaya başlayabilir, Kullanıcı bir bağlantıyı tıkladığında etkin (görünür) bir sayfaya geçiş yapmalı ve ardından kullanıcı bir sayfaya gittiğinde Geri/İleri Önbelleğinde (görünmez) saklanır. başka bir sayfaya geçerken, bunların tümünü sayfa hiç yok etmeden yapabilirsiniz. Bu makalenin ilerleyen kısımlarında Okuyucu Gelirleri Yöneticisi'nin ne tür içerikler olup olmadığını kontrol edin.

Sayfa türleri
Sayfa türleri.

Bir sekmede, önceden işlenmiş bir dizi sayfa (yalnızca bir tane değil) olabileceğini unutmayın. etkin (görünür) sayfa ve Geri/İleri önbelleğe alınmış bir dizi sayfa içerir.

Uzantı geliştiricileri için neler değişiyor?

Çerçeve Kimliği == 0

Chromium'da, en üstteki/ana kareyi en dıştaki kare olarak adlandırırız.

frameId değerini varsayan uzantı yazarları kare değeri 0 ise (önceki en iyi uygulama) sorun olabilir. Bir sekme artık birden fazla dış kareye (önceden işlenmiş ve önbelleğe alınmış sayfalardan biri), en dışta tek bir içerik kare yanlış. frameId == 0 tarafından temsil edilmeye devam edecek etkin sayfanın en dış çerçevesine, ancak sayfanın en dıştaki karelerine aynı sekmedeki diğer sayfalar sıfır dışında olacaktır. Yeni bir frameType alanında bu sorunu düzeltmek için eklendi. Ayrıntılı bilgi için "Bir karenin en dıştaki kare olup olmadığını nasıl belirlerim?" bölümünde bulabilirsiniz.

Çerçevelerin yaşam döngüsü ile dokümanlar arasındaki farklılıklar

Uzantılarla ilgili sorun yaratan bir diğer kavram da çerçeve. Çerçeve, bir dokümanı (kaydedilmiş bir URL ile ilişkilendirilir) barındırır. Doküman değişebilir (örneğin, gezinerek) ancak frameId değişmediği için, belirli bir belgede meydana gelen olayların, bu belgede frameIds için de geçerli. Yeni bir documentId kavramını tanıtıyoruz. Her belge için benzersiz bir tanımlayıcı olan Bir karede gezinilirse ve tanımlayıcının değiştirileceği yeni bir doküman açar. Bu alan şunun için yararlıdır: sayfaların yaşam döngüsü durumlarının ne zaman değiştiğini belirleme ( önceden işleme/etkin/önbelleğe alınmış).

Web'de gezinme etkinlikleri

chrome.webNavigation ad alanındaki etkinlikler birden fazla kez etkinleşebilir. olduğu yaşam döngüsüne bağlı olarak aynı sayfa üzerinde çalışır. Görüntüleyin "Sayfanın hangi yaşam döngüsünde olduğunu nasıl anlayabilirim?" ve "Bir sayfanın ne zaman geçiş yapacağını nasıl belirleyebilirim?" bölümlerine göz atabilirsiniz.

Sayfanın hangi yaşam döngüsünde olduğunu nasıl anlayabilirim?

DocumentLifecycle type="ph-2-3"> türünde, çok sayıda uzantı API'sine frameId mevcut. Bir etkinlikte DocumentLifecycle türü mevcutsa (ör. onCommitted), değeri etkinliğin oluşturulduğu durumdur. Dilediğiniz zaman sorgu ekleyebilirsiniz. WebNavigation getFrame() bilgileri ve getAllFrames() ancak etkinlikten elde edilen değerin kullanılması her zaman tercih edilir. Google Ads her iki yöntemde de karenin durumunun, olayın gerçekleştiği zaman ve vaatler her iki yöntemle de geri verildiğinde ortaya çıktığında gerçekleşir.

DocumentLifecycle aşağıdaki değerlere sahiptir:

  • "prerender inç : Şu anda kullanıcıya sunulmasa da kullanıcıya görüntülenmek için hazırlanıyor.
  • "active": Kullanıcıya o anda gösterilir.
  • "cached": Geri/İleri Önbellekte depolanır.
  • "pending_deletion": Belge yok ediliyor.

Bir karenin en dıştaki kare olup olmadığını nasıl anlarım?

Daha önce, uzantılar frameId == 0 tarafından belirlenen etkinlik en dıştaki karede olup olmadığı değerlendirilir. Birden fazla sayfalı Artık birden fazla dış karemiz var. Dolayısıyla frameId tanımı sorunludur. Önbelleğe alınan Geri/İleri ile ilgili etkinlikleri hiçbir zaman almazsınız çerçeve. Ancak, önceden işlenmiş kareler için frameId olur. sıfır olamaz. Bu nedenle, frameId == 0 en dıştaki karenin yanlış olup olmadığını belirleme.

Bu konuda yardımcı olmak için FrameType Dolayısıyla, karenin gerçekten en dıştaki kare olup olmadığını belirlemek artık çok kolay. FrameType aşağıdaki değerlere sahiptir:

  • "outermost_frame": Genellikle en üstteki kare olarak adlandırılır. Lütfen bunlardan birkaçı var. Örneğin, önceden işlenmiş ve önbelleğe alınmış bir her birinin, en üstteki çerçevesi olarak adlandırılabilecek en dıştaki çerçevesi vardır.
  • "fenced_frame": İleride kullanılmak üzere ayrılmıştır.
  • "sub_frame": Genellikle iframe'dir.

DocumentLifecycle öğesini FrameType ile birleştirip bir karenin çerçeveyi kullanabilirsiniz. Örnek: tab.documentLifecycle === “active” && frameType === “outermost_frame”.

Karelerle ilgili kullanım süresi sorunlarını nasıl çözebilirim?

Yukarıda belirttiğimiz gibi çerçeve, bir dokümanı barındırır ve çerçeve yeni bir frameId değişmez. Bu da şunları yaptığınızda sorun yaratır: yalnızca frameId ile etkinlik alabilirsiniz. URL'yi ararsanız olayın gerçekleştiğinden farklı olabileceğini unutmayın. Buna sorunları da beraberinde getirir.

Bu sorunu gidermek için documentId hizmetini kullanıma sunduk. (ve parentDocumentId). webNavigation.getFrame() yöntemi, documentId sağlanırsa frameId yöntemini artık isteğe bağlı hale getirmektedir. İlgili içeriği oluşturmak için kullanılan Bir karede gezinildiğinde documentId değeri değişir.

Bir sayfanın ne zaman geçiş yapacağını nasıl belirleyebilirim?

Bir sayfanın ne zaman durumlar arasında geçiş yapacağını belirlemek için açık sinyaller vardır.

WebNavigation etkinliklerine göz atalım.

Herhangi bir sayfada ilk gezinmeniz için sırayla dört etkinlik görürsünüz. aşağıda listelenmiştir. Bu dört etkinliğin DocumentLifecycle durumu, "prerender" veya "active" olmalıdır.

onBeforeNavigate
onCommitted
onDOMContentLoaded
onCompleted

Bu, documentId değişimini gösteren aşağıdaki şemada gösterilmektedir Önceden işlenmiş sayfa etkin sayfa haline geldiğinde "xyz" değerini alır.

Önceden işlenmiş sayfa etkin sayfa haline geldiğinde documentId değişir
Önceden işlenmiş sayfa, önceden işlenmiş sayfa haline geldiğinde documentId tıklayın.

Bir sayfa Geri/İleri Önbellekten veya etkin durumda üç etkinlik daha olacak (ancak DocumentLifecyle "active" olmak).

onBeforeNavigate
onCommitted
onCompleted

documentId, orijinal etkinliklerdekiyle aynı kalır. Bu documentId == xyz etkinleştirildiğinde yukarıda gösterilmiştir. Lütfen onDOMContentLoaded hariç aynı gezinme etkinlikleri tetikleniyor Bu etkinlik, Sayfa zaten yüklü olduğu için görünür.

Herhangi bir yorumunuz veya sorunuz varsa lütfen chromium-uzantıları grubu.