preload

Depuis le début de Fasterize, nous proposons une optimisation sur l'exécution du Javascript appelée Deferjs. Celle-ci permet d’exécuter les scripts des pages de façon différée sans bloquer le rendu de la page.

Cette optimisation améliore le Start Render et le Speed Index mais peut, dans certain cas dégrader, le Time To Interact. Les éléments de la page construits via du Javascript de type carrousel, popup s’affichent en effet dans un second temps.

Par ailleurs, l’utilisation du DejerJs empêche le pre-scanner des navigateurs de commencer le téléchargement des scripts avant de devoir les exécuter.

Preload, prefetch : quelle différence ?

Il existe deux balises permettant de télécharger une ressource sans l’exécuter :

  • la balise “link rel=prefetch” supportée par l’ensemble des navigateurs récents.
  • la balise “link rel=preload” supportée uniquement par Chrome.

La balise “link rel=prefetch” déclenche un téléchargement avec une priorité faible. En pratique, elle est utile pour des ressources qui seront probablement utiles lors de la navigation future.

Au contraire, la balise “link rel=preload” déclenche un téléchargement immédiat avec une priorité basée sur la nature de la ressource téléchargée. La ressource est utilisable lors de la navigation courante.

Les limites du DeferJS dépassées

Depuis peu, la donne a changé au niveau des possibilités offertes par les navigateurs.
Depuis Chrome 51 et bientôt pour Firefox, il est possible d’utiliser la balise HTML « link rel=preload » pour pré-charger des ressources.
Les cas d’usage sont nombreux et sont décrits ici >>

Fasterize intègre le Preload du DeferJS

Le moteur d’optimisation développé par Fasterize tire maintenant parti de cette balise « link rel=preload » pour télécharger en amont l’ensemble des scripts. Ils sont alors déjà disponibles lors de leur exécution orchestrée par le Deferjs.

En implémentant cette optimisation sur notre moteur, nous réduisons encore un peu plus les temps de chargement. L’impact est clairement visible : le Time To Interact arrive bien plus tôt dans la majorité des cas.

NB. Il convient de noter que, comme toutes optimisations webperf, il s’agit d’un compromis puisque les ressources JS pré-chargées peuvent entrer en concurrence avec des ressources critiques.

Cette fonctionnalité n’est pas activée par défaut sur le moteur. Aussi, si vous souhaitez en bénéficier, il suffit de vous rendre dans votre tableau de bord et l’activer.

Cet article vous a plu ?



VOUS AIMEREZ PEUT-ÊTRE AUSSI...

IKKS fait décoller son taux de transformation mobi... Le mobile est au cœur des usages, la tendance est au zapping et le temps d’attention devient de plus en plus court. Comment faire face à ces défis ...
4 pièges à éviter pour optimiser efficacement votr... Par manque de temps ou de ressources, la webperf ou l'amélioration des temps de chargement des pages web sont parfois reléguées au second plan. Dom...
Comment Bureau Vallée allie webperf et personnalis... Du code propre, des performances largement améliorées, et du temps économisé pour se consacrer à d’autres développements, voici les points f...
Petit Bateau améliore de 10% son taux de conversio... Grâce à Fasterize, Petit Bateau a amélioré ses temps de chargement, l’expérience utilisateur et ses taux de conversion. Nous vous emmenons à...