Jeder, der JS schreibt, weiß, dass es viele Möglichkeiten gibt, den gleichen Effekt zu schreiben, aber die Schritte sind unterschiedlich. Obwohl Sie den Effekt geschrieben haben, wurde die Leistung der Seite stark reduziert. Bei der Entwicklung von Skripten wird die Verbesserung der Skriptleistung immer wichtiger. Wie optimieren Sie Ihren JavaScript-Code? Wie können wir die kürzeste gerade Linie zwischen zwei Punkten zeichnen? Heute fasse ich für Sie zusammen, wie Sie Ihren eigenen JavaScript-Code optimal schreiben.
Herkömmliche Webseiten enthalten nicht viele Skripte, zumindest beeinträchtigen sie die Leistung der Webseite nicht zu sehr. Da Webseiten jedoch immer mehr zu Anwendungen werden, haben Skripte einen zunehmenden Einfluss auf sie. Da immer mehr Anwendungen mithilfe von Webtechnologien entwickelt werden, wird die Verbesserung der Skriptleistung immer wichtiger. Desktop-Anwendungen verwenden normalerweise einen Compiler, um den Quellcode in die endgültige Binärdatei zu konvertieren. Der Compiler kann beim Generieren der endgültigen Anwendung Zeit damit verbringen, so viel Leistung wie möglich zu optimieren. Webanwendungen bieten diesen Luxus nicht. Da sie auf mehreren Browsern, Plattformen und Architekturen ausgeführt werden müssen, können sie nicht vollständig vorkompiliert werden. Der Browser nimmt das Skript einzeln auf, interpretiert und kompiliert es, aber die endgültige Anwendung sollte genauso schnell geladen werden und so reibungslos laufen wie eine Desktop-Anwendung. Es wird erwartet, dass es auf einer Vielzahl von Geräten läuft, von normalen Desktop-Computern bis hin zu Mobiltelefonen.
Browser sind ziemlich gut darin, dies zu erreichen, und Opera verfügt derzeit über eine der schnellsten Skript-Engines in allen Browsern. Allerdings haben Browser auch einige Einschränkungen, auf die Webentwickler achten müssen. Um sicherzustellen, dass Ihre Webanwendung so schnell wie möglich ausgeführt wird, kann dies so einfach sein wie das Austauschen einer Schleife, das Ändern eines zusammengeführten Stils anstelle von drei oder das Hinzufügen nur von Skripten, die tatsächlich ausgeführt werden.
Dieser Artikel zeigt einige Änderungen, die die Leistung von Webanwendungen verbessern können, und behandelt ECMAScript – die Kernsprache von JavaScript, DOM und Dateiladen.
Tipp
ECMAScript
Vermeiden Sie die Verwendung von eval oder Funktionskonstruktoren
Eval neu schreiben
Wenn Sie eine Funktion benötigen, verwenden Sie die Funktion
Nicht verwenden mit
Verwenden Sie try-catch-finally nicht in Funktionen, die Leistung erfordern
Isolieren Sie die Verwendung von eval und with
Verwenden Sie es nicht um globale Variablen zu verwenden
Achten Sie auf die implizite Ersetzung von Objekten
Vermeiden Sie die Verwendung von for-in in Funktionen, die Leistung erfordern
Verwenden Sie die kumulative Form, um Zeichenfolgen zu verketten
Grundlegendes Operationsverhältnis Das Aufrufen von Funktionen ist schneller
Übergabe von Funktionen anstelle von Zeichenfolgen für setTimeout() und setInterval()
DOM
Neuzeichnen und Umfließen
Minimiert die Anzahl der Reflows
Minimaler Reflow
Dokumentbaum ändern
Unsichtbare Elemente ändern
Maß
Eine Änderung Mehrere Stile
Glätte für Geschwindigkeit
Vermeiden Sie das Abrufen einer großen Anzahl von Knoten
Verbessern Sie die Geschwindigkeit durch XPath
Vermeiden Sie Änderungen beim Durchlaufen des DOM
Verwenden Sie Variablen, um DOM-Werte in Skripten zwischenzuspeichern
Laden von Dokumenten
Vermeiden Sie die Beibehaltung derselben Referenz zwischen mehreren Dokumenten
Schnelle Verlaufsnavigation
Verwenden Sie XMLHttpRequest
zum dynamischen Erstellen von