Nástroj načíta oficiálne jadro SVGO pre prehliadač až po kliknutí na Optimalizovať. Používa štandardnú súpravu pluginov, odstraňuje skripty a obslužné rutiny udalostí pre bezpečnejšie použitie na webe a umožňuje zachovať ID, od ktorých závisia CSS, JavaScript, prechody, masky alebo externé odkazy.
Optimalizovať SVG zadarmo
Beží celý vo vašom prehliadači - bez nahrávania, bez registrácie.
Skripty a obslužné rutiny udalostí sa odstránia
Pôvodné SVG
Optimalizované SVG
Ctrl alebo Command + Enter
Začnite vložením kódu SVG alebo výberom súboru
Čo robí optimalizátor SVG?
Optimalizátor SVG zmenšuje vektorové súbory odstránením metadát editora, komentárov, nadbytočných atribútov a nepotrebných desatinných miest. Vložte kód alebo vyberte súbor, spustite SVGO v prehliadači a porovnajte pôvodnú a optimalizovanú verziu. Menšie SVG potom skopírujte alebo stiahnite bez odoslania obrázka na server.
Ako na to
- 1Pridajte SVG. Vložte úplný kód SVG, presuňte lokálny súbor .svg do oblasti nahrávania alebo otvorte pripravený príklad.
- 2Vyberte bezpečné nastavenia. Nastavte číselnú presnosť, ponechajte viacnásobné spracovanie zapnuté pre ďalšie zmenšenie a zachovajte ID, ak na ne odkazuje iný kód.
- 3Optimalizujte a porovnajte. Spustite SVGO a porovnajte počet bajtov aj náhľady pôvodnej a optimalizovanej verzie.
- 4Skopírujte alebo stiahnite. Skopírujte kompaktný kód alebo stiahnite nový súbor .optimized.svg bez zmeny pôvodného obrázka.
Pre koho je nástroj určený
- Frontend vývojári, ktorí zmenšujú ikony, logá a ilustrácie pred vložením na web alebo do knižnice komponentov.
- Dizajnéri, ktorí čistia exporty z Figma, Illustratora, Sketchu alebo Inkscape od metadát a značiek špecifických pre editor.
- Tímy pre výkon, ktoré merajú presnú úsporu bajtov UTF-8 pred publikovaním vektorových súborov vo webovom balíku.
- Autori komponentov, ktorí pripravujú kompaktný vložený kód SVG pre React, Vue, Svelte alebo čisté HTML.
Časté otázky
Je tento optimalizátor SVG zadarmo?
Áno. Súbory SVG môžete optimalizovať bez účtu, platby alebo inštalácie. Nástroj zobrazí presnú zmenu v bajtoch UTF-8 a výsledok môžete priamo v prehliadači skopírovať alebo stiahnuť.
Nahráva sa moje SVG na server?
Nie. Čítanie súboru, spracovanie cez SVGO, meranie bajtov aj vytvorenie náhľadov prebieha lokálne v prehliadači. Nástroj nenahráva vaše logá, ikony ani nezverejnené obrázky.
Aký veľký súbor SVG môžem optimalizovať?
Nástroj prijíma zdrojový kód SVG do 5 MB. Tento limit udržiava spracovanie rýchle na telefónoch a bežných notebookoch. Veľmi veľké exportované ilustrácie môžu fungovať lepšie po odstránení vložených rastrových obrázkov alebo rozdelení na menšie súbory.
Môže optimalizácia zmeniť vzhľad SVG?
SVGO je navrhnutý tak, aby zachoval vykreslenie a odstránil len nadbytočné údaje. Agresívne zaokrúhľovanie alebo čistenie ID však môže ovplyvniť zložité súbory. Porovnajte oba náhľady a optimalizované SVG otestujte v skutočnom kontexte pred nahradením súboru v produkcii.
Čo mení desatinná presnosť?
Desatinná presnosť určuje, koľko číslic SVGO zachová v súradniciach, transformáciách a ďalších číselných hodnotách. Nižšia hodnota často ušetrí viac bajtov, ale môže posunúť jemné detaily veľmi presných alebo nezvyčajne veľkých obrázkov. Tri číslice sú vhodným základom pre väčšinu webových ikon a ilustrácií.
Mám zachovať ID v SVG?
Zachovajte ID, keď na ne odkazujú CSS, JavaScript, atribúty aria, prechody, masky, filtre alebo externé dokumenty. Pri samostatných dekoratívnych súboroch môžete voľbu vypnúť a nechať SVGO odstrániť alebo skrátiť nepoužívané identifikátory.
Odstraňuje optimalizátor skripty zo súborov SVG?
Áno. Spracovanie odstráni prvky script, atribúty obsluhy udalostí a odkazy JavaScript. Exportované súbory sú potom bezpečnejšie ako bežné webové obrázky, ale nástroj nie je vhodný pre aplikácie SVG, ktorých fungovanie závisí od skriptov.
Čo robí viacnásobná optimalizácia?
Viacnásobný režim nechá SVGO spracovať výsledok znova, pokiaľ ho ďalší priechod dokáže zmenšiť. Niektoré úpravy odhalia nové možnosti čistenia pre nasledujúci priechod. Dodatočná úspora býva malá, pretože prvý priechod prinesie väčšinu zmenšenia.