Pourquoi un extracteur SVG en ligne ne voit pas cette page

À regarder — 17 secondes

Ce qu'apporte l'exécution de la page

tutoriel · comparaison

La distinction n'est pas de qualité ni d'effort — elle est architecturale. Une approche lit un document ; l'autre lit une page affichée.

Ce que montre l'enregistrement

1. Un outil en ligne ne reçoit que l'URL que vous collez
2. Il n'exécute jamais la page : les icônes en ligne restent invisibles
3. Une extension tourne dans la page où vous êtes déjà
4. Y compris les pages connectées et les tableaux de bord privés
5. Et rien ne quitte votre machine pour que cela marche

La raison technique

Récupérer une URL et afficher une page sont deux choses différentes

Quand vous collez une URL dans un extracteur en ligne, son serveur envoie une simple requête HTTP et récupère le HTML que le serveur a choisi d'envoyer. Il cherche ensuite dans ce texte ce qui ressemble à des SVG. C'est une approche raisonnable, et elle manque l'essentiel d'un site moderne, pour quatre raisons distinctes.

• Aucun JavaScript ne s'exécute. Sur un site React, Vue, Svelte ou Angular, le HTML initial est souvent presque vide — un élément racine et une balise script. Chaque icône n'apparaît qu'après l'exécution du framework. Une récupération ne voit que la coquille vide.
• Aucun CSS n'est appliqué. Un vecteur posé en background-image dans une feuille de style n'existe qu'une fois les styles calculés sur les éléments. Chercher du texte dans le HTML ne le trouvera pas.
• Aucune session. Le serveur qui récupère votre URL n'est pas connecté à votre place. Tout ce qui est derrière une authentification renvoie une page de connexion : un tableau de bord, un panneau d'administration ou un outil payant est tout simplement hors d'atteinte.
• Les sprites ne sont pas résolus. Un <use href="#star"> trouvé dans du HTML brut est un pointeur. Sans document affiché, il n'y a rien contre quoi le résoudre : vous obtenez un fichier vide.

Une extension n'a aucun de ces problèmes, car elle ne récupère rien. Elle tourne dans la page que vous regardez déjà, après le rendu du framework, après l'application des styles, avec votre session intacte et le document complet disponible pour résoudre les références.

Le faire dans la page à la place

Il n'y a pas d'URL à coller, et c'est tout l'intérêt.

1. Mettez la page dans l'état voulu. Connectez-vous s'il le faut. Faites défiler, ouvrez le menu, passez à l'onglet où sont les icônes. Tout ce que vous pouvez voir, l'analyse peut le lire.
2. Cliquez sur le bouton de la barre d'outils. L'analyse tourne sur le DOM vivant — icônes rendues par le framework, fonds CSS et références de sprite compris.
3. Comparez le compte. C'est là que la différence se voit. Le nombre trouvé ici vaut typiquement plusieurs fois celui annoncé par une récupération d'URL.
4. Prenez-les. Un par un avec Télécharger le courant, ou tout le jeu avec Tout télécharger en ZIP. Rien ne quitte votre machine à aucun moment.

L'autre question : où va votre fichier ?

Un outil en ligne doit recevoir vos données pour y travailler. Selon le service, cela peut vouloir dire l'URL d'une page où vous étiez connecté, ou un fichier envoyé, posé sur le serveur de quelqu'un d'autre — soumis à sa politique de conservation, à ses journaux, à sa juridiction et à sa sécurité. Pour une page marketing publique, l'échange peut être acceptable. Pour un tableau de bord interne, le site de préproduction d'un client ou un design non publié, c'est un transfert de données que vous n'aviez probablement pas prévu.

La version sur appareil n'implique pas du tout cet échange, et pas au titre d'un engagement : la politique de sécurité du contenu de l'extension fixe connect-src 'none', ses pages ne peuvent donc pas ouvrir de connexion réseau. Il n'y a aucun point d'envoi. Cela veut aussi dire que tout fonctionne hors ligne.

Là où un outil en ligne est réellement le meilleur choix

Pour être honnête : si l'URL vise directement un fichier .svg et que vous voulez seulement le convertir ou l'optimiser, un outil en ligne est rapide et n'exige rien à installer. Sur une machine verrouillée où vous ne pouvez pas installer d'extension, ce peut être votre seule option. Et pour optimiser des SVG en particulier — passer SVGO dessus, retirer les métadonnées, réduire les tracés — les bons optimiseurs en ligne font un travail que cette extension ne tente pas du tout.

Les limites honnêtes de ce côté

Une extension doit être installée, exige un navigateur Chromium, et ne peut rien faire sur une page que vous ne pouvez pas ouvrir vous-même — pages chrome://, le Web Store, les galeries d'extensions. Elle est aussi strictement interactive : pas d'API et aucun moyen de la lancer sur une liste de mille URL. Pour cela, un navigateur headless est l'outil approprié.

Une récupération d'URL manque

Les icônes rendues par JavaScript, les fonds CSS, les pages connectées et les cibles de sprite.

Une extension voit

Le DOM affiché — après le framework, après les styles, avec votre session.

Confidentialité

connect-src 'none'. Aucun point d'envoi ; fonctionne hors ligne.

Les outils en ligne gagnent sur

L'optimisation d'un .svg que vous avez déjà, et les machines où vous ne pouvez rien installer.

Bon à savoir

Questions fréquentes