2013-07-19 7 views
0

La combinaison de "Dégradation des variables de script" http://ejohn.org/blog/degrading-script-tags/ et Script DOM Element est un bon motif pour charger le JavaScript externe de manière asynchrone et le coupler avec le code en ligne.Chargement JavaScript asynchrone et couplage avec le code en ligne

Steve Souders décrit la combinaison bien dans cet article: http://www.stevesouders.com/blog/2008/12/27/coupling-async-scripts/

Fondamentalement, le script sur une page est déclenchée par le script externe une fois que script externe a été chargé. Je me demandais ce qui se passerait si le script qui est exécuté lorsque le script externe a été téléchargé a essayé d'ajouter des gestionnaires d'événements. Il est possible que le chargement du DOM ne soit pas terminé et que l'ajout d'un gestionnaire d'événements puisse échouer.

Cependant, l'article de Steve Souders est très complet et parle même de Lazy Loading. Cela signifie que le script externe n'est pas téléchargé tant que la page n'a pas été chargée (car l'élément de script ajouté au DOM est exécuté dans window.onload). Cela garantit que l'ajout de gestionnaires d'événements devrait fonctionner. Alors tout peut sembler bien, mais il me reste un problème: vu que nous avons attendu le chargement de la page, l'utilisateur pourrait interagir avec la page et peut-être même quitter la page avant que les gestionnaires d'événements aient été ajoutée.

Est-ce que mon niggle est une préoccupation valable? Et si oui, existe-t-il un moyen robuste de le résoudre?

Merci, Paul

Répondre

0

Vous pouvez ajouter des éléments de script dans le DOM pendant le chargement. Saisissez simplement une référence à l'élément head dans votre script inline et injectez vos assets. De cette façon, vous lancez le navigateur pour charger les scripts externes pendant le rendu du DOM.

Et vous avez raison, car les scripts injectés sont chargés en mémoire ne signifie pas que l'événement DOMContentLoaded a été déclenché. Vous devez écouter cet événement pour exécuter une commande DOM liée au rappel lorsque tous les actifs externes sont chargés.

Questions connexes