Amazon a constaté que chaque 100 ms de latence leur coûtait 1 % de ventes. Walmart a constaté que la conversion d’un visiteur prenait 2 secondes de temps de chargement en moins qu’un non-acheteur. La performance n’est pas un « agréable à avoir ». C’est la base des revenus.

Les métriques qui comptent (Core Web Vitals)

Google mesure votre site à l’aide de trois indicateurs clés. Si vous échouez, vous perdez votre classement SEO.

Métrique	Nom	Bonne cible	Ce qu’il mesure
LCP	La plus grande peinture de contenu	< 2,5 s	Vitesse de chargement
INP	Interaction avec la peinture suivante	< 200 ms	Réactivité
CLS	Changement de mise en page cumulatif	< 0,1	Stabilité visuelle

La solution : l’informatique de pointe

La vitesse de la lumière est une contrainte difficile. Si votre serveur est en Virginie (Shopify US) et que votre client est à Paris, le signal doit traverser l’Atlantique. Cela prend du temps. Nous déplaçons le calcul vers l’utilisateur.

Oxygène et Cloudflare

Shopify Oxygen fonctionne sur le réseau Cloudflare. Lorsqu’un utilisateur demande une page, le « Serveur » le plus proche de lui (par exemple, le nœud Aéroport CDG) gère la demande.

graph TD
    Utilisateur[Utilisateur à Paris] -->|5ms| Bord[Nœud Edge (CDG)]
    
    sous-graphe "La Magie"
    Edge -->|Le HTML est-il mis en cache ?| Cache{Stale-While-Revalidate}
    Cache -->|Oui| Bord
    Cache -->|Non| Origine[Shopify Virginie]
    fin
    
    Origine -->|300ms| Bord
    Bord -->|Flux| Utilisateur

Liste de contrôle d’optimisation

1. Optimisation des images (AVIF)

Arrêtez d’utiliser les PNG. Nous implémentons un pipeline d’images automatique qui convertit tout en AVIF (50 % plus petit que JPEG).

<Image 
  données={produit.image} 
  largeurs={[300, 600, 900]} 
  formats={['avif', 'webp']} 
/>

2. Différer les scripts tiers

Klaviyo, Gorgias et Meta Pixel détruisent les performances du thread principal (INP). Nous les déplaçons vers Partytown (exécuté sur un Web Worker) ou les reportons simplement jusqu’à la fin de l’interaction. Les utilisateurs ne peuvent pas acheter si le fil de discussion principal est bloqué par le chargement d’un widget de chat.

3. Prélecture prédictive

Lorsqu’un utilisateur survole une fiche produit, nous pensons qu’il cliquera dessus. Nous commençons à récupérer les données produit JSON avant qu’ils cliquent. Au moment où le doigt quitte la souris, les données sont déjà là. Navigation instantanée.

Étude de cas : Vitesse par rapport aux revenus

Nous avons optimisé un site client, réduisant le LCP de 4,2 s à 1,8 s.

Taux de rebond : réduit de 15 %.
Taux de conversion : augmenté de 8 %.
Revenu : +40 000 $/mois.

Votre site est-il lent ?

Exécutez une vérification Lighthouse. Si vous voyez du rouge, vous brûlez de l’argent. Engagez nos Architectes.