2017-03-10 1 views
1

Ich behalte gerade ein altes Legacy-Projekt bei, bei dem ich gerade eine Nachricht von meinem Browser bemerkt habe, wie Scroll-verknüpfte Effekte die Rendering-Leistung reduzieren.Scroll-Link-Effekt ist veraltet, was ist eine bessere Alternative in modernen Browsern?

Die Anwendung rendert eine große Form, auf der Unterseite befindet sich ein Schieberegler mit vielen Daten, die asynchron geladen werden (und nur wenn der Benutzer nach unten scrollt, damit er in seine Ansicht kommt). Danach erstellt es eine Menge DOM-Elemente (viel bedeutet eine typische von 100-300 Figuren mit einem Bild, Texten und einigen Attributen), die dem Slider hinzugefügt werden.

Also las ich about Scroll-linked effects on MDN, um sich um dieses Leistungsproblem kümmern, aber ich weiß nicht, was die beste Praxis ist. Weder kann ich die Beispiele über "sticky positioning" noch "scroll snapping" verwenden. Außerdem möchte ich das Scrollen in keiner Weise anpassen. Das Ziel dieses Verhaltens ist es, das Laden des großen Datenpakets so weit wie möglich zu verzögern (da nur, wenn der Benutzer diese Seite herunterscrollt, er wirklich diese Daten benötigt).

Können Sie mir bitte dabei helfen, die Scroll-Leistung der Anwendung zu optimieren, ohne die Lazy-Loading-Funktion zu verlieren?

Antwort

Verwandte Themen