Paano ko babawasan ang laki ng isang SVG file?

I-drop ang isang .svg file o i-paste ang source nito, panatilihin ang mga default na opsyon, at ikumpara ang mga sukat ng Orihinal at Na-optimize. Pagkatapos ay gamitin ang I-download ang .svg o Kopyahin para kunin ang mas maliit na resulta.

Ano ang inaalis ng SVG optimizer bilang default?

Bilang default, inaalis nito ang mga komento, metadata kabilang ang title, desc at data ng Inkscape o Sodipodi, sobrang whitespace, kalabisan na mga default na attribute at ang XML declaration, at nira-round ang mga numero sa 2 decimal place.

Bakit pinananatili ang mga element ID pagkatapos mag-optimize?

Ang Alisin ang mga id attribute ng element ay naka-off bilang default dahil maaaring i-reference ng CSS o JavaScript animation ang mga ID na iyon. I-on lamang ito kung walang anuman sa iyong pahina ang nakasalalay sa mga ito.

Bakit nawala ang aking mga SVG animation?

Ang mga script tag, on-event attribute, external reference at SMIL animation element tulad ng animate at set ay inaalis para sa kaligtasan, kaya ang na-optimize na SVG ay static.

Maaari ko bang gamitin ang na-optimize na SVG sa React o CSS?

Oo. Bukod sa Kopyahin at I-download ang .svg, mayroong Kopyahin bilang JSX, na nagko-convert ng mga attribute sa camelCase, at Kopyahin ang CSS background. Ang Visual preview ay nagbibigay-daan sa iyo upang suriin na ito ay nagre-render pa rin nang tama.

Oo. Libre ang bawat tool, walang account at walang credit card. Ang trabaho ay tumatakbo sa iyong device sa halip na sa aming mga server, kaya ito nananatiling libre.

Ina-upload ba ang mga file ko?

Hindi. Binubuksan at pinoproseso ang mga file mo sa loob ng iyong browser at hindi ipinapadala sa LibraTool. Nagda-download muna ang ilang tool ng processing engine o AI model sa iyong browser; walang data mo sa download na iyon.

Gumagana ba ito sa mobile?

Oo. Gumagana ito sa mga kasalukuyang mobile browser sa iOS at Android, nang walang ini-install. Ang napakalalaking file ay maaaring bumagal o maubusan ng memory sa telepono, kaya gumamit ng computer para sa mga iyon.

✨

Libreng SVG Optimizer at Minifier

Alisin ang metadata, i-collapse ang whitespace, at i-round ang mga decimal para lubhang bawasan ang laki ng SVG file — karaniwang bawas ng 30-70%. Ang visual na preview ay nagpapatunay na walang nasira.

Ang laki ng file ay depende sa iyong deviceNananatiling pribado ang mga fileHindi kailangan ng loginLibre magpakailanman

Gumagana offline kapag na-load na

I-drop ang file dito, o mag-click para mag-browse

SVG · pinoproseso sa iyong device

o pindutin ang Ctrl+V para i-paste mula sa clipboard

I-browse ang mga file

— o i-paste ang SVG sa ibaba —

Ang iyong mga file ay hindi kailanman lumalabas sa iyong device. Lahat ng pagproseso ay nangyayari nang lokal sa iyong browser.

Mga karaniwang gamit

I-optimize ang SVG Icon para sa ProductionTanggalin ang hindi kinakailangang metadata mula sa icon SVG bago mag-ship — karaniwang pagbawas ng 50-80%.
I-optimize ang Brand Logo SVGBawasan ang SVG logo file size para sa mabilis na website loading nang hindi sinasacrifice ang kalidad.
I-optimize ang mga Illustration at Hero SVGPara sa mas malalaking illustration (hero, decorative graphics), ang optimization ay maaaring mag-shave ng 30-70% off file size.
Bawasan ang JavaScript Bundle SizeKapag ang mga SVG ay ini-import bilang React component o naka-inline sa code, ang pag-optimize sa kanila ay nag-shrink ng iyong JS bundle.
Linisin ang Figma / Sketch SVG ExportAng Figma at Sketch SVG export ay may kasamang extensive metadata. Tanggalin ito bago gamitin sa production.

Paano ito Gumagana

Binabawasan ng tool na ito ang laki ng SVG file gamit ang hand-written na optimizer na buong tumatakbo sa iyong browser — walang library, walang server. Pinagsasama nito ang dalawang pagdaan: ang built-in na DOMParser/XMLSerializer ng browser para sa eksaktong trabaho sa antas ng attribute, at mga tiyak na regex substitution para sa pag-alis ng komento, metadata, at pagsasama ng whitespace.

1
Sina-sanitize ng DOMParser ang SVG
Bago ang anumang optimization, binabasa ng DOMParser ng browser ang SVG bilang XML at dinadaanan ang bawat element. Walang kondisyong inaalis ang mga script tag, event handler (anumang on* na attribute), animation element, at panlabas na URL reference — tumatakbo ito anuman ang mga opsyon sa optimization na pipiliin mo.
2
DOM-based na pag-round ng decimal
Kung naka-enable ang pag-round ng decimal, dinadaanan ulit ng optimizer ang na-parse na DOM at nag-a-apply ng rounding sa mga kilalang numeric attribute lang (path d data, coordinate, transform value, stroke width, atbp.), gamit ang regex na tumutugma sa mga indibidwal na floating-point number nang hindi sinisira ang magkakadikit na path value gaya ng .5.5.
3
Nililinis ng mga regex pass ang na-serialize na markup
Gumagawa ang XMLSerializer ng normalized na XML, pagkatapos ay inaalis ng mga tiyak na string replacement ang mga HTML comment, editor metadata ng Inkscape/Sodipodi, ang XML declaration, labis na default attribute (gaya ng version="1.1"), at whitespace sa pagitan ng mga tag — makitid ang saklaw ng bawat pagdaan kaya hindi kailanman ginagalaw ang laman ng text node.
4
Laki sa gzip at mga export format
Kinakalkula ng CompressionStream API ng browser ang totoong gzip size ng input at output, dahil iyon ang aktuwal na nagtatakda ng gastos sa paglipat sa web. Puwedeng i-download ang na-optimize na SVG, kopyahin bilang raw na SVG, i-convert sa camelCase na attribute na handa para sa React JSX, o i-encode bilang CSS data URI — nangyayari nang lokal ang lahat ng conversion.

Binabasa at pinoproseso nang buo ang SVG mo sa loob ng tab ng iyong browser — hindi kailanman umaalis sa device mo ang mga byte ng file.

Mga Kaugnay na Tool

🗜️

CSS Minifier at Beautifier

I-minify ang CSS para bawasan ang laki ng file o i-beautify ang minified na CSS para sa pagiging madaling basahin. Mabilis, sa iyong browser.

Subukan

🗜️

GIF Compressor

Paliitin ang animated na GIF: iangkop sa limitasyon ng laki gaya ng 256 KB na emoji o 512 KB na sticker ng Discord, o piliin mismo ang mga kulay, lapad at frame. Tumatakbo sa iyong browser; hindi ina-upload ang GIF.

SubukanLokal ang mga file

📄

Tagapiga ng PDF

I-compress ang mga PDF file para paliitin ang laki. Pumili ng antas ng kalidad — mas mataas na compression ay mas maliit na file ngunit mas mababang kalidad ng larawan.