Wprowadzenie do łatwo dostępnych technologii.
Dlaczego szybkość wczytywania strony ma znaczenie?
Dla większości użytkowników powolne wczytywanie strony jest częstym powodem frustracji (w badaniu przeprowadzonym przez Google 54% użytkowników). Dlatego nie powinno dziwić, że szybsze wczytywanie strony oznacza lepsze wyniki dla firmy. Jeśli użytkownicy sfrustrują się, jeszcze zanim wejdą w interakcję z witryną, ma małe szanse na to, by pozostali na niej wystarczająco długo, aby docenić jej wartość. Z kolei według innego badania Google obejmującego 254 witryny z branży e-commerce, finansowego i turystycznego witryny, które ładują się w ciągu niecałych 2 sekund, mają o 15% wyższy współczynnik konwersji.
Przyspieszanie największego wyrenderowania treści (LCP)
Jak mówią, nie da się poprawić tego, czego nie mierzysz. Jeśli chodzi o wygodę korzystania z internetu, uważamy, że podstawowe wskaźniki internetowe stanowią solidny zestaw danych na temat użytkowników, który ma na celu rejestrowanie podstawowych aspektów związanych z wrażeniami użytkowników. W szczególności największe wyrenderowanie treści (LCP) mierzy wydajność wczytywania stron, raportując czas potrzebny na wyświetlenie największego bloku tekstu lub obrazu, jaki widzi użytkownik. Aby zapewnić wygodę użytkownikom, wskaźnik LCP powinien pojawić się w ciągu 2, 5 sekundy od pierwszego rozpoczęcia ładowania strony (czyli na wysokim poziomie LCP).
Przyjrzyjmy się czynnikom wpływającym na wskaźnik LCP typowej strony.
Gdy użytkownik odwiedza stronę, przeglądarka wysyła do serwera żądanie kodu HTML. Serwer w odpowiedzi wysyła kod HTML, który przekazuje przeglądarce więcej wskazówek na temat tego, co pobrać w następnej kolejności (w tym CSS, JavaScript, czcionkach i obrazach). Gdy te odpowiedzi wracają, przeglądarka musi jeszcze trochę popracować, żeby je ocenić, a następnie rozmieścić i pomalować komponenty na stronie. Przez większość czasu czeka jednak na przesłanie pakietów z urządzenia na serwer, a następnie z powrotem na urządzenie. Z naszych danych (Chrome na Androida, mediana) wynika, że około 40% czasu oczekiwania widocznego dla użytkownika jest zwykle widoczne dla przeglądarki w czasie oczekiwania na pierwszy bajt z serwera.
Moc pobierania z wyprzedzeniem
Gdyby można było pobrać wszystkie te pliki z wyprzedzeniem, czyli zanim użytkownik wejdzie na stronę, udałoby się znacznie zwiększyć szybkość działania strony – wystarczyłoby jeszcze tylko kilka zadań do wyświetlenia: ocena, obliczenie układu i malowanie.
Biorąc pod uwagę udostępnione wcześniej dane, można także pobrać z wyprzedzeniem główny zasób, a w drugim razie strona wczytywana jest znacznie szybciej. W tej samej witrynie ten typ techniki jest łatwo dostępny w przypadku elementów podstawowych, takich jak rel=prefetch. Jednak w przypadku scenariuszy z innymi witrynami nie jest to tak proste.
Nawigacja między witrynami
Chociaż pobieranie z wyprzedzeniem jest znane już od dawna, w przypadku pobierania z wyprzedzeniem stron z jednej witryny, gdy użytkownik korzysta z innej, warto wziąć pod uwagę dodatkowe kwestie.
Załóżmy, że witryna odsyłająca miała nakierować przeglądarkę na pobieranie z wyprzedzeniem strony z innej witryny. Oczywiście kiedy użytkownik kliknie link prowadzący do pobranej z wyprzedzeniem strony, będzie bardziej zadowolony ze komfortu korzystania z aplikacji, a jej treść będzie się szybciej ładować. Co się jednak stanie, jeśli użytkownik nie kliknie tego linku? Nie spodziewałby się, że linkowana witryna dowie się, że dany temat może być dla nich zainteresowany, gdy przeglądają go w witrynie odsyłającej. Jest to jednak znaczące ryzyko, ponieważ żądania pobierania z wyprzedzeniem zawierają adres IP użytkownika i ewentualne pliki cookie, jak w przypadku każdego innego zwykłego żądania.
Rozwiązania
Aby umożliwić wstępne pobieranie z innych witryn, zapewniające ochronę prywatności, w ciągu ostatnich 3 lat opracowaliśmy 2 rozwiązania: Private Prefetch Proxy i Signed Exchanges (SXG). Przeprowadziliśmy też eksperyment na dużą skalę, aby potwierdzić, że pobieranie z wyprzedzeniem z innych domen zapewnia znaczną poprawę szybkości. Podczas przeglądania przypadków, w których Google udało się bezpiecznie pobrać z wyprzedzeniem główny kod HTML na potrzeby następnej nawigacji użytkownika, zaobserwowaliśmy, że odsetek załadowań stron z „dobrym” wskaźnikiem LCP wzrósł o 14 punktów procentowych.
Najważniejsze kwestie
Prywatny serwer proxy pobierania z wyprzedzeniem i Signed Exchange rozwiązują ten sam przypadek użycia, ale każda technologia wiąże się z innym zestawem kompromisów. Zatem najlepszy wybór zależy od konkretnych potrzeb Twojej witryny. Aby pomóc Ci zorientować się w tego rodzaju kompromisach, w sekcjach poniżej przyjrzymy się 2 najważniejszym kwestiom, które należy wziąć pod uwagę podczas włączania pobierania z wyprzedzeniem z witryn i wybierania jednej z 2 dostępnych technologii. Więcej informacji na ten temat znajdziesz też w szczegółowych artykułach na temat poszczególnych technologii.
Użytkownicy powracający
Wstępne wczytywanie z innych witryn można łatwo włączyć użytkownikom, którzy odwiedzają Twoją witrynę po raz pierwszy. W przypadku powracających użytkowników zależy to od stopnia personalizacji witryny. Wynika to z faktu, że żądania pobierania z wyprzedzeniem pochodzące z innych witryn nie mogą zawierać plików cookie ze względu na ochronę prywatności.
- Dla nowych użytkowników to ograniczenie nie stanowi żadnego wyzwania, ponieważ ci użytkownicy nie mają na początku plików cookie. Oznacza to, że w przypadku tych użytkowników możesz włączyć tę funkcję bez wprowadzania zmian w witrynie.
- Jeśli chcesz włączyć wstępne pobieranie z innych witryn w przypadku powracających użytkowników, a Twoja witryna jest personalizowana na podstawie plików cookie, musisz leniwie ładować te spersonalizowane elementy po przejściu użytkownika do innej witryny. Jest to możliwe, ponieważ po przejściu do witryny ograniczenie używania plików cookie nie jest już konieczne, ponieważ użytkownik zdecydował się odwiedzić Twoją witrynę. Oznacza to, że podczas nawigacji witryna ma zwykły dostęp do plików cookie. Aby uzyskać konkretne wskazówki, zapoznaj się z tymi sprawdzonymi metodami leniwego ładowania.
- Jeśli obecnie kodowanie personalizacji jest bezpośrednio w kodzie HTML, nadal możesz to robić, gdy dostępne są pliki cookie, i używać leniwego ładowania jako strategii zastępczej w przypadku stron pobranych z wyprzedzeniem.
- Jeśli Twoja witryna nie jest personalizowana na podstawie plików cookie lub jeśli personalizacja nie ma kluczowego znaczenia, możesz zdecydować się na wyświetlanie tych samych treści powracającym użytkownikom i osobom odwiedzającym je po raz pierwszy.
Obecnie prywatny serwer proxy pobierania z wyprzedzeniem jest włączony tylko dla nowych użytkowników (linki bez plików cookie), ale trwają prace nad zwiększeniem zasięgu o powracających użytkowników (linki z plikami cookie). Z kolei Signed Exchange obsługuje już pobieranie z wyprzedzeniem z innych witryn zarówno w przypadku nowych, jak i powracających użytkowników (w ramach metod opisanych powyżej).
Wyświetlanie dodatkowych danych z wyprzedzeniem
Włączenie wstępnego pobierania z innych witryn może spowodować przesyłanie dodatkowych danych. Jeśli strona odsyłająca pobiera z wyprzedzeniem Twoją stronę, ale użytkownik nie klika linku, generuje to dodatkowy ruch.
- Aby temu zaradzić, można poprosić, aby strona odsyłająca była mniej agresywna w odniesieniu do żądań pobierania z wyprzedzeniem. Podobnie strona odsyłająca (lub przeglądarka) może ograniczyć ten problem, skupiając się na stosunkowo niewielkich, ale krytycznych zasobach (np. głównych, krytycznych zasobach podrzędnych CSS lub JavaScript). Jest to w istocie kompromis między większą prędkością a dodatkowym ruchem.
- Można też zrównoważyć ten ruch, włączając dodatkowe buforowanie (więcej informacji znajdziesz w tej sekcji na temat Signed Exchange). Wadą tego rozwiązania jest to, że zbyt długie buforowanie treści może spowodować wyświetlanie użytkownikom starszych informacji. Stanowi to kompromis między dodatkowym dostarczaniem danych a aktualizacją treści.
Aby podjąć najlepszą decyzję, zadaj sobie pytanie, gdzie znajduje się Twoja witryna na przesunięciu pomiędzy maksymalną aktualnością a minimalną liczbą dodatkowych żądań. Odpowiedź na to pytanie zależy od konkretnych potrzeb Twojej firmy i użytkowników.
Wprowadzenie
Technologie te zostały zintegrowane z wyszukiwarką Google, dzięki czemu witryny mogą od razu zacząć poprawiać wskaźnik LCP. Mamy nadzieję, że zachęci to innych popularnych użytkowników do zapoznania się z rekomendacjami i pomoże przyspieszyć działanie całej sieci.
Obie technologie służą do rozwiązania tego samego przypadku użycia, ale w związku z omówionymi wcześniej kluczowymi zagadnieniami mają one na celu kompromis. Możesz nawet zacząć od jednej technologii, a potem przejść na inną w miarę ewoluowania Twoich potrzeb lub możliwości przekonywania. Zapoznaj się z tymi szczegółowymi informacjami, aby sprawdzić, która technologia jest najlepszą w Twojej sytuacji: