Requêtes de blocage du rendu
Selon Google PageSpeed Insights, les ressources bloquant le rendu sont des fichiers tels que CSS et JavaScript qui ralentissent le chargement des pages, car le navigateur doit les traiter avant d'afficher le contenu.

Les requêtes bloquent le rendu initial de la page, ce qui peut causer un retard LCP. Le report ou l'intégration de ces requêtes réseau peut les écarter du chemin critique.
Comprendre les Requêtes de blocage du rendu
Avant qu'un navigateur puisse afficher une page Web, il doit d'abord analyser le code HTML. Au cours de ce processus, chaque fois qu'il rencontre un fichier JavaScript ou CSS, il doit s'interrompre, récupérer le fichier sur le serveur et l'exécuter avant de poursuivre le rendu de la page. Ces fichiers sont communément appelés « bloquants pour le rendu », car le navigateur ne peut afficher le contenu tant qu'ils n'ont pas été entièrement traités.
Cela peut ralentir la vitesse à laquelle les visiteurs voient votre contenu, laissant parfois la page vide ou incomplète pendant quelques instants, ce qui peut avoir un impact sur les Core Web Vitals tels que le Largest Contentful Paint (LCP).
Réduire ou éliminer les ressources qui bloquent le rendu permet d'accélérer le chargement de la page et garantit que le contenu s'affiche le plus rapidement possible pour les utilisateurs.
Comment améliorer les requêtes bloquant le rendu avec WP Rocket
WP Rocket propose des options qui peuvent aider à résoudre les problèmes liés au JavaScript et au CSS bloquant le rendu.
-
Chargement différé des fichiers JavaScript : retarde l'exécution du code JS jusqu'à ce que la page soit affichée.
-
Reporter l’exécution du JavaScript : reporte les scripts non critiques jusqu'à l'interaction de l'utilisateur.
-
Supprimer les ressources CSS inutilisées : réduit la taille du CSS et élimine les règles inutiles.
-
Minifier les fichiers JavaScript : réduit la taille des fichiers JavaScript afin qu'ils se téléchargent et s'analysent plus rapidement.
-
Minifier les fichiers CSS : réduit la taille des fichiers CSS pour accélérer leur chargement, ce qui permet au navigateur d'afficher le contenu plus rapidement.
Resources complémentaires
- Utilisez les attributs
async/defer: Pour les scripts que WP Rocket ne peut pas gérer. Plugins qui peuvent vous aider : Async JavaScript ou Critical CSS for WP.
- Lire les directives officielles et les audits : https://developer.chrome.com/docs/performance/insights/render-blocking?hl=fr