Sur Tilda, le chargement paresseux est activé par défaut pour tous les sites Web. Il permet aux sites Web de se charger plus rapidement, même sur les appareils mobiles.
La mise en œuvre du chargement paresseux est une autre étape dans l’optimisation des sites Web sur Tilda pour un chargement plus rapide. Les technologies évoluent constamment, et nous travaillons toujours à rendre le chargement encore plus rapide.
Lazy Load est un plugin qui bloque le chargement des images en dehors de la zone d’affichage. C’est-à-dire que les images sont chargées au fur et à mesure que l’utilisateur fait défiler la page. Voyons comment cela fonctionne.
Sélectionnons un modèle Tilda standard et publions-le :http://project130385.tilda.ws/
Ouvrez la console de développement du navigateur, activez l’imitation à vitesse lente (3G) dans les paramètres, puis actualisez la page.
Sélectionnons un modèle Tilda standard et publions-le :http://project130385.tilda.ws/
Ouvrez la console de développement du navigateur, activez l’imitation à vitesse lente (3G) dans les paramètres, puis actualisez la page.
DOMContentLoaded: 628 millisecondes
Ce paramètre indique que tous les scripts de base et HTML ont été chargés, ce qui permet à l’utilisateur de visualiser immédiatement la page.
Arrivée : 1,65 seconde
Ce paramètre indique combien de temps il a fallu pour que l’ensemble du site Web se charge.
Transfert : 263 Ko
Ce paramètre indique la quantité de données transférées (en octets).
Ce paramètre indique que tous les scripts de base et HTML ont été chargés, ce qui permet à l’utilisateur de visualiser immédiatement la page.
Arrivée : 1,65 seconde
Ce paramètre indique combien de temps il a fallu pour que l’ensemble du site Web se charge.
Transfert : 263 Ko
Ce paramètre indique la quantité de données transférées (en octets).
Ces chiffres semblent très optimistes, mais tout est relatif, n’est-ce pas? Accédez à la → Paramètres du site et cochez la case « Désactiver le chargement différé pour les images ». Testez à nouveau la page.
DOMContentLoaded: 697 millisecondes
Ce paramètre indique que tous les scripts de base et le code HTML ont été chargés, ce qui signifie que l’utilisateur peut afficher la page immédiatement.
Arrivée : 10,14 secondes
Ce paramètre indique combien de temps il a fallu pour que l’ensemble du site Web se charge.
Transféré: 1.8MB
Ce paramètre indique la quantité de données transférées (en octets).
Ce paramètre indique que tous les scripts de base et le code HTML ont été chargés, ce qui signifie que l’utilisateur peut afficher la page immédiatement.
Arrivée : 10,14 secondes
Ce paramètre indique combien de temps il a fallu pour que l’ensemble du site Web se charge.
Transféré: 1.8MB
Ce paramètre indique la quantité de données transférées (en octets).
Le temps de chargement global des pages et la quantité de données transférées se sont multipliés.
Voyons ce que nous pouvons apprendre d'autre en utilisant PageSpeed Insights. Vérifions la page avec l'optimisation désactivée.
Voyons ce que nous pouvons apprendre d'autre en utilisant PageSpeed Insights. Vérifions la page avec l'optimisation désactivée.
Maintenant, activons le Lazy Load pour les images :
Lazy Load bloque les images qui ne sont pas visibles par les utilisateurs,
ce qui permet aux sites Web de se charger plus rapidement.
ce qui permet aux sites Web de se charger plus rapidement.
Note
Comment supprimer le code JavaScript et CSS qui empêche l'affichage de la partie supérieure de la page ?
Cette question revient souvent après le test. Google déconseille l'utilisation de scripts en haut de la page.
En théorie, vous pouvez supprimer les scripts. Cependant, vous devez garder à l'esprit qu'il s'agit d'une analyse automatisée et qu'elle n'est pas précise. Comme nous l'avons vu, les pages se chargent très rapidement lorsque le Lazy Load est activé car nous avons optimisé tout ce qu'il y avait à optimiser. L'analyse a montré que la suppression des scripts fait gagner 0,3 seconde, mais cela ne fait pratiquement aucune différence.
C'est pourquoi nous recommandons d'ignorer les résultats du test automatisé qui réagit si mal aux scripts en haut de la page.
Au fait, comment Google réussit-il son propre test ?
C'est pourquoi nous recommandons d'ignorer les résultats du test automatisé qui réagit si mal aux scripts en haut de la page.
Au fait, comment Google réussit-il son propre test ?
Oups!
