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 étape supplémentaire dans l'optimisation des sites web sur Tilda pour un chargement plus rapide. Les technologies évoluent constamment et nous nous efforçons toujours de rendre le chargement encore plus rapide.
Lazy Load est un plugin qui empêche le chargement des images en dehors de la zone de visualisation. En d'autres termes, 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 normal Tilda 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 et actualisez la page.
Sélectionnons un modèle normal Tilda 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 et actualisez la page.
DOMContentLoaded : 628 millisecondes
Ce paramètre indique que tous les scripts de base et le code HTML ont été chargés, ce qui permet à l'utilisateur de visualiser la page immédiatement.
Finish : 1.65 seconds
Ce paramètre indique le temps de chargement de l'ensemble du site web.
Transféré : 263KB
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 permet à l'utilisateur de visualiser la page immédiatement.
Finish : 1.65 seconds
Ce paramètre indique le temps de chargement de l'ensemble du site web.
Transféré : 263KB
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 ? Allez dans Paramètres du site → Plus et cochez la case "Désactiver le chargement paresseux des 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 visualiser la page immédiatement.
Finish : 10.14 seconds
Ce paramètre indique le temps de chargement de l'ensemble du site web.
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 visualiser la page immédiatement.
Finish : 10.14 seconds
Ce paramètre indique le temps de chargement de l'ensemble du site web.
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 ont été multipliés.
Voyons ce que nous pouvons apprendre d'autre grâce à PageSpeed Insights. Vérifions la page avec l'optimisation désactivée.
Voyons ce que nous pouvons apprendre d'autre grâce à PageSpeed Insights. Vérifions la page avec l'optimisation désactivée.
Maintenant, activons la fonction 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 les codes JavaScript et CSS qui empêchent l'affichage de la partie supérieure de la page ?
Cette question revient souvent après avoir passé le test. Google déconseille l'utilisation de scripts en haut de page.
En théorie, vous pouvez supprimer les scripts. Cependant, il faut garder à l'esprit qu'il s'agit d'une analyse automatisée et qu'elle n'est pas exacte. Comme nous l'avons vu, les pages se chargent très rapidement lorsque la fonction Lazy Load est activée, car nous avons optimisé tout ce qu'il y avait à optimiser. L'analyse a montré que la suppression des scripts permet de gagner 0,3 seconde, mais cela ne fait guère de 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 page.
D'ailleurs, 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 page.
D'ailleurs, comment Google réussit-il son propre test ?
Oups !
