© Liashko/Shutterstock.com
Entwickler Magazin
Zehn Dinge, die man über JavaScript wissen muss

Die 10 Gebote

JavaScript, die am meisten missverstandene Sprache der Welt, führt bei Ein- und Umsteigern häufig zu vermehrtem Haarausfall. Doch wie immer gilt: Mit der Erfahrung kommt die Routine und mit der Routine verringern sich die Stolpersteine. Grund genug, bereits zum Einstieg auf bestimmte Eigenheiten der Sprache einzugehen, die nicht jedem bekannt sind.

Christian Wenz


JavaScript steckt voller Mysterien. Doch eigentlich ist die Sprache gar nicht so schwierig, eher vielleicht eigen. Die folgenden zehn Fakten vermitteln ein solides Grundwissen der Sprache und erklären so manche Merkwürdigkeit. Damit sollten Sie als Entwickler eine profunde Basis zum Einstieg in die JavaScript-basierte Cross-Plattform-Entwicklung in petto haben.

1. Scripts laden

JavaScript in eine HTML-Seite zu integrieren, ist trivial – -Element und fertig. Doch wie sieht es mit der Ladereihenfolge aus? Nehmen wir folgendes klassisches Beispiel aus dem Single-Page-Application-(SPA-)Umfeld:

In diesem Fall wird AngularJS verwendet; der Code in der Datei app.js wiederum hängt von dem Framework ab und verwendet dessen Funktionalitäten. Was passiert nun, wenn angular.js deutlich größer ist als app.js und dementsprechend länger zum Laden braucht? Wird dann gar der Code aus letzterer Datei zuerst ausgeführt, was mangels vorhandenen Frameworks zu Fehlern führt?

Zum Glück ist das nicht so. In obigem Code ist die Ausführungsreihenfolge garantiert. Wenn mehrere JavaScript-Dateien geladen werden, kommt der Code in exakt der angegebenen Reihenfolge zur Ausführung. Gerade in älteren Browsern blockiert das Laden von JavaScript-Code den Ablauf der Seite, weswegen eine häufig gegebene (aber je nach Anwendungsfall nicht unumstrittene) Empfehlung lautet, JavaScript-Code möglichst spät zu laden. Die Diskussion hierüber führt an dieser Stelle zu weit, aber prinzipiell ist klar: Wir können uns innerhalb von app.js theoretisch darauf verlassen, dass angular.js bereits geladen und ausgeführt worden ist. Der Fall, dass app.js vor angular.js zur Ausführung kommt, kann nicht eintreten. Was allerdings passieren kann, ist, dass das Laden der angular.js-Datei fehlschlägt, etwa weil der Server oder das CDN (Content Delivery Network) ausfällt. Eine entsprechende Überprüfung in app.js, ob das Laden erfolgreich war (im vorliegenden Fall etwa, ob die Variable angular existiert), ist somit keine schlechte Idee.

Aktuelle Browser unterstützen darüber hinaus ein verzögertes Laden und Ausführen von Skriptcode (Abb. 1):

lädt JavaScript-Code sofort, aber nicht blockierend. Der Browser wartet aber mit der Ausführung, bis das DOM bereit ist. lädt Code ebenfalls sofort, aber nicht blockierend, und führt ihn (im Gegensatz zu defer) schnellstmöglich aus, unabhängig vom Fortschritt des HTML-Parsers.

Abb...

Entwickler Magazin
Zehn Dinge, die man über JavaScript wissen muss

Die 10 Gebote

JavaScript, die am meisten missverstandene Sprache der Welt, führt bei Ein- und Umsteigern häufig zu vermehrtem Haarausfall. Doch wie immer gilt: Mit der Erfahrung kommt die Routine und mit der Routine verringern sich die Stolpersteine. Grund genug, bereits zum Einstieg auf bestimmte Eigenheiten der Sprache einzugehen, die nicht jedem bekannt sind.

Christian Wenz


JavaScript steckt voller Mysterien. Doch eigentlich ist die Sprache gar nicht so schwierig, eher vielleicht eigen. Die folgenden zehn Fakten vermitteln ein solides Grundwissen der Sprache und erklären so manche Merkwürdigkeit. Damit sollten Sie als Entwickler eine profunde Basis zum Einstieg in die JavaScript-basierte Cross-Plattform-Entwicklung in petto haben.

1. Scripts laden

JavaScript in eine HTML-Seite zu integrieren, ist trivial – -Element und fertig. Doch wie sieht es mit der Ladereihenfolge aus? Nehmen wir folgendes klassisches Beispiel aus dem Single-Page-Application-(SPA-)Umfeld:

In diesem Fall wird AngularJS verwendet; der Code in der Datei app.js wiederum hängt von dem Framework ab und verwendet dessen Funktionalitäten. Was passiert nun, wenn angular.js deutlich größer ist als app.js und dementsprechend länger zum Laden braucht? Wird dann gar der Code aus letzterer Datei zuerst ausgeführt, was mangels vorhandenen Frameworks zu Fehlern führt?

Zum Glück ist das nicht so. In obigem Code ist die Ausführungsreihenfolge garantiert. Wenn mehrere JavaScript-Dateien geladen werden, kommt der Code in exakt der angegebenen Reihenfolge zur Ausführung. Gerade in älteren Browsern blockiert das Laden von JavaScript-Code den Ablauf der Seite, weswegen eine häufig gegebene (aber je nach Anwendungsfall nicht unumstrittene) Empfehlung lautet, JavaScript-Code möglichst spät zu laden. Die Diskussion hierüber führt an dieser Stelle zu weit, aber prinzipiell ist klar: Wir können uns innerhalb von app.js theoretisch darauf verlassen, dass angular.js bereits geladen und ausgeführt worden ist. Der Fall, dass app.js vor angular.js zur Ausführung kommt, kann nicht eintreten. Was allerdings passieren kann, ist, dass das Laden der angular.js-Datei fehlschlägt, etwa weil der Server oder das CDN (Content Delivery Network) ausfällt. Eine entsprechende Überprüfung in app.js, ob das Laden erfolgreich war (im vorliegenden Fall etwa, ob die Variable angular existiert), ist somit keine schlechte Idee.

Aktuelle Browser unterstützen darüber hinaus ein verzögertes Laden und Ausführen von Skriptcode (Abb. 1):

lädt JavaScript-Code sofort, aber nicht blockierend. Der Browser wartet aber mit der Ausführung, bis das DOM bereit ist. lädt Code ebenfalls sofort, aber nicht blockierend, und führt ihn (im Gegensatz zu defer) schnellstmöglich aus, unabhängig vom Fortschritt des HTML-Parsers.

Abb...

Neugierig geworden?


   
Loading...

Angebote für Teams

Für Firmen haben wir individuelle Teamlizenzen. Wir erstellen Ihnen gerne ein passendes Angebot.

Das Library-Modell:
IP-Zugang

Das Company-Modell:
Domain-Zugang