Comparatif CDN d'images Shopify : Par défaut vs Cloudinary vs Bunny

Points clés

• La plupart des boutiques n’ont pas besoin d’un CDN d’images tiers. Le CDN intégré de Shopify redimensionne, recadre, compresse et négocie déjà le format (AVIF, WebP ou JPEG) à chaque requête, sans frais supplémentaires.
• Le filtre Liquid image_url gère la largeur, la hauteur, le recadrage (crop), le format et la couleur de remplissage (pad_color) jusqu’à 5760px, et image_tag génère un srcset responsive avec loading="lazy" par défaut.
• Un CDN d’images tiers a du sens quand le problème n’est pas la diffusion (delivery). Le Digital Asset Management (DAM), la vidéo, la direction artistique à grande échelle, les images hébergées hors de Shopify et la réutilisation multicanal sont les vrais déclencheurs.
• Cloudinary est l’option DAM + transformation et facture en crédits. Bunny Optimizer est la couche de transformation abordable à 9,50 $ par mois et par site, plus la bande passante.
• Aucun des deux ne peut remplacer cdn.shopify.com pour les images de produits natives. Ils viennent s’y ajouter, ce qui représente un coût de maintenance souvent oublié.

Une comparaison des CDN d’images pour Shopify part souvent d’une fausse idée : que la diffusion d’images de Shopify est une lacune à combler. Ce n’est pas le cas. Chaque forfait Shopify inclut un CDN mondial qui redimensionne, compresse et négocie le format des images à la volée, sans aucun frais supplémentaire.

La vraie question est donc plus précise. Que fait réellement le CDN intégré, où s’arrête-t-il, et est-ce que Cloudinary ou Bunny Optimizer résolvent un problème que vous avez vraiment ? Ce guide détaille le fonctionnement par défaut de Shopify, puis compare les trois options sur les coûts, l’API de transformation, les formats supportés, l’intégration au thème, les Core Web Vitals et le vendor lock-in.

Pourquoi vous pouvez nous faire confiance

Nous évoluons dans l’écosystème Shopify depuis plus de quatre ans et avons travaillé sur les vitrines de centaines de marques. Jacques a plus de 15 ans d’expérience en développement. Nous concevons Fudge, un éditeur de boutique IA noté 5.0 sur le Shopify App Store avec le statut Built for Shopify. Nous travaillons donc directement au niveau du thème, là où la performance des images se gagne ou se perd.

La réponse courte : la plupart des boutiques devraient rester sur le CDN de Shopify

Si vos images sont hébergées sur Shopify, que votre thème utilise correctement image_url et image_tag, et que vous uploadez des fichiers sources raisonnables, un CDN d’images tiers ne vous apportera pas de gain de vitesse significatif. Vous aurez juste un prestataire de plus, une facture de plus et un point de défaillance supplémentaire.

Les boutiques qui en tirent vraiment profit ont un problème différent. Elles gèrent une vaste médiathèque sur plusieurs canaux, diffusent de la vidéo à grande échelle, font de la direction artistique par audience, ou hébergent leurs images ailleurs que sur Shopify. Ce sont des problématiques de gestion d’assets, pas de diffusion.

Si votre problème d’image est « mon image hero fait 1,4 Mo », la solution se trouve dans vos fichiers sources et votre code Liquid, pas dans un nouveau CDN.

Ce que fait vraiment le CDN d’images intégré de Shopify

Le CDN de Shopify s’appuie sur Cloudflare, sert les fichiers via HTTP/3 avec TLS 1.3, et compresse les assets texte avec Brotli et gzip.¹ Il est inclus dans tous les forfaits, avec un hébergement non mesuré et une bande passante illimitée.² Il n’y a pas de quota de bande passante à surveiller ni de facturation à la requête.

Voici la partie que les gens sous-estiment.

Négociation automatique du format : AVIF, WebP et JPEG

Shopify analyse chaque requête et sélectionne le meilleur format compatible pour le client, en choisissant entre AVIF, WebP et JPEG selon la qualité et le poids compressé.³ Vous n’avez rien à configurer ni à payer. C’est le comportement par défaut depuis 2022.

C’est la fonctionnalité phare sur laquelle reposent la plupart des CDN d’images tiers. Et Shopify le fait déjà.

Le filtre image_url et ses paramètres

