Optimizator SVG

Lipiți sau plasați un SVG și micșorați-l cu SVGO. Totul rămâne în browser.

Cum funcționează Optimizator SVG

SVG Optimizer rulează SVGO (SVG Optimizer) într-un Web Worker în browserul dumneavoastră pentru a minifica și curăța fișierele SVG fără a le încărca. SVGO aplică un set configurabil de plugin-uri care elimină comentariile, colapsează spațiile albe, unește căile identice, convertește formele la reprezentarea lor cea mai compactă și elimină atributele care nu au efect vizual. Rezultatul este un SVG mai mic care se redă identic cu originalul.

Fișierele SVG produse de instrumente de design precum Figma, Illustrator sau Inkscape conțin adesea o sarcină semnificativă: metadate specifice editorului, grupuri goale, atribute de transformare redundante și declarații de spații de nume pe care niciun browser nu le necesită. Setul implicit de plugin-uri SVGO elimină această sarcină în mod fiabil. Fișierul optimizat este oferit ca descărcare, iar procentul de reducere a dimensiunii este afișat astfel încât puteți confirma că optimizarea a meritat.

Scris de Bastien Sulyan

Cum se folosește Optimizator SVG, pas cu pas

Trasați fișierul SVG în zona de încărcare sau dați clic pentru a naviga.
Web Worker-ul SVGO rulează optimizarea imediat cu setul implicit de plugin-uri.
Vizualizați procentul de reducere și dimensiunile originale și optimizate ale fișierului.
Dați clic pe Descarcă pentru a salva SVG-ul optimizat pe dispozitivul dumneavoastră.
Dacă anumite plugin-uri cauzează probleme de randare, ajustează configurația plugin-urilor și re-optimizează.

Cazuri de utilizare frecvente

Un dezvoltator front-end optimizează pictogramele exportate din Figma înainte de a le comite într-un pipeline de active de producție, reducand fiecare pictograma de la 4 KB la sub 1 KB.
Un web designer curată ilustrații SVG exportate din Illustrator care conțin straturi de metadate ale editorului, invizibile în browser dar care umfla fișierul.
Un dezvoltator care construiește un font de pictograme din glif-uri SVG se asigură că fiecare SVG sursă este curat și consistent structurat înainte de pasul de construcție a fontului.
Un inginer de performanța auditează SVG inline în HTML și înlocuiește fiecare original umflat cu o versiune optimizată SVGO pentru a îmbunătăți greutatea paginii.

Întrebări frecvente

Va schimba SVGO aspectul SVG-ului meu?

Plugin-urile implicite ale SVGO sunt alese pentru a fi vizual fără pierderi: SVG-ul optimizat se redează identic cu originalul în toate browserele standard. Unele plugin-uri agresive (precum cele care rotunjesc coordonatele cailor foarte puternic) pot introduce diferențe subtile de randare. Dacă observi o schimbare vizuală, compara fișierele original și optimizat într-un browser și dezactivează plugin-ul specific care cauzează problema.

Este fișierul SVG trimis către un server pentru optimizare?

Nu. SVGO rulează într-un Web Worker în interiorul tabului de browser. Textul SVG este citit de pe discul local, procesat în memoria JavaScript, iar ieșirea este returnată paginii pentru descărcare. Conținutul fișierului nu părăsește dispozitivul dumneavoastră.

Cât de mult se va micsora SVG-ul meu?

Reducerea depinde de sursă. SVG-urile exportate din instrumente de design cu metadate ale editorului se reduc de obicei cu 30 până la 70 la suta. SVG-urile scrise manual care sunt deja compacte pot vedea doar o reducere de 5 până la 15 la suta. Unealta arată numărul exact de octeti și procentul, astfel încât puteți evalua fiecare fișier individual.

Afectează optimizarea animațiile SVG sau JavaScript din fișier?

Configurația păstrează elementele de animație și atributele SMIL. Elimină însă elementele script: instrumentul adaugă pluginul removeScripts peste presetarea implicită SVGO, deoarece un SVG pe care urmează să îl încorporați nu ar trebui să conțină cod executabil. Unele pluginuri care curăță atributele ar putea interacționa cu animațiile dacă animația face referire la acele atribute prin ID; verificați rezultatul redat după optimizarea fișierelor care folosesc animații complexe.

Pot optimiza mai multe fișiere SVG odată?

Versiunea curentă procesează un singur fișier SVG la un moment dat. Trasați un fișier, descărcați rezultatul, apoi trasați următorul fișier. Procesarea în lot pentru mai multe fișiere într-o singură sesiune nu este disponibilă în aceasta versiune.

Ce versiune de SVGO folosește unealta?

Unealta include SVGO rulat într-un Web Worker. Versiunea inclusă este mentionata în informațiile despre unealta. SVGO este activ intretinut și API-ul de plugin-uri s-a schimbat semnificativ între v1, v2 și v3; unealta curentă folosește formatul de plugin-uri v3.

Instrumente conexe

Păstrează totul local, explorează instrumente complementare.

Toate instrumentele de imagine