Tiada muat naik, 100% setempat, tiada akaun

Pengoptimum SVG

Tampal atau lepaskan SVG dan kecilkan dengan SVGO. Semuanya kekal dalam pelayar anda.

Cara Pengoptimum SVG berfungsi

SVG Optimizer menjalankan SVGO (SVG Optimizer) dalam Web Worker di dalam pelayar anda untuk meminifikasi dan membersihkan fail SVG anda tanpa memuat naik fail tersebut. SVGO menggunakan set plugin yang boleh dikonfigurasi yang mengalih keluar ulasan, meruntuhkan ruang putih, menggabungkan laluan yang sama, menukar bentuk kepada perwakilan paling padat dan melucutkan atribut yang tidak mempunyai kesan visual. Hasilnya ialah SVG yang lebih kecil yang dirender secara identik dengan asal.

Fail SVG yang dihasilkan oleh alat reka bentuk seperti Figma, Illustrator atau Inkscape sering mengandungi overhed yang ketara: metadata khusus penyunting, kumpulan kosong, atribut transformasi berlebihan dan deklarasi ruang nama yang tidak diperlukan oleh mana-mana pelayar. Set plugin lalai SVGO mengalih keluar overhed ini dengan boleh dipercayai. Fail yang dioptimumkan ditawarkan sebagai muat turun dan peratusan pengurangan saiz ditunjukkan supaya anda dapat mengesahkan pengoptimuman itu berbaloi.

Ditulis oleh Bastien Sulyan

Cara menggunakan Pengoptimum SVG, langkah demi langkah

  1. Lepaskan fail SVG anda ke kawasan muat naik atau klik untuk melayari.
  2. Web Worker SVGO menjalankan pengoptimuman serta-merta dengan set plugin lalai.
  3. Lihat peratusan pengurangan dan saiz fail asal berbanding yang dioptimumkan.
  4. Klik Muat Turun untuk menyimpan SVG yang dioptimumkan ke peranti anda.
  5. Jika plugin tertentu menyebabkan masalah pemaparan, laraskan konfigurasi plugin dan optimumkan semula.

Kes penggunaan biasa

  • Pembangun bahagian hadapan mengoptimumkan ikon yang dieksport dari Figma sebelum melakukannya ke dalam saluran aset pengeluaran, mengurangkan setiap ikon daripada 4 KB kepada bawah 1 KB.
  • Pereka web membersihkan ilustrasi SVG yang dieksport dari Illustrator yang mengandungi lapisan metadata penyunting yang tidak kelihatan dalam pelayar tetapi membengkakkan fail.
  • Pembangun yang membina fon ikon dari glyph SVG memastikan setiap SVG sumber bersih dan berstruktur konsisten sebelum langkah pembinaan fon.
  • Jurutera prestasi mengaudit SVG sebaris dalam HTML dan menggantikan setiap asal yang besar dengan versi yang dioptimumkan SVGO untuk meningkatkan berat halaman.

Soalan lazim

Adakah SVGO akan mengubah rupa SVG saya?

Plugin lalai SVGO dipilih untuk tidak menjejaskan penampilan visual: SVG yang dioptimumkan dirender secara identik dengan asal dalam semua pelayar standard. Beberapa plugin agresif (seperti yang membulatkan koordinat laluan dengan sangat berat) boleh memperkenalkan perbezaan pemaparan yang halus. Jika anda perasan perubahan visual, bandingkan fail asal dan yang dioptimumkan dalam pelayar dan nyahdayakan plugin tertentu yang menyebabkan masalah.

Adakah fail SVG dihantar ke pelayan untuk pengoptimuman?

Tidak. SVGO berjalan dalam Web Worker di dalam tab pelayar anda. Teks SVG dibaca dari cakera setempat anda, diproses dalam memori JavaScript, dan output dikembalikan ke halaman untuk dimuat turun. Kandungan fail tidak meninggalkan peranti anda.

Berapa kecil SVG saya akan menjadi?

Pengurangan bergantung pada sumber. SVG yang dieksport dari alat reka bentuk dengan metadata penyunting biasanya mengecil sebanyak 30 hingga 70 peratus. SVG yang ditulis tangan yang sudah kurus mungkin hanya melihat 5 hingga 15 peratus pengurangan. Alat ini menunjukkan kiraan bait tepat dan peratusan supaya anda boleh menilai setiap fail secara individu.

Adakah pengoptimuman mempengaruhi animasi SVG atau JavaScript di dalam fail?

Konfigurasi ini mengekalkan elemen animasi dan atribut SMIL. Ia memang mengalih keluar elemen skrip: alat ini menambah plugin removeScripts di atas praset lalai SVGO, kerana SVG yang bakal anda benamkan tidak sepatutnya membawa kod boleh laku. Sesetengah plugin yang membersihkan atribut boleh berinteraksi dengan animasi jika animasi itu merujuk atribut tersebut mengikut ID; semak output yang dirender selepas mengoptimumkan fail yang menggunakan animasi kompleks.

Bolehkah saya mengoptimumkan berbilang fail SVG sekaligus?

Versi semasa memproses satu fail SVG pada satu masa. Lepaskan fail, muat turun hasilnya, kemudian lepaskan fail seterusnya. Pemprosesan kelompok untuk berbilang fail dalam satu sesi tidak tersedia dalam keluaran ini.

Versi SVGO mana yang digunakan oleh alat ini?

Alat ini membundle SVGO yang berjalan dalam Web Worker. Versi yang dibundle dinyatakan dalam maklumat tentang alat. SVGO diselenggarakan secara aktif dan API plugin berubah dengan ketara antara v1, v2 dan v3; alat semasa menggunakan format plugin v3.

Alat berkaitan

Kekalkan semuanya setempat, terokai alat pelengkap.

Semua alat imej