Quels sont les avantages et les inconvénients de l'ajout

Answer 1

Un inconvénient majeur est l'incompatibilité du navigateur. Tous les navigateurs vont chercher correctement et intégrer les ressources dans les DOM, il est donc risqué d'utiliser cette approche. Ceci est plus vrai que les scripts de feuilles de style.

Une autre question est l'un des maintenabilité. Concaténer et les chaînes d'écriture pour ajouter des éléments DOM sur le client'side peut devenir un cauchemar de maintenance. Il est préférable d'utiliser des méthodes DOM telles que createElement pour créer des éléments sémantiquement.

Un avantage évident est qu'il fait usage conditionnel des ressources beaucoup plus facile. Vous pouvez avoir une logique qui détermine les ressources à la charge, ce qui réduit la consommation de bande passante et le temps de traitement global de la page. J'utiliser un appel bibliothèque tels que jQuery $ .getScript () pour charger des scripts par rapport document.write. L'avantage étant que cette approche est plus propre et vous permet également d'avoir un code exécuté lorsque la requête est terminée ou échoue.

Answer 2

Eh bien, je peux aussi bien jeter mon chapeau dans l'anneau sur celui-ci ...

Si vous examinez la bibliothèque de fermeture de Google, base.js, vous verrez que document.write est utilisé dans leur fonction writeScriptTag_(). Ceci est une partie essentielle du système de gestion de la dépendance qui « fermeture » fournit, et est un énorme avantage lors de la création d'un multi-fichiers compliqué, application javascript base bibliothèque - il permet le fichier / pré-requis de code déterminer l'ordre de chargement. Nous utilisons actuellement cette technique et avons eu peu de mal avec elle. TBH, nous n'avons pas eu un seul problème avec la compatibilité du navigateur, et nous tester régulièrement sur IE 6/7/8, FF3 / 2, Safari et Chrome 4/5 dernier.

Le seul inconvénient que nous avons eu jusqu'à présent est qu'il peut être difficile de traquer les problèmes causés par le chargement d'une ressource deux fois, ou de ne pas charger du tout. Depuis l'acte de chargement des ressources est programmatique, il est soumis à des erreurs de programmation, et contrairement à l'ajout d'étiquettes directement au code HTML, il peut être difficile de voir ce que l'ordre de chargement est exacte. Toutefois, cette question peut être surmonté en grande partie à l'aide d'une bibliothèque avec une certaine forme de système de gestion des dépendances telles que la fermeture ou dojo.

EDIT: J'ai fait quelques commentaires à cette nature, mais je pensais qu'il valait mieux résumer ma réponse: Il y a quelques problèmes avec dojo.require () et jQuery.getScript () (les deux qui effectuent ultimiately une demande ajax et eval).

1. chargement via ajax moyen de scripts intersites pas - dire pas javascript de chargement qui ne sont pas de votre site. Ce sera un problème si vous voulez inclure https://ajax.googleapis.com comme indiqué dans la description.
2. scripts Eval'd ne sera pas affiché dans une liste de débogueur de scripts javascript page, ce qui rend le débogage assez difficile. Derniers communiqués de Firebug seront cependant les noms de fichiers sont vous montrer le code eval'd, perdu faisant l'acte de mise en points d'arrêt fastidieux. Autant que je sache, Webkit javascript console et outils de développement IE8 ne pas Afficher les scripts eval'd.

Answer 3

Il a l'avantage que vous n'avez pas besoin de répéter les références de script dans chaque fichier HTML. L'inconvénient est que le navigateur doit chercher et exécuter le fichier principal javascript avant de pouvoir charger les autres.

Answer 4

Je suppose que l'un des avantages que je pouvais penser serait si vous utilisez ces scripts sur plusieurs pages, il suffit de se rappeler d'inclure un scénario, et il enregistre un peu d'espace.

Answer 5

Google PageSpeed, ils découragent fortement d'utiliser cette technique, car elle rend les choses plus lent. Mis à part le chargement séquentiel de votre script.js avant tous les autres, il y a un autre hic:

Les navigateurs modernes utilisent des parseurs spéculatifs à plus de découvrir efficacement les ressources externes [...] Ainsi, en utilisant le JavaScript document.write de () pour chercher des ressources extérieures, il est impossible pour l'analyseur spéculatif de découvrir ces ressources, ce qui peut retarder le téléchargement, l'analyse syntaxique, et le rendu de ces ressources.

Answer 6

Il est également possible que cela a été écrit comme une recommandation par un cabinet de SEO pour faire l'élément de tête si possible plus courte, si un contenu unique est plus proche du haut du document - en créant un rapport texte-HTML supérieur. Bien qu'il ne semble, tout-en-tout, pas comme une très bonne façon de le faire; mais il serait plus de temps d'entretien, une meilleure approche serait sans doute de se condenser javascript dans un seul fichier .js et css en un seul fichier .css, si elle était jugée absolument nécessaire de réduire la taille de l'élément de tête.

Answer 7

Un grand inconvénient est que l'ajout scripts dans la tête se met en pause le traitement du document jusqu'à ce que ces scripts ont été complètement téléchargées et exécutées parsés (parce que le navigateur pense qu'ils peuvent utiliser document.write). -. Cela nuira à la réactivité

De nos jours, il est recommandé de mettre vos balises de script droite befo </body>. Bien sûr, ce n'est pas possible 100% des temps, mais si vous utilisez unobtrusve Javascript (comme vous devriez), tous les scripts peuvent être respositioned à la fin du document.

HTML5 est venu avec l'attribut async qui suggère le navigateur que pour exécuter les scripts après le document principal a été chargé. Ceci est le comportement des scripts insérés script dans de nombreux navigateurs, mais Notin tous.

Je conseille contre en utilisant document.write à tout prix. Même sans elle, cela se traduit par une demande supplémentaire vers le serveur. (Nous aimons inimze le nombre de demandes, par exemple avec sprites css .)

Et oui, comme d'autres mentionnés plus haut, si scriping est désactivé votre page sera affichée sans CSS (ce qui le rend potentiellement inutilisable).

Answer 8

1. Si JavaScript est désactivé -. Éléments <script> and <link> ne sera pas ajouté du tout

2. Si vous placez fonctions JavaScript init au bas de la page (ce qui est une bonne pratique) et le lien CSS avec JavaScript, il peut provoquer un certain retard avant le chargement de CSS (mise en page brisée sera visible pour un court laps de temps ).