Bonjour !
 
Actuellement en phase de mise en production d'un site très ambitieux au niveau des effets visuels, mes collègues et moi même rencontrons un problème bien ennuyeux.
 
Le Javascript, sous la forme de fonctions jQuery, ralentit énormément le site. Si sur Firefox et Chrome cela reste acceptable, sur IE c'est tout simplement ignoble. A chaque chargement de page, il faut attendre de longues secondes pour pouvoir commencer à en parcourir le contenu.
 
J'aimerais savoir comment vous optimisez le jQuery et le javascript en général sur vos pages web. Par exemple, est-ce particulièrement lent d'aller chercher tous les éléments contenant la classe nommée "myClass" ?
 

 
Est-ce plus lent d'appliquer à un élément un évènement click par le biais de "bind", "live" ou "on" que de le faire directement à la création de l'élément avec un bon vieux onclick ?
 
Avoir plusieurs setTimeOut cycliques mobilise beaucoup de ressources ?
 
Plus globalement, n'hésitez pas e faire part de vos divers conseils.
 
Merci par avance !
Jeremy

Une question supplémentaire : comment évaluer le temps d’exécution / de mise en place sur la page d'une fonction donnée ? Je voudrais bien savoir si les modifications que je fais dessus sont efficaces et réduisent le temps de latence occasionné ou non...

Déjà, vérifier si c'est bien l'exécution du JS et non le chargement des fichiers qui lag.
 
Les setTimeOut, oui, ça peu prendre du temps si le polling est court (qq ms).
 
Pour IE, quelle version? D'après des tests vus sur le web, IE9 est du niveau voire un peu mieux que FF.
 
Par ailleurs, éviter le code js intrusif dans le html. Mieux vaut tout mettre dans des fichiers et créer les événements sur le DOM à la volée.
 
Si y'a du ajax, faire de l'asynchrone et non du synchrone.
 
Question : quel poids fait vos JS dans une page web?

 
Utilise un profiler pour ça. Tous les browsers en proposent un (plus ou moins efficace) : pour IE, c'est dans les outils de dev (touche F12), pour Firefox, tu peux installer l'extension Firebug, pour Chrome, tu as ça dans les outils de developpement (menu => outils => outils de développement)
 
Sinon, plus généralement, pour les perfs, ce qui peut prendre rapidement beaucoup de temps, c'est les appels jQuery avec des sélecteurs un peu complexes (même pas besoin que ça soit des trucs très compliqués, dès que tu utilises plus qu'une classe ou un id, il y a de bonne chances pour qu'un parcours complet du DOM soit nécessaire). Commence par vérifier que tu ne fais pas plus d'appels jQuery que nécessaire. Par exemple, si tu as un appel dans une boucle qui est toujours le même, le sortir de la boucle et le stocker dans une variable peut offrir un gain non négligeable.

Alors, c'est bien l'exécution et non le chargement, ceci a déjà été prouvé par divers tests. Les versions d'IE qui ont du mal sont les versions 7 et 8.
Il y a des setTimeOut très courts, mais d'après le profiler de Firebug ils ne prennent quasiment aucune ressource pour tourner.
Evidemment tout le code JS est à part, et l'Ajax est asynchrone.
 
@Riokmij :
Oui, je tente d'utiliser le profiler, mais il y a tant de JS qui tourne que ça le fait souvent planter, et quand ce n'est pas le cas la compréhension des données est difficile.
 
En me basant sur ce test : http://jsperf.com/jquery-selectors-context/29
j'essaie d'éliminer les appels jQuery vers une simple classe, pour les remplacer par des appels parent > child, avec le parent si possible cherché par ID, sinon par tagName.