image_url est le filtre Liquid actuel pour générer les URL d’images. img_url est obsolète et a été remplacé par celui-ci.

Il accepte :

• width (largeur) et height (hauteur), jusqu’à un maximum de 5760px chacun. Vous devez en passer au moins un, sinon le filtre renvoie une erreur.⁴
• crop (recadrage), avec les valeurs top, center, bottom, left, right et region.
• format, acceptant jpg ou pjpg. Les conversions valides sont PNG vers JPG, PNG vers PJPG, et JPG vers PJPG.
• pad_color (couleur de fond), sous forme de valeur hex3 ou hex6.

Une règle surprend souvent : une image n’est jamais agrandie au-delà de ses dimensions d’origine. Demandez 3000px pour un upload de 1200px et vous récupérerez du 1200px.

Notez bien la nuance. Le paramètre format sert à la conversion de la source, pas à forcer l’AVIF ou le WebP pour le visiteur. La négociation de format se fait automatiquement au niveau du edge, à chaque requête.

srcset responsive avec image_tag

image_tag génère la balise <img> et s’occupe des parties fastidieuses pour vous. Il définit les attributs width et height à partir du véritable ratio de l’image, ce qui évite le layout shift, et il construit un srcset à partir d’un ensemble de largeurs par défaut jusqu’au maximum de l’URL.

Il accepte widths, sizes, srcset, preload, alt, class et n’importe quel autre attribut HTML. Deux comportements par défaut sont importants :

• Les images reçoivent loading="lazy" automatiquement sauf si vous passez preload: true. C’est le bon choix par défaut pour les images en dessous de la ligne de flottaison (below-fold) et le mauvais pour votre image hero. Lisez comment lazy-loader des images sur Shopify pour savoir où tracer la ligne.
• preload: true envoie un resource hint Link sous forme d’en-tête HTTP, ce qui est idéal pour l’image LCP. Si votre hero s’affiche tardivement, notre correction de l’eager loading pour les bannières hero Shopify vous détaille la modification exacte.

Un hero correctement configuré ressemble à peu près à ceci :

{{ section.settings.image
  | image_url: width: 2400
  | image_tag:
      widths: '600, 900, 1200, 1600, 2000, 2400',
      sizes: '100vw',
      preload: true,
      loading: 'eager',
      alt: section.settings.image.alt
}}

La plupart des discussions du type « il nous faut un CDN d’images » s’arrêtent là, dès que quelqu’un lit le code du thème et tombe sur une balise <img> à largeur fixe sans srcset.

Limites de taille et formats sources supportés

Les images de produits et de collections doivent peser moins de 20 Mo et faire au maximum 5000 x 5000 px, soit 25 mégapixels. Les formats acceptés sont PNG, JPEG, PSD, TIFF, BMP, GIF, SVG, HEIC et WebP, y compris les GIF et WebP animés. Shopify recommande 2048 x 2048 px comme taille d’affichage optimale pour les photos de produits carrées.⁵

Shopify compresse lors de l’upload, mais ne sauvera pas un fichier source mal exporté. Pour le travail en amont de l’upload, consultez notre guide sur comment compresser des images sur Shopify.

Quand un CDN d’images tiers est-il justifié ?

Il existe de vrais cas d’usage. Mais ils sont plus rares que ce que le marketing laisse entendre.

• Transformations lourdes à la volée. Overlays, incrustation de texte, suppression d’arrière-plan, compositions par variante, recadrages générés pour les réseaux sociaux. Shopify ne fait que resize, crop et pad. C’est tout.
• Digital Asset Management (DAM). Versioning, validations, tags, recherche, et une source de vérité unique pour votre équipe créative. Fichiers Shopify (Shopify Files) est un espace de stockage, pas un DAM.
• Vidéo. Diffusion en bitrate adaptatif, rendus par appareil, génération de miniatures.
• Direction artistique à grande échelle. Différents recadrages par breakpoint ou par audience, gérés par des règles et non manuellement.
• Images hébergées en dehors de Shopify. Un PIM, une architecture headless, ou un flux de marketplace qui n’atterrit jamais dans Fichiers Shopify.
• Réutilisation multicanale. Le même asset (fichier) alimentant Shopify, un site vitrine, une app et un portail B2B depuis une seule URL et un seul ensemble de transformations.

