Guides
Performance
Garder une boutique rapide : images, applications et bonnes pratiques.
Maison est conçu pour être léger : il n’embarque aucune bibliothèque JavaScript externe, chaque composant ne charge que son propre code, et la page s’affiche avant que les scripts ne s’exécutent. Les pages clés sont auditées avec Lighthouse, selon la méthode du Theme Store, à chaque nouvelle version.
Ce que fait le thème
- La première image de la page (bandeau principal, image avec texte, galerie produit) est chargée en priorité ; les images plus bas sont chargées au fil du défilement.
- Les images sont servies à la bonne taille pour chaque écran, par le CDN de Shopify.
- Les recommandations et les lecteurs YouTube / Vimeo ne se chargent qu’au moment où ils sont utiles.
- La mise en page ne bouge pas pendant le chargement.
Ce qui ralentit une boutique
La plupart du temps, ce n’est pas le thème mais :
- Les applications : chaque application ajoute ses scripts sur toutes les pages. Désinstallez celles que vous n’utilisez plus, et vérifiez qu’elles ont retiré leur code.
- Les pixels et outils de suivi (publicité, analyse) ajoutés dans ParamètresÉvénements clients.
- Les images trop lourdes : Shopify les optimise, mais une image de 20 Mo reste longue à traiter.
- Les vidéos en lecture automatique en haut de page.
Bonnes pratiques
- Importez des images d’environ 2 400 px de large pour les bandes pleine largeur et 1 600 à 2 000 px pour les produits. Inutile d’aller au-delà.
- Préférez un bandeau principal à une seule image à un diaporama de cinq images.
- Utilisez les réglages de point focal plutôt que des images recadrées pour chaque écran.
- Limitez le nombre de sections sur la page d’accueil à ce qui sert vraiment.
Le rapport de vitesse de la boutique se trouve dans Boutique en ligneThèmes et dans les rapports d’analyse. Il reflète l’expérience réelle de vos visiteurs, applications comprises.
Maison 1.0.0