kostenloser Webspace werbefrei: lima-city

[JS] Prototype Systemauslastung

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   truckerb

   truckerb hat kostenlosen Webspace.

   20:25, 16.12.2010

   Hallo,
   Ich habe ein Projekt, bei dem es sehr stark auf die Performance ankommt. Ich muss also darauf achten, das das Script möglichst einfach ausfällt. Nun würde ich zum Programmieren gerne Prototype benutzen, weil es vieles einfacher macht. Ich befürchte nur, das dieses zusätzliche Script alles viel langsamer macht...
   
   Was sagt ihr dazu?

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. nemoinho

   

   nemoinho hat kostenlosen Webspace.

   21:42, 16.12.2010

   Einfache Antwort, ja!
   Es macht den ganzen Kram langsamer, als wenn man es nur auf Performance auslegt.
   Doch es gibt ein großes Aber, an welches du vorher denken solltest, welches dieser Scripte ist schneller?

   var runAllNodes = (function(){
     var x = document.getElementsByTagName('*');
     var i = x.length;
     var ret = [];
     for(;i-->0;){
       ret[i]=x[i].nodeName
     }
     return ret;
   })()

   oder

   var runAllNodes = (function(){
     var x = document.getElementsByTagName('*');
     var i = 0;
     var ret = [];
     for(;i++<x.length;){
       ret[i]=x[i].nodeName
     }
     return ret;
   })()

   
   Formal werden einfach alle Elementnamen in ein Array geschrieben der Unterschied ist, dass die erste Variante einfach nur nach unten zählt und die zweite nach oben, oder?
   
   Aber der entscheidene Unterschied liegt darin, dass bei der zweiten Variante immer und immer wieder auf das DOM zugegriffen wird (das length-Attribute), das ist mit riesigem Abstand die größte Bremse in jedem Script.
   Was ich damit sagen will ist, ohne einen konkreten Hintergrund kann ich dir zwar sagen, ob eine Variante schneller ist als eine Andere, aber du brauchst nur eine solche dumme Abfrage in deinem Script haben und du bist mit der Geschwindigkeit so sehr im Keller, dass ein langsameres Prototype, in einem Brenchmark, nicht einmal mehr auffält.
   
   Außerdem kann man die Scripte oben auch noch weiter optimieren, z.B. so:

   var runAllNodes = (function(d){
     var x = d.getElementsByTagName('*');
     var i = x.length;
     var ret;
     for(;i--;){
       ret[i]=x[i].nodeName;
     }
     return ret;
   })(window.document)

   Hierbei wird der Scrope der Funktion übergangen und sofort auf das window-Objekt und dessen document-Objekt zugegriffen, wodurch die Performance verbessert wird, außerdem wird auf die Unnötige Abfrage verzichtet, ob i=0 ist, denn sobald das passiert bricht die Schleife so oder so ab, da Javascript keine ausgeprägte Typisierung besitzt und daher die 0 wie false interpretiert wird, wodurch die Schleifenbedingung nicht mehr erfüllt ist.
   Auf diesem Weg macht JS halt nur einen Test, wogegen in der Ursprünglichen Variante immer geprüft wurde ob i > 0 ist, und zusätzlich, ob diese Bedingung erfüllt ist, sprich es wurden zwei Test pro Schleifendurchlauf gemacht.
   
   Wie gesagt, ich kann dir bei sowas zwar helfen aber auf die Schnauze fliegen tust du sobald du dich nicht mehr zu 100% an die Performanceoptimierungen im DOM hälst!
   
   Einige der besten Präsentationen und Videos zu diesem Thema findest du im Yahoo Theater Außerdem ist dieser Beitrag auf Youtube von Nicholas C. Zakas sehr empfehlenswert, er geht auch auf die meisten Fallstricke ein, die dir über den Weg laufen können, wenn du nicht bereits sehr viel Erfahrung mit JS selbst hast (eigene Scripte ohne Prototype, JQuery, MooTools und Konsorten…).
   
   Mit freundlichen Grüßen

4. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?