Différer le chargement du JavaScript (Defer/Async)

Defer et Async JavaScript

Le problème

Par défaut, le navigateur arrête le rendu de la page quand il rencontre un script JS. Cela ralentit l'affichage.

Solutions

defer

<script src="script.js" defer></script>

Le script est téléchargé en parallèle et exécuté après le parsing HTML. Recommandé pour la plupart des scripts.

async

<script src="analytics.js" async></script>

Le script est téléchargé et exécuté dès que possible, sans ordre garanti. Idéal pour les scripts indépendants (analytics, ads).

Avec LiteSpeed Cache

LiteSpeed Cache → Optimisation de page → JS Settings → Load JS Deferred: Oui.

Attention

Ne différez pas jQuery si d'autres scripts en dépendent. Testez toujours après activation.