In unserer Firma kombinieren wir jede Javascript-Datei in einer großen (ca. 700kb, aber wachsend) minimierten und gzippten Javascript-Datei. Ich versuche, die Leistungsunterschiede zwischen der Verwendung einer großen Javascript-Datei für jede Seite (minimized und gzipped) und die Verwendung mehrerer Javascript-Dateien, eine für jede Seite.
Ein offensichtlicher Unterschied ist, dass die große Javascript-Datei von Browsern zwischengespeichert werden kann, nachdem sie auf die erste Seitenanforderung geladen wurde und danach wenig Overhead erzeugt wird, während bei mehreren js-Dateien mindestens eine nicht zwischengespeicherte get-Anforderung vorhanden ist andere Seite. Also würde ich eine langsamere erste anfängliche Seitenladung für langsamere aufeinanderfolgende anfängliche Seitenladevorgänge handeln.
Um herauszufinden, wann die langsame erste Seitenladung (unter Verwendung einer großen Javascript-Datei) problematisch genug wird, um die zusammengefügte Datei in kleinere Dateien zu zerlegen und unsere Build-Prozedur zu ändern, würde ich gerne herausfinden wie lange es dauert, bis der Code geparst ist, so kann ich die gesamte Lade- und Parsingzeit abschätzen.
Bisher habe ich versucht, einer Testseite ein Skript-Tag hinzuzufügen, das die aktuelle Zeit verwendet, ein dickes Skript mit Javascript anfügt und danach die Zeit erneut misst:
%Vor%Am Ende von 700kbCombineFile.js habe ich angehängt:
%Vor%Dann subtrahiere ich die Netzwerktransferzeit, die ich von Firebug erhalten habe und erhalte ca. 700ms für eine 700 kb Datei und ca. 300ms für eine 300 kb Datei.
Macht dieser Ansatz Sinn? Warum nicht? Gibt es einen besseren Weg / irgendwelche Werkzeuge dafür?
Die Zeit, die zum Analysieren des JavaScript benötigt wird, variiert erheblich zwischen den Browsern.
Was Sie haben, ist die beste Methode, die ich mir vorstellen kann, um die Parse-Zeit zu messen, aber . Ich würde in Frage stellen, ob dies die beste Messung ist, um zu beurteilen, welcher Ansatz effektiver ist.
Persönlich würde ich die Zeit berücksichtigen, die das load -Ereignis auf der window benötigt, um ab dem Zeitpunkt, zu dem die Seite angefordert wurde, eine bessere Messung zu erhalten.
Die Zeit, die zum Herunterladen der Seite benötigt wird, ist wichtig, und eine Datei immer wurde nach dem ersten Laden nur in einer perfekten Welt gespeichert.
denke ich
console.time("Parsetime")
und
console.timeEnd("Parsetime")
gibt Ihnen eine genauere Messung als das Date-Objekt,
Artikel über JavaScript-Zeitgenauigkeit
Tags und Links javascript