Bücher online kostenlos Kostenlos Online Lesen
JQuery Kochbuch (German Edition)

JQuery Kochbuch (German Edition)

Titel: JQuery Kochbuch (German Edition) Kostenlos Bücher Online Lesen
Autoren: jQuery Community Experts
Vom Netzwerk:
wunderbar. Sie können jedem Objekt jederzeit Eigenschaften und Methoden hinzufügen und die JavaScript-Laufzeitumgebung wird sich darum kümmern, die richtigen Dinge anzusprechen, wenn Sie sie benötigen.
    Nimmt man beides zusammen, kann dies zu einer ganzen Menge Name Lookups führen.
    ----
    Note
    Die modernsten JavaScript-Interpreter haben sich in diesem Bereich stark weiterentwickelt. Aber wenn Sie wollen, dass Ihr Code in allen verbreiteten Browsern – wie zum Beispiel beliebigen IE-Versionen – schnell läuft, sollten Sie sich trotzdem Gedanken um die Anzahl der Name Lookups machen.
    ----
    Schauen Sie sich folgenden Code an:
// Ein klassischer Funktions-Wrapper, um einen lokalen Scope zu erhalten
(function() {
    // Maximalen absoluten Wert in einem Zahlen-Array finden
    function maxMagnitude( array ) {
     var largest = -Infinity;
     $.each( array, function() {
     largest = Math.max( largest, Math.abs(this) );
     });
     return largest;
    }
    // Anderer Code, der maxMagnitude für ein großes Array aufruft
})();
    Denken Sie daran, dass JavaScript erst im lokalen Gültigkeitsbereich (der Funktion) nach einem Namen sucht. Wird der Name dort nicht gefunden, arbeitet sich die Laufzeitumgebung durch die nächsten eingebetteten Funktionen bis zum globalen Scope nach oben. Die JavaScript-Laufzeitumgebung muss nicht nur jeden Namen bei jeder Verwendung nachschlagen, sondern diese Lookups auch noch wiederholen, wenn die Namen in übergeordneten Funktionen oder im globalen Scope definiert sind.
    Befindet sich dieser Code-Block im globalen Gültigkeitsbereich, führt der
each()
-Callbackbei jeder Iteration die folgenden Name Lookups durch:
    1.  
largest
 im lokalen Scope [erfolglos]
2.    
largest
 in 
MaxMagnitude()
 [erfolgreich]
3.
  Math
 im lokalen Scope [erfolglos]
4.    
Math
 in 
MaxMagnitude()
 [erfolglos]
5.      
Math
 in der anonymen Wrapper-Funktion [erfolglos]
6.        
Math
 im globalen Scope [erfolgreich]
7.          
abs
 im 
Math
-Objekt [erfolgreich]
8.  
Math
 im lokalen Scope [erfolglos]
9.    
Math
 in 
MaxMagnitude()
 [erfolglos]
10.    
Math
 in der anonymen Wrapper-Funktion [erfolglos]
11.      
Math
 im globalen Scope [erfolgreich]
12.        
max
 im 
Math
-Objekt [erfolgreich]
13.  
largest
 im lokalen Scope [erfolglos]
14.    
largest
 in 
MaxMagnitude()
 [erfolgreich]
    Nun schreiben wir den Code wie folgt um:
// Ein klassischer Wrapper, um einen lokalen Scope zu erhalten
(function() {
    // Maximalen absoluten Wert in einem Zahlen-Array finden
    function maxMagnitude( array ) {
     var abs = Math.abs, max = Math.max;
     var largest = -Infinity;
     for( var i = −1, n = array.length; ++i < n; ) {
     largest = max( largest, abs(array[i]) );
     }
     return largest;
    }
    // Anderer Code, der maxMagnitude für ein großes Array aufruft
})();
    Damit wird nicht nur die Callback-Funktion in jeder Iteration vermieden, sondern auch noch die Anzahl an Name Lookups in jeder Iteration um 10 oder mehr verringert. Der Schleifen-Rumpf führt in dieser Version folgende Name Lookups durch:
    1.  largest im lokalen Scope [erfolgreich]
2.  abs im lokalen Scope [erfolgreich]
3.  max im lokalen Scope [erfolgreich]
4.  largest im lokalen Scope [erfolgreich]
    Dies stellt gegenüber der ersten Version eine Verbesserung um mehr als 70% dar.
    Ist der Code noch tiefer in einer anderen Funktion verschachtelt, dann sind die Unterschiede noch größer, da jede verschachtelte Funktion einen weiteren Lookup für jeden der
Math
-Objekt-Lookups hinzufügt.
    ----
    Note
    Wir ignorieren hier die Lookups für
this
und
array[i]
, wie auch für die
for
-Schleife selbst. Sie sind in beiden Versionen ziemlich gleich.
    ----
    In Tabellen schneller laden sorgt eine einzelne Name Lookup-Optimierung für eine Verbesserung von 100 ms. Das ist kein großer Unterschied, aber eine zehntel Sekunde Verbesserung beim Laden Ihrer Seite durch eine Zeile Code ist doch ein guter Schnitt, oder?
    Der ursprüngliche Code ruft
esc()
in jedem Schleifendurchlauf sechs Mal auf, was zu insgesamt 6.000 Aufrufen im Fall des Tausend-Namen-Testfalls führt. Diese Aufrufe befinden sich innerhalb von drei verschachtelten Funktionen, und
esc()
ist eine globale Funktion, daher braucht man vier Name Lookups, um nur den Funktionsnamen für jeden Aufruf aufzulösen. Das sind 24.000 Name Lookups!
    Der verbesserte Code verringert die

Weitere Kostenlose Bücher