Optimiser rapidement son jQuery 1.x

Quand vous avez peu de temps pour diminuer le temps d’exécution d’un gros bloc de jQuery, le plus rapide est d’optimiser le code pour respecter les bonnes pratiques.

Les optimisations suivantes sont valides pour jQuery 1.x vu que la page était initialement avec cette version.

FasterSnail

Selecteur

Facilitez le parcours du DOM, identifier la zone où chercher puis les éléments à trouver.

Chaining

Enchainez les actions sur le même selecteur quand c’est possible.

Caching

Stockez vos éléments dans une variable avant de faire vos opérations dessus.

Event delegation

Attachez la gestion d’événement sur le container et ciblez les éléments déclencheurs.

http://learn.jquery.com/events/event-delegation/

Manipulation du DOM

Assemblez dans une boucle mais ajoutez hors de celle-ci

Boucle

  1. Préférez le for au each

  2. Mettez en cache la taille de la collection

Manipulation de CSS

Utilisez AddClass plutôt que css() pour plusieurs éléments.

Nous sommes d’accord que cela ne vaut pas une optimisation en bonne et dûe forme.

Mais si comme dans mon cas, votre code initial est loin d’être propre, vous serez surpris du gain inhérent à règles.

Related Post

Débuter avec NodeJS, Express et MongoDB Un collègue m’a parlé de différents projets personnels orientés web et de son dilemne sur le choix des techologies. Curieux j’ai voulu essayer NodeJS,...

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *