CWV austricksen

Avatar of Chris Coyier
Chris Coyier am

DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!

Google hat angekündigt, dass Core Web Vitals (CWV) ein SEO-Faktor sein werden, und das Datum rückt näher: Mai 2021. Daher sehe ich einige Bemühungen, sicherzustellen, dass diese Metriken gut sind. Sie wissen schon, die Akronym-Suppe: CLS, LCP und FID. Es gibt immer mehr Tools zur Messung und Diagnose von Problemen. Hoffentlich haben Sie nach der Diagnose einige Ideen, wie Sie diese beheben können. Wenn Sie zum Beispiel eine schlechte CLS haben, liegt das daran, dass Sie Elemente (wahrscheinlich Anzeigen) laden, die das Layout verschieben, und Sie sollten entweder damit aufhören oder im Voraus Platz dafür schaffen, damit es weniger Verschiebungen gibt.

Aber was ist mit LCP? Was ist, wenn Sie dieses große Hero-Bild haben, das lange zum Rendern braucht und Ihnen eine schlechte LCP-Zahl beschert? Der Trick von Chris Castillo besteht darin, das Hintergrundbild des Helden überhaupt nicht zu laden, bis der Benutzer auf irgendeine Weise interagiert. Das erscheint mir seltsam, aber Chris hat einige Tests durchgeführt und festgestellt, dass einige Benutzer es nicht wirklich bemerkt haben.

Obwohl dies das Ziel erreicht, ist es nicht ohne Kosten. Das Hintergrundbild wird erst geladen, wenn der Benutzer mit dem Bildschirm interagiert, daher muss bis zum Laden des Bildes ein Fallback verwendet werden. Ich habe ein paar Freunde gebeten, die Seite auf ihren Handys zu laden und mir zu sagen, ob ihnen etwas Merkwürdiges an der Seite aufgefallen ist, und keiner von ihnen bemerkte etwas "Ungewöhnliches". Was ich beobachtet habe, ist, dass die wenigen Freunde, die ich um Tests gebeten habe, alle ihre Finger auf dem Bildschirm hatten oder den Bildschirm schnell berührten, während die Seite geladen wurde, sodass es so schnell geschah, dass sie es nicht bemerkten. 

Es ist ein feiner Trick, den Chris dokumentiert, aber der Punkt ist, eine Maschine dazu zu bringen, Ihnen bessere Testergebnisse zu liefern. Dies fühlt sich wie der Beginn einer seltsamen neuen Ära der Web-Performance an, in der die Metriken der Web-Performance sich zu nutzerzentrierten Messungen verschoben haben, aber die Leute trickreiche Strategien implementieren, um diese Zahlen mit Methoden zu manipulieren, die, wenn überhaupt, die Benutzererfahrung *leicht* beeinträchtigen.

Direkter Link →