Performancegewinn durch paralleles Download, z.B. über ein CDN (Content Distribution Network)
Browser können nur eine begrenzte Anzahl von parallelen (gleichzeitigen) Downloads von einer Domäne ausführen. Um mehr parallele Downloads zu ermöglichen, können die Daten auf mehrere Domänen verteilt werden oder Sie nutzen ein CDN (Content Distribution Network). Dies erfordert zwar ein zusätzliches Lookup je Domäne, doch dieser Zeitaufwand ist vernachlässigbar im Vergleich zu der Einsparung durch die parallelen Downloads.
Beispiel für paralleles Download über Subdomänen
- Inhalte laden von: http://www.beispiel.de/...
- Bilder und CSS laden von: http://style.beispiel.de/...
- Scripte laden von: http://script.beispiel.de/...
Beachten Sie, falls z.B. Hintergrundbilder in CSS-Dateien eingebunden sind, dass beide von der gleichen Subdomäne gelesen werden.
Beispiel für paralleles Download von verschiedenen Domänen
- Inhalte laden von: http://www.beispiel.de/...
- Bilder und CSS laden von: http://www.meine-bilder.de/...
- Scripte laden von: http://www.meine-scripte.de/...
Paralleles Download über CDN (Content Distribution Network)
In der Praxis verwendet man oft parallele Downloads, um häufig verwendete Script-APIs zu laden.
Ein typisches Beispiel ist das Javascript Framework jQuery.
Dies kann z.B. über das Google API CDN eingebunden werden:
http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
Die Wahrscheinlichkeit, dass dieses weit verbreitete Script mit dem identischen Aufruf auch auf anderen (fremden) Websites verwendet wird, ist sehr hoch.
Folglich befindet sich das Script evtl. bereits im eigenen Browsercache. So gewinnt man nicht nur an Performance durch das verteilte Lesen,
sondern zusätzlich, indem das Script bereits im Cache vorliegt.
Bauen Sie zu Ihrer Sicherheit immer eine Rückfallposition ein, falls – aus welchen Gründen auch immer – die entfernten Scripte nicht geladen werden können.
In diesem Beispiel wird zuerst versucht, jQuery von Google zu laden. Falls dies misslang, nimmt man die lokale Version.
<script type="text/javascript">
if(typeof jQuery == 'undefined')
document.write('<script type="text/javascript" src="js/jquery.min.js"><\/script>');
</script>
Häufig verwendete CDN-Systeme finden Sie unter https://trusted.de/cdn-content-delivery-network.
Ob Sie Scripts-APIs von Google oder von anderen CDN-Systemen lesen, ist natürlich Ihre Entscheidung.
Argumente Pro-CDN:
- geringe Latenzzeit
- mehr parallele Downloads
- effektives Caching
Argumente Contra-CDN:
- zusätzlicher DNS-Lookup
- Der CDN-Anbieter (z.B. Google) erhält zusätzliche Informationen, z.B. auf welchen Webseiten die APIs eingebunden sind.
- Änderungen in den eingebundenen Scripten können Auswirkungen auf die Funktionalität Ihrer Webseiten haben.
- Falls man lokal entwickelt, muss immer eine Internetverbindung vorhanden sein. Es sei denn, man hat die Rückfallposition implementiert.
Zusatz-Tip:
- So binden Sie jQuery in der Version 1.7.2 ein:
http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js - So binden Sie die neueste Version von jQuery 1.7 ein:
http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js - So binden Sie die neueste Version von jQuery 1 ein:
http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js