Przedstawiamy NoState Prefetch

Katie Hempenius
Katie Hempenius

Wprowadzenie

Wstępny pobieranie bez stanu to nowy mechanizm w Chrome, który jest alternatywą dla wycofanego procesu wstępnego renderowania, używanego do obsługi funkcji takich jak <link rel="prerender">. Podobnie jak wstępna renderyzacja, pobiera zasoby z wyprzedzeniem, ale w przeciwieństwie do niej nie wykonuje kodu JavaScript ani nie renderuje żadnej części strony z wyprzedzeniem. Celem funkcji NoState Prefetch jest wykorzystanie mniejszej ilości pamięci niż w przypadku prerenderowania, przy jednoczesnym skróceniu czasu wczytywania strony.

Wstępny pobieranie bez stanu to nie interfejs API, ale mechanizm używany przez Chrome do implementowania różnych interfejsów API i funkcji. Interfejs Resource Hints API oraz wstępne pobieranie stron przez pasek adresu w Chrome są implementowane za pomocą funkcji NoState Prefetch. Jeśli używasz Chrome 63 lub nowszej, Twoja przeglądarka już korzysta z pobierania wstępnego bez stanu do obsługi funkcji takich jak <link rel="prerender">.

Z tego artykułu dowiesz się, jak działa funkcja NoStatePrefetch, dlaczego ją wprowadziliśmy oraz jak za pomocą histogramów w Chrome wyświetlić statystyki dotyczące jej użycia.

Motywacja

Wprowadzenie funkcji wstępnego pobierania bez stanu było podyktowane 2 głównymi motywacjami:

Zmniejszanie użycia pamięci

Pobieranie z nieaktywnym stanem zajmuje tylko około 45 MiB pamięci. W przypadku funkcji NoState Prefetch głównym kosztem pamięci jest utrzymanie skanera wstępnego wczytywania, a ten koszt pozostaje stosunkowo stały w różnych przypadkach użycia. Zwiększenie rozmiaru lub liczby pobieranych danych nie ma znaczącego wpływu na ilość pamięci zużywanej przez funkcję pobierania z wyprzedzeniem bez stanu.

W przypadku prerenderowania zużycie pamięci wynosi zwykle 100 MiB, a maksymalne zużycie pamięci to 150 MiB. Wysokie zużycie pamięci powoduje, że nie nadaje się ona do urządzeń niskiego poziomu (czyli z mniej niż 512 MB pamięci RAM). W efekcie na słabszych urządzeniach Chrome nie wykonuje wcześniejszego renderowania, tylko wcześniej nawiązuje połączenie.

Ułatwienie obsługi nowych funkcji platformy internetowej

W ramach prerenderowania nie powinny występować żadne działania skierowane do użytkownika (np. odtwarzanie muzyki lub filmu) ani działania zależne od stanu (np. modyfikowanie sesji lub pamięci lokalnej). Zapobieganie tym działaniom podczas renderowania strony może być jednak trudne i skomplikowane. Pobieranie z wyprzedzeniem bez stanu pobiera tylko zasoby z wyprzedzeniem: nie wykonuje kodu ani nie renderuje strony. Dzięki temu łatwiej jest zapobiegać działaniom skierowanym do użytkowników i działaniom zależnym od stanu.

Implementacja

Z poniższych kroków dowiesz się, jak działa funkcja wstępnego pobierania bez stanu.

  1. Nie jest wywoływana funkcja NoStatePrefetch.

    Wskazówka zasobów wstępnego renderowania (np. <link rel="prerender">) i niektóre funkcje Chrome będą uruchamiać pobieranie wstępne bez stanu, o ile zostaną spełnione 2 warunki: a) użytkownik nie korzysta z urządzenia niskiego poziomu, b) użytkownik nie korzysta z sieci komórkowej.

  2. Dla funkcji pobierania wstępnego bez stanu tworzy się nowy, dedykowany render.

    W Chrome „obsługa renderowania” to proces, który zajmuje się pobieraniem dokumentu HTML, jego analizowaniem, budowaniem drzewa renderowania i wyświetlaniem wyniku na ekranie. Każda karta w Chrome, a także każdy proces wstępnego pobierania bez stanu, ma własny moduł renderowania, aby zapewnić izolację. Pomaga to zminimalizować skutki wystąpienia błędu (np. awarii karty) oraz uniemożliwia złośliwemu kodowi dostępu do innych kart lub innych części systemu.

  3. Zasób wczytywany z wykorzystaniem funkcji pobierania wstępnego bez stanu. Następnie skaner HTMLPreloadScanner skanuje ten zasób, aby znaleźć wszystkie podzasoby, które trzeba pobrać. Jeśli zasób główny lub którykolwiek z jego zasobów podrzędnych ma zarejestrowanego pracownika usługi, te żądania będą przechodzić przez odpowiedniego pracownika usługi.

    Wstępny pobieranie bez stanu obsługuje tylko metodę HTTP GET. Nie pobiera żadnych zasobów podrzędnych, które wymagają użycia innych metod HTTP. Ponadto nie pobiera żadnych zasobów, które wymagają działań użytkownika (np. wyskakujących okienek uwierzytelniania, certyfikatu klienta SSL lub ręcznego zastąpienia).

  4. Pobrane podelementy będą pobierane z priorytetem sieci „IDLE” (nieużywany).

    Priorytet sieci „IDLE” to najniższy możliwy priorytet sieci w Chrome.

  5. Wszystkie zasoby pobrane przez funkcję pobierania z wyprzedzeniem NoState są umieszczane w pamięci podręcznej zgodnie z ich nagłówkami pamięci podręcznej.

    W przypadku metody pobierania wstępnego bez stanu wszystkie zasoby zostaną zapisane w pamięci podręcznej z wyjątkiem tych, które mają nagłówek no-store Cache-Control. Zasób zostanie ponownie zweryfikowany przed użyciem, jeśli zawiera nagłówek Vary odpowiedzi, no-cache nagłówek Cache-Control lub jeśli ma więcej niż 5 minut.

  6. Po wczytaniu wszystkich zasobów podrzędnych procesor graficzny jest zamykany.

    Jeśli limit czasu dla zasobów podrzędnych zostanie przekroczony, po 30 sekundach renderowanie zostanie przerwane.

  7. Przeglądarka nie wprowadza żadnych zmian stanu oprócz aktualizacji pamięci podręcznej plików cookie i lokalnej pamięci podręcznej DNS. Jest to ważne, ponieważ „NoState” to „NoState Prefetch”.

    W tym momencie „normalnego” procesu wczytywania strony przeglądarka prawdopodobnie wykona czynności, które zmodyfikują jej stan: np. wykona kod JavaScript, zmodyfikuje obiekt sessionStorage lub localStorage, odtworzy muzykę lub film, użyje interfejsu History API lub wyświetli prompt. Jedynymi modyfikacjami stanu, które występują w przypadku metody NoState Prefetch, są aktualizacja pamięci podręcznej DNS po otrzymaniu odpowiedzi oraz aktualizacja pamięci plików cookie, jeśli odpowiedź zawiera nagłówek Set-Cookie.

  8. Gdy zasobów jest potrzeba, są one wczytywane do okna przeglądarki.

    Jednak w odróżnieniu od wstępnie wyrenderowanej strony nie będzie ona widoczna od razu – musi zostać wyrenderowana przez przeglądarkę. Przeglądarka nie będzie używać ponownie renderowania, które zostało użyte do wczytania wstępnego bez stanu, lecz użyje nowego renderowania. Nierenderowanie strony z wyprzedzeniem zmniejsza zużycie pamięci przez NoStatePrefetch, ale także ogranicza jego potencjalny wpływ na czas wczytywania strony.

    Jeśli strona ma skrypt service worker, wczytywanie tej strony zostanie ponownie przekazane do tego skryptu.

    Jeśli w momencie, gdy strona jest potrzebna, nie udało się jeszcze pobrać zasobów podrzędnych za pomocą funkcji NoState Prefetch, przeglądarka będzie kontynuować proces wczytywania strony od miejsca, w którym zakończyła działanie funkcja NoState Prefetch. Przeglądarka będzie musiała jeszcze pobrać zasoby, ale nie tak wiele, jak gdyby nie została uruchomiona funkcja NoState Prefetch.

Wpływ na Web Analytics

Strony wczytane za pomocą funkcji wstępnego pobierania bez stanu są rejestrowane przez narzędzia do analizy internetowej w nieco innych momentach w zależności od tego, czy narzędzie zbiera dane po stronie klienta czy po stronie serwera.

Skrypty analityczne po stronie klienta rejestrują odsłonę strony, gdy jest ona wyświetlana użytkownikowi. Te skrypty wymagają wykonania kodu JavaScript, a prefetching bez stanu nie wykonuje żadnego kodu JavaScript.

Narzędzia analityczne po stronie serwera rejestrują dane, gdy żądanie zostanie obsłużone. W przypadku zasobów wczytywanych za pomocą funkcji wstępnego pobierania bez stanu może wystąpić znaczna przerwa między przetworzeniem żądania a faktycznym użyciem odpowiedzi przez klienta (jeśli w ogóle zostanie ona użyta). Od wersji 69 przeglądarki Chrome funkcja pobierania w tle bez stanu dodaje nagłówek Purpose: Prefetch do wszystkich żądań, aby można je było odróżnić od zwykłego przeglądania.

Sprawdź

NoStatePrefetch został wdrożony w grudniu 2017 roku w Chrome 63. Obecnie służy do:

  • Zaimplementuj podpowiedź dotyczącą zasobu prerender
  • Pobieranie pierwszego wyniku w wyszukiwarce Google
  • pobieranie stron, które według paska adresu Chrome prawdopodobnie zostaną odwiedzone jako następne;

Za pomocą Chrome Internals możesz sprawdzić, jak korzystasz z NoStatePrefetch.

Aby wyświetlić listę witryn, które zostały załadowane za pomocą funkcji prerenderowania bez stanu, otwórz chrome://net-internals/#prerender.

Aby wyświetlić statystyki dotyczące korzystania z funkcja wstępnego pobierania bez stanu, otwórz stronę chrome://histograms i wyszukaj „NoStatePrefetch”. Istnieją 3 różne histogramy funkcji wstępnego pobierania bez stanu – jeden dla każdego przypadku użycia tej funkcji:

  • „NoStatePrefetch” (statystyki dotyczące użycia przez wskazówki dotyczące zasobów wstępnego renderowania)
  • „gws_NoStatePrefetch” (statystyki dotyczące korzystania ze strony wyników wyszukiwania Google)
  • „omnibox_NoStatePrefetch” (statystyki dotyczące korzystania z paska adresu Chrome)