Le constat : vous achetez de la gestion d’assets et des capacités de transformation avancées, pas un temps de chargement plus rapide. Si vous ne vous reconnaissez dans aucune de ces situations, arrêtez-vous là.

CDN Shopify par défaut vs Cloudinary vs Bunny Optimizer

Modèle de coût

Le CDN de Shopify est inclus. Hébergement non mesuré, bande passante illimitée, aucune ligne de facturation séparée.²

Cloudinary facture en crédits. Comme indiqué sur leur page de prix à ce jour : Gratuit à 0 $/mois avec 25 crédits mensuels, Plus à 99 $/mois ou 89 $/mois facturés annuellement avec 225 crédits, et Advanced à 249 $/mois ou 224 $/mois facturés annuellement avec 600 crédits. L’offre Enterprise est sur mesure. Un crédit équivaut à 1 000 transformations, ou 1 Go de stockage géré, ou 1 Go de bande passante consommée.⁶

L’application Cloudinary AssetLink sur le Shopify App Store affiche ses propres forfaits séparément : une version gratuite qui nécessite un forfait Cloudinary externe, Pro à 999 $/mois, et Pro Plus à 999 $/mois plus 0,30 $ par Go de diffusion CDN. L’application a une note de 5.0 d’après 3 avis. Vérifiez les prix directement sur la fiche avant de budgétiser, car les forfaits peuvent changer.

Bunny divise la facture. Bunny Optimizer coûte 9,50 $/mois par site web, avec requêtes, optimisations et transformations illimitées. La bande passante du CDN est facturée en plus : sur le réseau standard, 0,01 $/Go pour l’Europe et l’Amérique du Nord, 0,03 $/Go pour l’Asie et l’Océanie, 0,045 $/Go pour l’Amérique du Sud, 0,06 $/Go pour le Moyen-Orient et l’Afrique, avec un minimum de 1 $/mois.

Bunny est de loin le moins cher. Cloudinary a le prix d’une plateforme média, car c’est exactement ce que c’est.

API de transformation

Shopify : width, height, crop, format, pad_color. Volontairement minimaliste.

Cloudinary : la plus complète des trois. Transformations enchaînées dans l’URL, f_auto pour le choix du format et q_auto pour le choix de la qualité, plus des overlays, des effets, des modes de recadrage et la vidéo.

Bunny Optimizer : un bon compromis. Sa documentation de traitement d’images liste width, height, crop, aspect_ratio, crop_gravity, face_crop, focus_crop, blur, sharpen, brightness, contrast, saturation, hue, tint, sepia, gamma, flip, flop, rotate, quality et format. Plus riche que Shopify, mais bien loin de Cloudinary.

Formats supportés

Shopify est vraiment compétitif sur ce point. La documentation de traitement d’images de Bunny Optimizer liste la conversion entre JPEG, PNG, WebP et GIF, décrit l’auto-serve WebP comme une simple option, et ne mentionne pas la sortie AVIF. Considérez l’AVIF sur Bunny comme non confirmé tant que vous ne l’avez pas testé sur votre propre pull zone.

Facilité d’intégration avec un thème Shopify

C’est ici que la comparaison bascule.

Shopify : aucun effort. C’est déjà comme ça que votre thème gère l’affichage des images.

Cloudinary : son app Shopify ajoute des snippets Liquid à votre thème et vous donne une médiathèque intégrée dans l’admin pour attacher des assets Cloudinary aux produits, collections et articles de blog. C’est fonctionnel, mais ça implique des modifications de thème et un flux de gestion des assets en parallèle de celui de Shopify.

Bunny : aucune intégration native avec Shopify pour les images de produits. Une pull zone se place devant une origine, et Shopify ne permet pas de remplacer le CDN de la vitrine pour les médias de produits servis depuis cdn.shopify.com. En pratique, Bunny est utilisé pour les assets en dehors du système d’images de Shopify : médias de landing pages, fichiers téléchargeables, fichiers hébergés ailleurs. C’est un vrai cas d’usage, mais ce n’est pas « remplacer le CDN d’images de Shopify ».

En bref : vous ne pouvez pas totalement vous passer du CDN d’images de Shopify pour les images de produits natives. Chaque option tierce est un ajout.

Impact sur les Core Web Vitals

