SVG Optimizer — Optimiseur SVG

Pourquoi optimiser les fichiers SVG

Les fichiers SVG exportés depuis des outils de conception comme Illustrator, Figma, Sketch ou Inkscape contiennent bien plus que les formes visibles. Métadonnées de l'éditeur, commentaires XML, calques masqués, valeurs d'attributs par défaut, définitions inutilisées, décimales superflues et groupes redondants peuvent facilement représenter la moitié du fichier. Cet outil exécute SVGO — le même optimiseur que celui utilisé par la plupart des chaînes de build et des bibliothèques d'icônes — pour supprimer ce surplus. Des SVG plus légers se chargent plus vite, allègent les icônes intégrées dans votre HTML et gardent vos dépôts propres.

Le preset par défaut applique des dizaines de transformations sûres : il supprime la déclaration XML, les commentaires, les métadonnées et les espaces de noms des éditeurs, nettoie les ID, raccourcit les couleurs, fusionne les tracés, convertit les formes de base en tracés compacts lorsque c'est plus court et réécrit les données de tracé avec des commandes relatives et moins de chiffres. Multipass répète le processus jusqu'à ce qu'aucun gain supplémentaire ne soit possible, ce qui permet souvent de grappiller quelques pour cent de plus.

Bien choisir les options

Precision (précision) détermine le nombre de décimales conservées dans les nombres ; 2 à 3 conviennent aux icônes, tandis que les illustrations détaillées ou les cartes peuvent en demander davantage. Remove <title> fait gagner des octets mais supprime le nom accessible : conservez-le pour les graphiques porteurs de sens. Remove viewBox doit normalement rester désactivée, car c'est le viewBox qui permet à un SVG de s'adapter de façon responsive. Remove width/height est utile lorsque la taille est gérée par le CSS. Remove scripts & event handlers supprime les éléments <script>, les attributs on* et les liens javascript:, une bonne habitude pour les SVG d'origine inconnue. Pretty print indente le résultat pour le rendre lisible, au prix de quelques octets.

Des aperçus privés, locaux et sûrs

Tout le traitement a lieu dans votre navigateur ; aucun fichier n'est envoyé. Les deux aperçus sont affichés via un élément image qui charge une URL blob locale, et les navigateurs n'exécutent jamais les scripts contenus dans les SVG affichés de cette manière. Comparez toujours les deux aperçus avant d'utiliser le résultat : une précision trop agressive ou la suppression du viewBox peut modifier le rendu d'un graphique. Les badges de taille indiquent les octets économisés pour vous aider à trouver le bon équilibre entre poids du fichier et fidélité visuelle.