Réduire le temps d'exécution de JavaScript

J'ai activé toutes les optimisations JavaScript dans WP Rocket, pourquoi est-ce que je vois encore cette recommandation dans PageSpeed ?

Vous obtenez ce diagnostic parce que vous avez des fichiers JavaScript (JS), chargés à partir de votre thème, de plugins ou de services externes qui prennent trop de temps à être exécutés par les navigateurs.The recommendation says:

Essayez de réduire le temps passé à parcourir, compiler et exécuter le JS. Délivrer des charges JS plus petites devrait vous aider.

Cela signifie que JS, une fois téléchargé, doit être "lu" et "compris" par le navigateur (analysé et compilé) et est ensuite exécuté dans le navigateur.

Plus il y a de code JS, plus le navigateur aura besoin de temps pour l'analyser, le compiler et l'exécuter.

PageSpeed Insights affiche un avertissement lorsque l'exécution de JavaScript prend plus de 2 secondes dans le navigateur. L'audit échoue lorsque l'exécution prend plus de 3,5 secondes :

Comment trouver les fichiers problématiques

Pour vous aider à identifier les principaux contributeurs au temps d'exécution, Lighthouse rapporte le temps passé à exécuter, évaluer et analyser chaque fichier JavaScript que votre page.

Dans l'exemple ci-dessus, les fichiers JS sont combinés en un seul fichier JS par WP Rocket, de sorte que vous ne pouvez pas voir quels fichiers prennent trop de temps à l'exécution.

Pour identifier ces scripts en détail, analysez votre version non mise en cache en contournant WP Rocket en ajoutant la requête ?nowprocket à votre URL (par exemple : http://www.votredomain.com/?nowprocket). Vous pourrez alors identifier le thème/plugin responsable :

rbtools.min.js de l'extension RevSlider est le script JS qui consomme le plus de temps CPU dans cet exemple.

Comment le WP Rocket peut aider

Reporter l'exécution de JavaScript vous aidera. En retardant les fichiers, le temps de chargement sera amélioré. Cependant, tous les fichiers ne peuvent pas être retardés sans risque. Vous ne devez retarder que les fichiers qui ne sont pas nécessaires pour tout ce qui se trouve "au-dessus du pli". Veuillez consulter notre documentation pour plus de détails.

Le chargement différé des fichiers JavaScript dans l'onglet Optimisation des fichiers de WP Rocket. Le JS différé n'est exécuté qu'après le téléchargement du HTML de la page afin que les utilisateurs puissent commencer à consommer votre contenu pendant que le navigateur exécute le JS.

Cependant, ce n'est pas une solution complète, car la JS différé prend finalement le même temps pour être analysé et exécuté, et PageSpeed fera la même recommendation.

Que puis-je faire alors ?

Concrètement, pour répondre à cette recommandation, vous devrez supprimer certains scripts d'extensions, certains scripts de votre thème et des ressources externes ... et WP Rocket ne peut pas décider cela ou l'automatiser pour vous.

Vous devrez peut-être reconsidérer l'utilisation d'un glisseur (slider) en haut de votre page et peut-être le remplacer par une image statique. Vous devrez peut-être supprimer de votre barre latérale ce widget de réseau social qui appelle beaucoup de scripts tiers (c'est-à-dire provenant d'un autre domaine). Cela pourrait vraiment faire une différence en termes de performances.

Voici également quelques extensions tieces qui peuvent vous aider à supprimer les JS lents de vos pages. Veuillez les utiliser avec précaution car ils peuvent casser la fonctionnalité de votre site et consultez votre développeur si vous avez besoin d'aide.

Et si vous avez besoin d'un développement personnalisé, sachez que nous avons établi un partenariat avec Codeable. Vous pouvez trouver plus de détails à ce sujet ici : https://wp-rocket.me/resources/codeable/