Améliorer la performance de votre boutique en ligne

Votre boutique en ligne se compose d’un ensemble de fonctionnalités, telles que le code de thème, les applications, les images, les vidéos, les carrousels, les flux de réseaux sociaux et les analyses de données. Ces fonctionnalités peuvent améliorer l’expérience des visiteurs et étendre les capacités de votre site.

Toutefois, chaque fonctionnalité que vous ajoutez à votre boutique en ligne peut exercer un impact sur les indicateurs de performance de votre boutique. Certaines fonctionnalités peuvent ralentir votre site ou créer des comportements inattendus, pouvant exercer un impact sur l’expérience utilisateur.

La performance web met l’accent sur l’optimisation de l’expérience utilisateur. À l’heure actuelle, la performance web met l’accent sur trois domaines principaux, qui sont également reflétés dans les Core Web Vitals :

• Vitesse de chargement, évaluée par Largest Contentful Paint (LCP)
• La stabilité de la mise en page, évaluée par le décalage cumulatif de la présentation (Cumulative Layout Shift, CLS)
• La réactivité à l’interaction avec l’utilisateur, mesurée par le délai de la première entrée (First Input Delay, FID) et l’interaction avec la peinture suivante (Interaction to Next Paint, INP)

Optimiser la performance web signifie que vos clients sont plus susceptibles de rester sur votre site et de se convertir. En savoir plus sur l’importance de la performance web.

Optimisations pour votre boutique en ligne

Votre boutique en ligne est intégrée à l’optimisation du web. L’optimisation web est également intégrée à toutes les nouvelles fonctionnalités. Vous n’avez rien à faire de spécial pour profiter des fonctionnalités suivantes :

• Votre boutique en ligne est hébergée sur des serveurs rapides et internationaux qui ne limitent pas la bande passante de votre boutique. Vous pouvez vérifier le statut de votre boutique Shopify sur Statut Shopify.
• Votre boutique en ligne dispose d’un réseau de diffusion de contenu (CDN) géré par Cloudflare, qui garantit un chargement rapide de votre boutique en ligne dans le monde entier. Vous pouvez vérifier le statut CDN sur la page de statut Cloudflare.
• Pour conserver des temps de chargement rapides, les images sont automatiquement optimisées à l’aide de l’image CDN. Combiné avec le code de votre thème, le CDN d’images peut fournir le meilleur format d’image, qui est également redimensionné et compressé pour réduire la taille des fichiers.

Facteurs exerçant un impact sur les performances des sites web

Pour les boutiques Shopify, les facteurs suivants sont ceux qui ont le plus d’impact sur les performances web :

• Le thème de votre boutique en ligne
• Les applications que vous avez installées
• Tout code tiers supplémentaire que vous avez ajouté manuellement à votre boutique, y compris les balises de gestion et les balises qui y sont stockées

Cela signifie que vous devez vous concentrer sur les sujets suivants pour améliorer vos performances web :

• Utilisez un thème 2.0 à jour et optimisé pour la boutique en ligne. Tous les thèmes de Shopify de la boutique en ligne 2.0 sont gratuits et optimisés pour la performance web. De plus, de nombreux autres thèmes tiers sont également optimisés pour la performance web. Vous pouvez consulter les plus récentes données de performance des thèmes.
• Évaluez vos applications installées et le code tiers pour vous assurer qu’elles créent suffisamment de valeur pour compenser toute perte de performance potentielle.
• Vérifiez votre gestionnaire de balises pour supprimer les balises inutilisées ou de faible valeur. En savoir plus sur les bonnes pratiques pour les balises et les gestionnaires de balises.

Outils de test

Vous pouvez utiliser les outils suivants pour vérifier les performances de votre boutique en ligne.

Tableau de bord des performances web

Le rapport du tableau de bord des performances web de Shopify utilise les indicateurs Core Web Vital pour évaluer l’expérience utilisateur sur votre boutique en ligne.

Informations PageSpeed

Vous pouvez exécuter vos propres rapports à l’aide de PageSpeed Insights de Google afin d’afficher des indicateurs plus détaillés pour les pages de votre boutique.

Obtenir de l’assistance pour améliorer les performances de votre boutique en ligne

Si vous utilisez un thème gratuit de Shopify, l’assistance Shopify sera peut-être en mesure de vous aider à en améliorer les performances de base.

Si vous utilisez un thème tiers et que vous avez besoin d’aide, vous devez contacter le développeur de votre thème, engager nos experts de la performance web Shopify ou engager un partenaire Shopify. En savoir plus sur le recrutement d’un partenaire Shopify.

Si votre problème de performance vient d’une application, vous pouvez contacter votre développeur d’application.

Si vous disposez d’une équipe de développement ou travaillez avec une agence partenaire, vous pouvez également les contacter pour obtenir une aide supplémentaire.

Informations techniques et ressources pour la résolution de problèmes

Si vous êtes un développeur cherchant la manière d’améliorer les performances d’une boutique en ligne, d’un thème ou d’une application Shopify, vous pouvez consulter les ressources suivantes pour chaque Core Web Vital. En savoir plus sur les bonnes pratiques de performance pour les thèmes Shopify.

Vitesse de chargement

L’indicateur Largest Contentful Paint (LCP) mesure la vitesse de chargement, en fonction de la rapidité avec laquelle l’élément le plus grand de l’écran devient visible. Time to first byte (TTFB) et First contentful paint (FCP) sont des indicateurs de soutien qui vous permettent de mieux comprendre l’origine du problème. Vous pouvez en savoir plus sur le débogage des causes communes expliquant la lenteur de chargement dans les boutiques en ligne Shopify Liquid.

Stabilité visuelle

Le Cumulative Layout Shift (CLS) mesure la stabilité visuelle en fonction de la façon dont le contenu se déplace de façon inattendue pendant le chargement. Pour découvrir en détails le débogage CLS, consultez Comment optimiser le Cumulative Layout Shift (CLS) sur les sites Shopify.

Interactivité

Le First Input Delay (FID) mesure l’interactivité, en fonction du temps nécessaire à la page pour répondre à la première action de l’utilisateur, par exemple en cliquant sur un lien ou un bouton. Il a été remplacé par Interaction to Next Paint (INP) dans le Core Web Vitals, et nous travaillons à l’ajout d’INP dans le tableau de bord des performances du web.

Si vous rencontrez des problèmes de FID ou d’INP, il est fort probable que vous ayez trop de JavaScript dans votre boutique à partir du code du thème, du code de l’application ou du code tiers/tag manager. Procédez au nettoyage de vos pires offenseurs. En savoir plus sur les 3 façons de trouver vos offenseurs JavaScript pour le chargement de page. Si vous continuez à rencontrer des problèmes avec l’INP, vous pouvez en savoir plus en consultant les ressources sur web.dev.