Site lent : les solutions pour améliorer la vitesse d'un site web

Trop souvent les optimisations webperf ne sont pas automatisées, voire mal appliquées et donc contre-productives.
Chez Fasterize, toutes nos optimisations sont automatisées et intelligentes afin qu’elles soient efficaces et qu’elles fonctionnent parfaitement entre elles. Vous gagnez du temps et bénéficiez d'optimisations efficaces et adaptées à votre contenu, vos contraintes techniques, sur l’ensemble des terminaux (desktop, tablette, mobile).

La boîte à outil dédiée à votre performance web !

Tout un panel d’optimisation est mis à votre disposition pour améliorer la performance brute de vos pages web, ainsi que la vitesse perçue de vos utilisateurs. En un clic vous activez ou désactivez chacune de ces optimisations.

Optimisations UX : la vitesse perçue

Réduire les temps de chargement c’est bon pour une multitude de raisons. Mais s'il y en a une qui surpasse toutes les autres, c'est bien celle de l'expérience utilisateur. C'est pourquoi nous avons dédié toute une série de fonctionnalités à la vitesse perçue par les utilisateurs :

CSS on top

Le CSS est remonté en haut de la page pour ne pas retarder le rendu de la page.

DeferJS

Les fichiers JavaScript ne sont chargés qu'après la fin du rendu de la page, ce qui contribue grandement à l'accélération du rendu de la page. Notre moteur distingue bien sûr les JavaScript critiques, des JavaScript non-critiques.

Optimisations de votre performance brute

La plupart des sites sont de plus en plus riches, leur poids augmente sans cesse et chaque requête coûte cher (ce qui est encore plus vrai sur mobile !). Chez Fasterize, nous veillons à supprimer les kilos superflus de vos objets tout en conservant le même rendu final et nous vous évitons toutes requêtes inutiles, pour le bien être de vos utilisateurs (et aussi un peu, pour la sauvegarde des ours blancs ...).

Compression intelligente des images

Le moteur Fasterize détermine automatiquement le taux de compression des images en fonction d’un seuil fidélité réglable et ce, afin d’obtenir un fichier le plus léger possible en veillant à ce que celui-ci ne présente aucun artefact visible.

Compression des images aux formats WebP / AVIF

Fasterize optimise toutes vos images aux formats nouvelle génération, et transforme les balises image en balises picture avec les sources WebP et / ou AVIF.

Lazyloading des images

Seules les images visibles sont chargées dès le début. Les images restantes sont chargées lorsqu'on commence à scroller. C'est particulièrement utile si vos pages sont longues !

Concaténation JS/CSS

Nous concaténons les fichiers CSS et JavaScript pour réduire le nombre de requêtes totales. 10 fichiers JavaScript ? Nous n'en faisons que 2 ! Nous transformons également les directives CSS @import.

Minification JS/CSS/HTML

Nous supprimons tous les caractères inutiles de vos pages HTML, de vos ressources CSS et JavaScript. Plus légères, elles sont plus rapides à charger.

Mise en cache

Les éléments optimisés sont mis en cache. Nous adaptons aussi les entêtes HTTP pour mieux mettre en cache les ressources dans le navigateur et les CDN. Nous pouvons également forcer la mise en cache des objets sur notre plateforme.

BROTLI & GZIP

Toutes les ressources (HTML, CSS, JS) sont compressées en GZIP niveau maximal, et Brotli niveau 9 si elles sont destinées à être mises en cache.

Génération automatique des fonts en WOFF2

WOFF2 est le format de police de caractères le plus avancé. Il a l’avantage de réduire le poids des fichiers de 30% en moyenne et de plus de 50% dans certains cas.

Subsetting des fonts

D’une certaine façon, il s’agit d’une minification adaptée aux polices de caractère : nous supprimons tous les caractères inutiles.

URL versioning

Nous ajoutons un numéro de version dans chaque URL d'objet statique afin de pouvoir les stocker plus longtemps dans les caches (navigateur, CDN, proxys). Cela facilite grandement la purge des caches également. Plus besoin de Ctrl+F5 !

Unsharding

L’unsharding est la réécriture des URL en utilisant le domaine de la page. Cela minimise le nombre de résolutions DNS, afin de profiter de la connexion unique de HTTP/2.

Caches améliorés

Le cache classique

Fasterize propose bien sûr des fonctionnalités de cache classique afin de servir le contenu que nous optimisons plus rapidement encore. Par défaut, tous les objets statiques sont cachés.

Le Smart Cache

Le SmartCache permet de mettre en cache sur Fasterize les pages dynamiques. L’impact de Fasterize est en moyenne 42% plus fort lorsqu’on intègre le SmartCache.

Le Cookieless Cache

Notre moteur met en cache les pages servies aux utilisateurs anonymes pour ensuite les servir depuis ce même cache aux utilisateurs anonymes suivants. Les utilisateurs identifiés par un cookie recevront quant à eux, la page (personnalisée).

La variation du cache

Cachez toutes les versions de vos pages (selon le pays, selon le magasin ...) en paramétrant simplement un cookie.

La classification des User-Agents

Fasterize segmente automatiquement ses optimisations et donc son cache en intégrant une catégorisation selon le terminal utilisé (desktop, mobile, etc.) dans la clé de cache. Les différentes versions d’une même page sont alors cachées sans risque de servir une page mobile à un client desktop.

Le Traffic Limiter

La page de débordement (Traffic Limiter) permet de limiter le nombre de sessions utilisateurs simultané sur votre site. Un seuil de sessions est définir à partir duquel vos utilisateurs seront redirigés vers une page annexe.

Optimisations mobile

L’adaptative design

L’adaptive design est la technique qui consiste à générer différents templates de pages pour des écrans de tailles différentes (mobile, tablet, desktop). Cette technique est différente du responsive design car le template est choisi au niveau du serveur en fonction de l’entête HTTP User-Agent.

Optimisation des images

Vous avez la possibilité depuis le dashboard d’adapter l’optimisation des images en modifiant le seuil de tolérance, pour les sites mobiles dédiés. Vous pouvez ainsi compresser un peu plus vos images, sans avoir d’artefacts visuels sur petit écran.

Redimensionnement des images

Vos images sont redimensionnées et recadrées en temps réel via des paramètres d'URL, puis servies directement par notre CDN

Optimisations HTTPS

Reprise de la session TLS

Nous avons mis en place la réutilisation des session TLS qui est l’un des mécanismes les plus importants pour améliorer les performances de la couche TLS.

OCSP stapling

La vérification de la validité des certificats effectuée par le navigateur compte pour environ 30% du temps total du surcoût du HTTPS. Grâce à l’OCSP stapling, le serveur envoie le certificat avec l’indication de la validité de celui-ci directement dans la réponse TLS.

TLS False Start

Le TLS False Start est une extension du protocole qui permet au navigateur d’envoyer les données de la page avant la fin du handshake TLS. En résumé, le TLS False Start permet de n’avoir qu'un aller-retour pour l’établissement des nouvelles connexions TLS.