Nástroj načte oficiální prohlížečový modul SVGO až po spuštění optimalizace. Používá standardní sadu pluginů a odstraňuje skripty a obslužné rutiny událostí, aby byl soubor bezpečnější jako běžný obrázek na webu. ID můžete zachovat, pokud je používá CSS, JavaScript, přechody, masky nebo externí odkazy.
Optimalizace SVG zdarma
Běží celé ve vašem prohlížeči - nic se nenahrává, žádná registrace.
Skripty a obslužné rutiny událostí budou odstraněny
Vstup SVG
Optimalizované SVG
Ctrl nebo Command + Enter
Vložte značky SVG nebo vyberte soubor a začněte
Co dělá optimalizace SVG?
Optimalizace SVG zmenší vektorový soubor odstraněním metadat editoru, komentářů, nadbytečných atributů a zbytečné přesnosti čísel. Vložte značky nebo vyberte soubor a spusťte SVGO přímo v prohlížeči. Porovnejte originál s výsledkem a potom menší SVG zkopírujte nebo stáhněte, aniž byste svůj návrh odesílali na server.
Jak na to
- 1Přidejte SVG. Vložte úplné značky SVG, přetáhněte místní soubor .svg do oblasti pro nahrání nebo otevřete připravený příklad.
- 2Zvolte bezpečné nastavení. Nastavte přesnost čísel, ponechte zapnuté vícenásobné průchody pro další zmenšení a zachovejte ID, na která odkazuje jiný kód.
- 3Optimalizujte a porovnejte. Spusťte SVGO a potom zkontrolujte počet bajtů před a po zpracování a oba obrazové náhledy.
- 4Zkopírujte nebo stáhněte. Zkopírujte zkrácené značky nebo stáhněte nový soubor .optimized.svg, aniž by se změnil původní návrh.
Pro koho je nástroj
- Frontendoví vývojáři zmenšující ikony, loga a ilustrace před přidáním na web nebo do knihovny komponent.
- Designéři čistící metadata a značky editoru ze souborů exportovaných z Figma, Illustrator, Sketch nebo Inkscape.
- Týmy zaměřené na výkon měřící přesnou úsporu bajtů UTF-8 před přidáním vektorových prostředků do webového balíčku.
- Autoři komponent připravující stručné vložené značky SVG pro React, Vue, Svelte nebo obyčejné HTML.
Časté dotazy
Je optimalizace SVG zdarma?
Ano. Soubory SVG můžete optimalizovat bez účtu, placení nebo instalace. Nástroj ukazuje přesnou změnu počtu bajtů UTF-8 a výsledek lze přímo v prohlížeči zkopírovat nebo stáhnout.
Nahrává se můj soubor SVG na server?
Ne. Čtení souboru, zpracování SVGO, měření bajtů a vytváření náhledů probíhá místně v prohlížeči. Loga, ikony ani nezveřejněné návrhy tento nástroj neodesílá.
Jak velký soubor SVG lze optimalizovat?
Nástroj přijímá zdroj SVG do 5 MB. Tento limit zachovává svižné zpracování na telefonech a běžných noteboocích. U velmi velkých ilustrací odstraňte vložené rastrové obrázky nebo rozdělte návrh na menší prostředky.
Změní optimalizace SVG vzhled obrázku?
SVGO je navrženo tak, aby při odstranění přebytečných dat zachovalo vykreslení. Výrazné zaokrouhlování čísel nebo čištění ID však může ovlivnit složité soubory. Porovnejte oba náhledy a vyzkoušejte optimalizovaný soubor SVG na skutečném místě použití, než nahradíte produkční soubor.
Co mění desetinná přesnost?
Desetinná přesnost určuje, kolik číslic za desetinnou čárkou SVGO ponechá v souřadnicích, transformacích a souvisejících hodnotách. Nižší hodnota často ušetří více místa, ale může viditelně posunout detaily ve velmi přesných nebo nezvykle velkých návrzích. Tři číslice jsou praktické výchozí nastavení pro většinu webových ikon a ilustrací.
Mám v SVG zachovat ID?
Zachovejte ID, pokud na ně odkazují CSS, JavaScript, atributy aria, přechody, masky, filtry nebo externí dokumenty. U samostatného dekorativního obrázku můžete tuto volbu vypnout a nechat SVGO nepoužité identifikátory odstranit nebo zkrátit.
Odstraňuje optimalizátor skripty ze SVG?
Ano. Proces odstraní prvky script, atributy obsluhy událostí a odkazy JavaScript. Soubor je pak bezpečnější jako běžný webový obrázek, ale nástroj není vhodný pro aplikace SVG, které ke svému fungování potřebují skripty.
Co dělá optimalizace ve více průchodech?
SVGO zpracovává výsledek opakovaně, dokud každý průchod soubor zmenšuje. Některé změny odkryjí další místa, která lze v příštím průchodu vyčistit, takže se může ušetřit ještě trochu prostoru. Největší část úspory obvykle vznikne v prvním průchodu.