11548 sujets

JavaScript, DOM et API Web HTML5

Bonsoir à tous Smiley smile

Je viens de découvrir aujourd'hui un script JS (head.js) permettant notamment de charger tous les autres scripts de la page via son intermédiaire puis de les appeler en bas de page et de paralléliser ce chargement.

Pour ceux qui ne connaissent pas, dans le <head> :

<script type="text/javascript" src="script/head.js"></script>


L'appel de vos différents scripts en bas de page, avant </body> par exemple :

<script type="text/javascript">head.js("script/map.js", "script/roundies.js");</script>


Pour moi qui utilise de nombreux scripts sur certaines pages, j'ai pu constater un appréciable gain en temps de chargements lors de mes tests sur différents navigateurs sauf...comme vous l'aurez deviné sur IE (8, je précise car pas encore testé sur les autres) ou le script ne fonctionne pas. Il m'est impossible d'appeler mes autres scripts via son intermédiaire.

Aurais-je raté quelque chose ? Y a t-il une condition particulière à préciser ? Malgré mes recherches, je n'ai rien trouvé.

Donc avant d'abandonner son utilisation à contre-coeur, je viens solliciter vos lumières.

Merci d'avance.

Cordialement.
Je ne connais pas head.js, et donc je ne sais pas ce qu'il fait exactement. Mais pas besoin d'un script pour appeler vos fichiers js en bas de page, avant le </body>.

Vous gagnerez quand même en performance de chargement, puisque vos js ne seront téléchargés qu'en dernier.
Merci pour votre réponse.

L'avantage de ce script est qu'il permet le chargement en parallèle de tous les autres scripts, tout en choisissant malgré tout l'ordre d'exécution.
Le contenu de ma balise <head> en est aussi bien allégé.
Il a bien d'autres fonctionnalités intéressantes mais c'est l'une de celle dont j'ai le plus besoin.

Je me tournerais probablement vers votre solution 'intermédiaire', si je ne résous pas mon problème.

Merci.

Ps : pour ceux que ça intéresse, il y a un site officiel décrivant les possibilités offerte par ce script très léger en plus (2.3kb).
En effet ça a l'air intéressant !

Sans ce script, pour charger vos scripts en parallèle, vous pouvez les héberger sur des domaines différents. Enfin, il est préférable dans la mesure du possible, de limiter le nombre de fichiers JS. Moins il y a de fichiers à charger (à taille égale), plus ça ira vite.
JDW a écrit :
En effet ça a l'air intéressant !
Enfin, il est préférable dans la mesure du possible, de limiter le nombre de fichiers JS. Moins il y a de fichiers à charger (à taille égale), plus ça ira vite.


Hello,
Ce n'est pas le cas avec ce sciprt. L'intérêt et justement de charger plusieurs petits fichiers en parallèle plutôt qu'un gros qui prendra plus de temps.

D'autre part, ce plugin permet d'exécuter une fonction dès que le fichier voulu et ces dépendances sont chargées (et la page scriptable) afin d'avoir le rendu le plus vite possible.

Il faut alors éviter de combiner les fichiers javascripts si on utilise cette librairie. (et oublier la note de ySlow sur le nombre de fichiers javascript puisque c'est délibéré Smiley langue )
Pour les css et images, je suis d'accord.

ottis a écrit :
sauf...comme vous l'aurez deviné sur IE (8, je précise car pas encore testé sur les autres) ou le script ne fonctionne pas.


Etrange, cela fonctionne bien chez moi.
Je n'ai jamais utilisé roundies et donc je ne peux pas être catégorique mais peut être qu'il doit forcément être placé dans le head de part son comportement. (map.js, je ne connais pas du tout.)

Perso, j'ai testé avec jQuery et jQueryUI et ca fonctionne bien sous IE.

Attention avec le
$(document).ready

En utilisant cette librairie, rien ne garanti que jquery sera chargé même si ce code est en bas de la page

Ton code est il bien placé dans cette callback? :
head.ready(function() {
   //code à exécuter après le chargement des fichiers javascript.
});


Et il faut aussi éviter de remettre $(document).ready dans cette callback puisque le dom est certainement déjà prêt à ce niveau là : Il faut directement mettre les appels à tes fonction jQuery.

Tiens nous au courant, ce serait dommage de ne pas utiliser cette librairie pleine de potentiel Smiley smile
Il y a actuellement une requête sur google-ajax-apis pour l'incorporer à leur CDN, à suivre...