Erweiterte Tools, Hintergründe & Techniken - JavaScript: Die Universelle Sprache zur Web-Programmierung - page 325

in allen anderen Situationen in fast allen Browsern erhebliche Vorteile, insbesondere dann,
wenn ein Browser einen JIT-Compiler verwendet. Beim Einsatz von eval() müssen JIT-Com-
piler für die Ausführung nämlich in den langsamen Interpreter-Modus umschalten. Dieses
Rezept beschreibt somit eine der efektivsten Optimierungsmaßnahmen.
Variablen bei der Deklaration immer mit einem Wert versehen und
nach Möglichkeit explizit als lokal kennzeichnen
Einer der größten Geschwindigkeitsfresser in JavaScript ist es, wenn Sie in einer Funktion
mit einer lokalen Variable arbeiten wollen und diese nicht als lokal kennzeichnen. Wenn Sie
beispielsweise in einer Funktion explizit eine Variable einführen, sie nur dort benutzen und
sie aber nicht mit var kennzeichnen, lösen Sie im JavaScript-Interpreter eine sogenannte
Tiefensuche aus. Das bedeutet, dass der Interpreter im lokalen Kontext auf einen Token
stößt, den er aulösen muss. Er muss nachsehen, wo die Variable deklariert wurde. Wenn
diese Variable nicht ausdrücklich als lokal gekennzeichnet ist, muss der Interpreter außer-
halb der Funktion suchen, ob sie dort nicht schon deiniert ist. Und dabei klappert er alle
Gültigkeitsbereiche des Skripts ab, in denen die Variable eingeführt sein könnte, von ganz
außen anfangend. Erst wenn er bis zum lokalen Kontext keine Deklaration der Variable
entdeckt, schließt er daraus indirekt darauf, dass die Variable in der Funktion eingeführt
wurde. Es ist ofensichtlich, wie lange so eine Suche dauern kann. In verschiedenen Mes-
sungen hat sich gezeigt, dass das explizite Deklarieren einer lokalen Variable mit var von
allen Optimierungsmaßnahmen die größten Geschwindigkeitsvorteile überhaupt bringt. Es
ist also mit Abstand die efektivste Maßnahme zur Optimierung ihrer Skripte und unab-
dingbar für einen guten Programmierstil. Des Weiteren sollten Sie auch Variablen grund-
sätzlich bei der Deklaration einen Wert zuweisen. Das vermeidet, dass der JavaScript-Inter-
preter in seiner Symboltabelle nachschlägt, und auch das macht ein Skript schneller.
Bei setTimeout() und setInterval() Funktionsreferenzen oder
anonyme Funktionen verwenden
Das nachfolgende Rezept ist ebenfalls sehr sinnvoll. Es ist efektiver, wenn Sie bei setTimeout()
und setInterval() Funktionsreferenzen oder anonyme Funktionen als ersten Parameter
verwenden, statt Funktionsaufrufe in Strings zu notieren. Denn bei einer Notation eines
Strings mit einem Funktionsaufruf als erstem Parameter wird von einigen (älteren)
JavaScript-Engines im Hintergrund eval() aufgerufen. Und damit kommt der langsame
Interpreter-Modus zum Tragen. Bei einer Funktionsreferenz oder anonymen Funktionen
kann insbesondere also ein JIT-Compiler Optimierungen vornehmen. Allerdings muss man
beachten, dass die Performance bei diesen Methoden ja sowieso keine echte Rolle spielt, da
man damit ja explizit verzögern will.
Das DOM der Webseite nicht permanent dynamisch verändern
Sie können das DOM einer Webseite mittels der Methoden document.createElement()
und appendChild() von einem node -Objekt dynamisch zusammenbauen. Nur sollte man
beachten, dass jeder Aufruf von appendChild() zum Einfügen von Elementen in das DOM
der Webseite den Browser dazu zwingt, die ganze Webseite neu aufzubauen. Von daher
sollte man insbesondere appendChild() so selten wie möglich auf das DOM der gesamten
Webseite einsetzen und lieber einen kompletten DOM-Zweig zuerst erzeugen und dann in
einem Schritt in das DOM der Webseite einfügen.