# Rendu bloquant

> Fichier CSS ou JavaScript que le navigateur doit télécharger et traiter avant de pouvoir afficher le moindre contenu visuel de la page.

- Auteur : Clément Hadrot
- Publié le : 2026-09-25
- Mis à jour le : 2026-09-25
- URL : https://wpmoderne.dev.wordpress-developpement.fr/lexique/rendu-bloquant/

Le navigateur construit une page en deux étapes qui s'imbriquent : il lit le HTML, mais s'arrête net dès qu'il rencontre certaines feuilles de style ou scripts, le temps de les récupérer et de les analyser. Ces fichiers qui suspendent l'affichage sont dits « bloquants pour le rendu ».

## Un coupable fréquent sur les sites WordPress

Un thème qui charge plusieurs feuilles de style d'un coup, dont certaines ne concernent que des sections basses de la page, retarde inutilement l'affichage initial. WordPress charge par défaut les feuilles CSS et scripts déclarés via `wp_enqueue_style` et `wp_enqueue_script` dans l'en-tête, sauf indication contraire.

## Exemple

```
wp_enqueue_script(
  'mon-carrousel',
  get_template_directory_uri() . '/js/carrousel.js',
  array(),
  '1.0',
  true // charge le script juste avant </body>
);
```

Le dernier argument à `true` déplace le script en pied de page plutôt que dans l'en-tête, ce qui l'empêche de retarder l'affichage initial du contenu.

## Bon à savoir

- L'attribut `defer` retarde l'exécution d'un script jusqu'à ce que le HTML soit entièrement analysé, sans bloquer le rendu ; `async` l'exécute dès que possible, potentiellement en interrompant l'analyse du HTML.
- Le CSS critique (le strict nécessaire à l'affichage immédiat visible) peut être intégré directement dans le HTML pour éviter d'attendre une feuille de style externe complète.
- Réduire le nombre de fichiers CSS et JavaScript bloquants améliore directement des métriques comme le LCP, puisque le premier rendu visuel dépend de leur disponibilité.