Démarrage Rapide#

Ce guide vous montre comment commencer le téléchargement d'images et l'optimisation en temps réel avec Snapkit.

1. Télécharger des Images#

Il existe deux façons de télécharger des images :

• Tableau de Bord Web : Glissez-déposez des fichiers ou cliquez sur le bouton de téléchargement
• Plugin Figma : Les équipes utilisant Figma peuvent télécharger directement depuis le Plugin Figma

2. Appliquer des Transformations en Temps Réel#

Vous pouvez optimiser les images en temps réel en ajoutant des paramètres de transformation à l'URL.

L'exemple suivant optimise les images de la manière suivante :

• format=webp : Convertir au format WebP pour jusqu'à 80% d'économie de taille
• w=200 : Redimensionner la largeur à 200 pixels
• dpr=3 : Appliquer une densité de pixels 3x pour les écrans haute résolution

Le résultat offre une vitesse de chargement 3x plus rapide et une qualité d'image nette par rapport à l'original.

https://snapkit-cdn.snapkit.studio/landing-page/fox.jpg?format=webp&w=200&dpr=3

Image Originale

JPG, 1920px

2,5s temps de chargement, 346KB

Image Optimisée

(format=webp&w=200&dpr=3)

WebP, 200px, Haute résolution

0,05s temps de chargement, 35,4KB

10x plus petit, 50x plus rapide

Pour plus d'options de transformation, consultez le Guide de Transformation d'Images.

Prochaines Étapes#

• Guide d'Intégration pour intégrer Snapkit dans votre frontend
• Guide de Transformation d'Images pour explorer les options de transformation avancées

Besoin d'Aide ?#

Si vous avez des questions, n'hésitez pas à nous contacter :

• Chat de Conseil : Ouvrez Channel Talk (bouton de chat en bas à droite)
• Communauté Discord : https://discord.com/invite/RM6QgTW8↗
• Issues GitHub : https://github.com/snapkit-studio/snapkit-js↗
• Support par E-mail : contact@snapkit.studio

Félicitations ! Vous êtes maintenant prêt à livrer des images rapides et optimisées avec Snapkit.