Méfiez-vous des promesses d’amélioration du LCP liées à un CDN. Dès lors que les images sont déjà en AVIF ou WebP, à la bonne taille, et servies depuis un edge proche du visiteur, un deuxième CDN ne changera pas grand-chose.

Ce qui améliore vraiment le LCP sur une boutique Shopify :

• Une image hero qui est lazy-loadée au lieu d’être préchargée (preload).
• Un srcset manquant, forçant le mobile à télécharger une image au format desktop.
• L’absence de width et height, provoquant un layout shift et un mauvais score CLS.
• Une image source bien plus grande que sa taille d’affichage réelle.
• Des scripts d’apps et des ressources bloquant le rendu (render-blocking) qui retardent la requête de l’image dès le départ.

Un saut supplémentaire vers un autre CDN peut ajouter une requête DNS, un handshake TLS et un défaut de cache (cold-cache miss) lors de la première requête. C’est une légère régression, pas une amélioration, du moins tant que vos besoins de transformation ne le justifient pas. Pour savoir où se situent réellement les boutiques Shopify sur ces métriques, lisez l’état des performances Shopify en 2026, et pour le mobile en particulier, notre guide sur la vitesse mobile sur Shopify.

Maintenance et dépendance (lock-in)

Shopify : rien à maintenir, rien à annuler. Les URL d’images sont générées par les filtres Liquid inclus dans la plateforme.

Cloudinary : vos URL d’images pointent vers Cloudinary. Votre logique de transformation se trouve dans la syntaxe d’URL de Cloudinary, embarquée dans les snippets de votre thème. Migrer vers une autre solution implique de réécrire ces URL et de rapatrier vos fichiers. La valeur du DAM est réelle, tout comme le coût de sortie.

Bunny : dépendance plus légère. La syntaxe de transformation repose sur des query parameters, et changer le nom d’hôte pour revenir en arrière est simple. Vous devez quand même gérer une pull zone, des règles de cache et une deuxième facture.

Chaque option tierce ajoute aussi un deuxième endroit où une image peut poser problème : cache expiré, mauvais recadrage, un fichier mis à jour dans un système mais pas dans l’autre.

Tableau de décision

Verdict selon le profil de la boutique

Petite à moyenne boutique, images hébergées sur Shopify. Restez sur le CDN de Shopify. Concentrez vos efforts sur les fichiers sources, le srcset, et le préchargement (preload) de l’image LCP. Notre guide sur comment accélérer un thème Shopify couvre bien plus de choses que n’importe quel changement de CDN.

Boutique à fort volume avec une équipe créative et une vaste médiathèque. Cloudinary, et prenez-le pour son DAM et ses options de transformation plutôt que pour la vitesse. Évaluez d’abord le coût en crédits par rapport à votre volume réel de transformations et de bande passante.

Boutique avec de nombreux assets en dehors de Shopify. Bunny Optimizer, uniquement pour ces assets-là. À 9,50 $ par mois par site web plus un centime par gigaoctet en Europe et en Amérique du Nord, c’est assez abordable pour justifier son usage sur un mini-site riche en médias ou une bibliothèque de téléchargements. Laissez les images de produits sur Shopify.

Architecture headless ou multicanale. Cloudinary si vous avez besoin d’une source d’assets centralisée pour la vitrine, l’app et le site vitrine. Bunny si vous n’avez besoin que de transformation et de diffusion.

Ceux dont le vrai problème est une image hero trop lente. Aucune des options ci-dessus. Corrigez votre code Liquid.

Où intervient Fudge

Fudge est un éditeur de boutique IA qui écrit du code de thème natif : Liquid, CSS et JavaScript, directement dans votre thème.

Sur Shopify, la plupart des problèmes de performance des images sont des problèmes de thème. Une image hero sans preload, une grille de produits sans srcset, une section qui intègre en dur une source de 2000px dans un emplacement de 400px. Vous pouvez décrire la correction à apporter en langage naturel, et Fudge écrit correctement les appels image_url et image_tag dans la section.

Puisque le résultat est du code de thème natif, il n’y a aucun script supplémentaire ni couche de widget, et vos modifications subsistent même en cas de désinstallation. Il en va de même pour tout ce que vous concevez avec l’éditeur de boutique Shopify.

C’est généralement la solution la plus économique. Un CDN ne peut pas corriger un thème qui demande la mauvaise image.

FAQ