Una Kravets und Vladimir Levin
[…] können Sie eine weitere CSS-Eigenschaft namens
content-visibilityverwenden, um die erforderliche Einhegung automatisch anzuwenden.content-visibilitystellt sicher, dass Sie die größten Leistungsgewinne erzielen, die der Browser mit minimalem Aufwand für Sie als Entwickler bieten kann.Die Eigenschaft
content-visibilityakzeptiert mehrere Werte, aberautoist derjenige, der sofortige Leistungsverbesserungen bietet.
Die Performance-Vorteile scheinen ziemlich groß zu sein
In unserem Beispiel sehen wir eine Steigerung der Rendering-Zeit von 232ms auf 30ms. Das ist eine Leistungssteigerung um das 7-fache.
Es ist jedoch manuelle Arbeit. Sie müssen große vertikale Blöcke der Seite selbst in "Abschnitte" unterteilen, ihnen content-visibility: auto; zuweisen und dann raten, wie hoch sie sind, etwas wie contain-intrinsic-size: 1000px;. Dieser Teil erscheint mir *äußerst* seltsam. Einfach eine Höhe raten? Was, wenn ich falsch liege? Kann ich die Leistung beeinträchtigen? Kann (oder sollte) ich diesen Wert bei verschiedenen Viewports ändern, wenn der Höhenunterschied zwischen kleinen und großen Bildschirmen drastisch ist?
Es scheint, dass man dafür ein ziemlich geschickter Performance-Nerd sein müsste, um das richtig hinzubekommen und zu wissen, wie man Rendering-Profile in DevTools betrachtet und vergleicht. Alles weitere Beweis dafür, dass Web-Performance eine eigene Berufung ist.