2010-12-09 5 views
3

Ich fange an zu spielen mit Boomerang für die Messung der Leistung. Es ist sehr vielversprechend. Während ich die Latenz, die Bandbreite und die Seitenladezeiten messen kann, möchte ich auch versuchen, die Zeit zu bekommen, die für das Rendern der ersten HTML-Seite benötigt wurde. Wäre es einfach, den Zeitpunkt zu protokollieren, zu dem der Browser begann, das Javascript zu analysieren (was nahe ist, als es anfing), um eine Schätzung der Serverzeit zu erhalten, muss ich herausfinden, wie viel Netzwerkzeit abzuziehen ist. Um das zu tun, muss ich wissen, wie groß das HTML-Dokument ist.Lesen Größe des aktuellen Dokuments von Javascript

Wie kann ich dies von Javascript sagen?

Das Dokument-Objekt scheint keine Eigenschaft innerhtml

I

totsize=document.HEAD.innerHTML.length + document.BODY.innerHTML.length; 

Kopf und Körper Entitäten in dem DOM-Browser in Firefox erscheinen versucht zu haben - aber wenn ich den Code versuchen, oben ich ein undefinierter Fehler - auch mit "Kopf" versucht - vergeblich.

Irgendwelche Ideen?

(beachten Sie, dass Javascript in einer separaten Datei gespeichert ist und in den meisten Fällen zwischengespeichert wird - das ist also kein großes Problem).

Ich habe Google versuchen - aber ich nur viele Seiten bekommen beschreibt die Bildschirmgröße von HTML-Elemente und die Fensterabmessungen :(

TIA

Antwort

4

Wie wäre es document.documentElement.innerHTML.length

+0

Dank meder - das ist genau das, was ich gesucht :)) – symcbean

+0

'HEAD' und' BODY' btw klein geschrieben werden sollte. –

2

document.documentElement.innerHTML.length wie? Per @ Meder ist wahrscheinlich gut genug. Es wird nicht genau sein, weil es eine Serialisierung der aktuellen Seite DOM und nicht die ursprüngliche HTML-Quelle zurückgibt.

Bei statischen Seiten spielt das keine Rolle, da es sich hier nur um ein extra close-Tag handeln wird. Dort werden verschiedene Attribut-Quotes angegeben. Wenn jedoch aus dem Skript viel Seiteninhalt erstellt wird, zählt dieser Inhalt innerHTML Obwohl in der ursprünglichen Quelle nicht vorhanden, die Ihre Berechnung auswerfen könnte.

Wenn Sie die tatsächliche Ressource Länge herauszufinden müssen, dann würden Sie brauchen, um die Seite wieder zu holen, was Sie XMLHttpRequest auf die aktuelle URL tun könnte:

var xhr= new XMLHttpRequest(); 
xhr.onreadystatechange= function() { 
    if (this.readyState!==4) return; 
    alert(this.responseText.length); 
}; 
xhr.open('GET', location.href, true); 
xhr.send(); 

(Das kann nicht sein erledigt, wenn die Seite das Ergebnis einer POST-Anfrage ist.)

Dies gibt Ihnen eine Größe in Zeichen. Wenn Sie eine Einzelbyte-Codierung wie ISO-8859-1 verwenden, ist die Bytegröße für das Laden im Netzwerk die gleiche. Wenn Sie mit UTF-8, dann können Sie die Byte-Größe herausfinden, indem Sie die Zeichenfolge in UTF-8-Byte-as-Code-Einheiten umzuwandeln, für die es ein kurzer idiomatischer Hack:

var bytes= unescape(encodeURIComponent(this.responseText)); 
alert(bytes.length); 

Wenn Sie haben das Pech, eine Nicht-UTF-8-Multibyte-Kodierung zu verwenden, Sie können hier nicht viel tun; Sie müssten vollständige Mapping-Tabellen für die Codierung einschließen, die für ostasiatische Kodierungen wahnsinnig groß wären.

+0

danke für das Update (nachdem ich akzeptiert habe!) - nützliche Tipps. – symcbean

0

Wie wäre es damit?:

/* 
* This script determines the size of the current page in bytes. 
* But why does the 2nd length differ from the first? 
*/ 
var len=document.getElementsByTagName("html")[0].innerHTML.length; 
var len2=document.getElementsByTagName("head")[0].innerHTML.length + document.getElementsByTagName("body")[0].innerHTML.length; 
//document.body.innerHTML.length 
alert('Page Size: '+len +' bytes'); 
alert('Page Size2: '+len2+' bytes'); 

Es scheint zu funktionieren, aber nicht großartig. Da gibt es zwei verschiedene Längen. Aber warum? Ugh! Diese Formatierung bringt mich um.

EDIT: Kann jemand bitte diese Formatierung beheben? Mein Browser funktioniert anscheinend nicht richtig. Firefox 15.x

EDIT: feste Formatierung

Verwandte Themen