Rozwijanie wskaźnika CLS

Plany ulepszenia danych CLS, aby były bardziej sprawiedliwe w stosunku do stron o długiej tradycji.

Annie Sullivan
Annie Sullivan
Hongbo Song
Hongbo Song

Niedawno (zespół Chrome Speed Metrics) przedstawiliśmy wstępne badania opcje sprawiają, że dane CLS są bardziej sprawiedliwe w odniesieniu do stron, które są otwarte od dłuższego czasu . Dostaliśmy wiele przydatnych uwag. Po przeprowadzeniu szeroko zakrojonej analizy ustaliliśmy, zmiana, którą planujemy wprowadzić w danych: maksymalne okno sesji o długości 1 sekundy do 5 sekund.

Czytaj dalej, aby poznać szczegóły.

Na jakiej podstawie ocenialiśmy dostępne opcje?

Przeanalizowaliśmy wszystkie opinie otrzymane od społeczności deweloperów i podjęliśmy pod uwagę.

Zaimplementowaliśmy też najważniejsze opcje w Chrome przeprowadziliśmy na dużą skalę analizę danych na milionach stron internetowych. Śr Przeanalizujesz typy witryn, które są lepsze, i porównasz poszczególne opcje, Szczególnie przyglądamy się witrynom, które otrzymały różne oceny w zależności . Ustaliliśmy, że:

  • Wszystkie opcje zmniejszały zależność między czasem spędzonym na stronie wynik przesunięcia układu.
  • Żadna z opcji nie spowodowała uzyskania gorszego wyniku na dowolnej stronie. Nie ma więc sensu, obawiasz się, że zmiana ta pogorszy wyniki Twojej witryny.

Punkty decyzji

Dlaczego warto wybrać okno sesji?

W poprzednim poście omówiliśmy: kilka różnych okien strategie do grupowania przesunięć układu przy jednoczesnym zapewnieniu, że wynik nie zwiększy się bez ograniczeń. Opinie deweloperów w dużym stopniu pochwały to strategia dotycząca okna sesji, ponieważ grupuje ona większość przesunięć układu intuicyjnie.

Oto przykład, jak sprawdzić okna sesji:

Przykład okna sesji.

W powyższym przykładzie wiele przesunięć układu zachodzi z biegiem czasu, gdy użytkownik widzi stronę. Każda z nich jest oznaczona niebieskim paskiem. Powyżej zauważysz, że niebieskie paski mają różne wysokości; reprezentują wynik każdego pojedynczego przesunięcia układu. Okno sesji zaczyna się od pierwszego przesunięcia układu i cały czas się rozwija, aż powstanie luka bez przesunięć układu. Gdy następnym razem następuje przesunięcie układu, rozpoczyna się nowe okno sesji. Ponieważ występują trzy luki w argumencie bez przesunięć układu, w tym przykładzie widoczne są 3 okna sesji. Podobne do bieżącej definicji CLS, wyniki każdej zmiany są sumowane, tak aby wynik okna jest sumą jego poszczególnych przesunięć układu.

Na podstawie początkowej badania, 1-sekundową przerwę między sesjami na dużą skalę. Dlatego „luka w sesji” w powyższym przykładzie ma wartość 1. sekunda.

Skąd się biorą maksymalne okno sesji?

Zawęziliśmy podsumowanie strategii aż do mamy dwie opcje do wyboru:

  • Średni wynik wszystkich okien sesji w przypadku bardzo dużej sesji. okna (nieograniczone 5-sekundowe przerwy między nimi).
  • Maksymalny wynik wszystkich okien sesji dla mniejszych okresów. (jest ograniczony do 5 sekund, z 1-sekundową przerwą między nimi).

Po wstępnych badaniach dodaliśmy wszystkie dane do Chrome, aby określić na dużą skalę na milionach adresów URL. W analizie na dużą skalę udało nam się znaleźć wiele adresów URL z takimi wzorcami przesunięcia układu:

Przykład niewielkiego przesunięcia układu cofającego średnią

W prawym dolnym rogu widać tylko pojedyncze, niewielkie przesunięcie układu Okno sesji 2, przez co jego wynik jest bardzo niski. Oznacza to, że średnia ocena jest dość niedokładna. A co, jeśli deweloper naprawi to niewielkie przesunięcie układu? Później jest obliczany tylko dla okna sesji 1, co oznacza, że wynik strony prawie podwojenie. Byłoby to bardzo mylące i zniechęcało programistów, aby poprawiać przesunięcia układu, tylko w ten sposób stwierdzić, że wynik się pogorszył. oraz usunięcie tego małego przesunięcia układu jest oczywiście nieco lepsze z punktu widzenia użytkownika. więc nie powinno to pogorszyć oceny.

Ze względu na ten problem ze średnimi postanowiliśmy kontynuować mniejszych, z ograniczeniami i maksymalną maksymalną liczbą okien. W przykładzie powyżej Sesja Okno 2 zostałaby zignorowana, a tylko suma przesunięć układu w oknie sesji 1 mogą zostać zgłoszone.

Dlaczego 5 sekund?

Sprawdziliśmy wiele rozmiarów okien i zauważyliśmy 2 rzeczy:

  • W przypadku krótkich okien wolniejsze ładowanie stron i wolniejsze reagowanie na interakcje użytkownika można podzielić przesunięcia układu na wiele okien i poprawić wynik. Śr chciałem powiększyć okno, żeby nie nagradzać za korki!
  • Niektóre strony są ciągłym strumieniem niewielkich przesunięć układu. Dla: Może to być np. strona z wynikami sportowymi, która zmienia się z każdym kolejnym wynikiem. Te zmiany są denerwujące, ale z czasem nie stają się bardziej irytujące. Dlatego chcemy mieć pewność, że okno będzie ograniczone do tego typu przesunięć układu.

Biorąc pod uwagę te dwie kwestie, porównując różne rozmiary okien na wielu do rzeczywistych stron internetowych, doszliśmy do wniosku, że 5 sekund powinno wystarczyć rozmiaru okna.

Jak wpłynie to na wynik CLS mojej strony?

Ta aktualizacja ogranicza CLS strony, więc żadna strona nie będzie miała gorszego wyniku ze względu na te zmiany.

Z naszej analizy wynika, że 55% źródeł w ogóle nie zaobserwuje zmiany w CLS. na 75. percentylu. Dzieje się tak, ponieważ ich strony obecnie które nie mają żadnych przesunięć układu, albo są już ograniczone do pojedyncze okno sesji.

W przypadku pozostałych źródeł poprawione będą wyniki na 75. percentylu: tę zmianę. W większości przypadków będzie tylko niewielka poprawa, ale około 3% Poprawiają się wyniki ze względu na „potrzebną poprawę” lub „słabe” ocena do mieć „dobry” ocenę. Te strony zwykle używają nieskończonego przewijania lub mają ich wiele powolne aktualizacje interfejsu, zgodnie z opisem w naszym wcześniejszym post.

Jak mogę je wypróbować?

Wkrótce zaktualizujemy nasze narzędzia, aby korzystały z nowej definicji danych. Tymczasem możesz wypróbować zaktualizowaną wersję CLS w dowolnej witrynie, korzystając z przykładowego JavaScript implementacji lub rozwidlenie wskaźników internetowych .

Dziękuję wszystkim, którzy znaleźli czas, aby przeczytać poprzedni post i udzielić się prześlij opinię.