Heim >Web-Frontend >HTML-Tutorial >Tutorial zur HTML-Webseitenproduktion: Verwenden Sie Iframe-Tags mit Vorsicht_HTML/Xhtml_Webseitenproduktion

Tutorial zur HTML-Webseitenproduktion: Verwenden Sie Iframe-Tags mit Vorsicht_HTML/Xhtml_Webseitenproduktion

WBOY
WBOYOriginal
2016-05-16 16:42:411365Durchsuche

Durch die Verwendung von iframe können problemlos Seiten anderer Websites aufgerufen werden, es sollte jedoch mit Vorsicht verwendet werden. Es kostet das Zehn- oder sogar Hundertfache mehr Leistung als das Erstellen anderer DOM-Elemente (einschließlich Stil und Skript). Der Zeitvergleich des Hinzufügens von 100 verschiedenen Elementen zeigt, wie leistungsintensiv Iframes sind:

Seiten, die Iframes verwenden, haben normalerweise nicht so viele Iframes, sodass Sie sich keine allzu großen Gedanken über die Zeit machen müssen, die zum Erstellen des DOM benötigt wird. Besorgniserregender sind das Onload-Ereignis und der Verbindungspool.

Iframe blockiert Onload

Es ist sehr wichtig, dass das Onload-Ereignis des Fensters so schnell wie möglich ausgeführt wird. Dadurch wird die Ladefortschrittsanzeige des Browsers vervollständigt, anhand derer der Benutzer feststellen kann, ob der Ladevorgang der Seite abgeschlossen ist. Durch die Verzögerung des Onload-Ereignisses hat der Benutzer das Gefühl, dass die Seite langsam ist.

Das Onload-Ereignis des Fensters wird erst ausgelöst, wenn alle darin enthaltenen Iframes und die Ressourcen in allen Iframes vollständig geladen sind. In Safari und Chrome kann dieses blockierende Verhalten vermieden werden, indem Javascript verwendet wird, um dem src des Iframes dynamisch einen Wert zuzuweisen.

Ein Verbindungspool

Der Browser öffnet nur eine sehr kleine Anzahl von Verbindungen zu jedem Webserver. Ältere Browser, einschließlich IE 6/7 und Firefox 2, verfügen nur über 2 Verbindungen pro Host. In neuen Browsern erhöht sich die Anzahl der Verbindungen. Safari 3 und Opera 9 wurden auf 4 erhöht, und Chrome 1, IE 8 und Firefox 3 wurden auf 6 erhöht.

Man könnte für jeden Iframe einen separaten Verbindungspool erwarten, aber das ist nicht der Fall. In den meisten Browsern wird die Verbindung zwischen der Hauptseite und ihrem Iframe gemeinsam genutzt, was bedeutet, dass Ressourcen im Iframe die verfügbaren Verbindungen belegen und das Laden der Ressourcen der Hauptseite blockieren können. Dies ist in Ordnung, wenn der Inhalt im Iframe genauso wichtig oder wichtiger ist als die Hauptseite. Unter normalen Umständen ist der Inhalt im Iframe jedoch für die Seite nicht wichtig und es ist nicht ratsam, dass der Iframe die Anzahl der Verbindungen belegt. Eine Lösung besteht darin, der Quelle des Iframes dynamisch einen Wert zuzuweisen, nachdem die Ressource mit der höheren Priorität heruntergeladen wurde.

Fünf der Top-10-Websites in den Vereinigten Staaten verwenden Iframes. Die meisten davon werden zum Laden von Anzeigen verwendet. Das passt nicht so gut, ist aber verständlich und eine einfache Möglichkeit, Anzeigen in Ihre Inhalte einzufügen. In vielen Fällen ist die Verwendung von Iframes sinnvoll. Beachten Sie jedoch die Auswirkungen auf die Leistung Ihrer Seite. Bitte verwenden Sie es mit Vorsicht, sofern dies nicht erforderlich ist.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn