Cara Kerja Pengoptimuman SVG
Pengoptimasi SVG berfungsi dengan membersihkan dan mengecilkan kod SVG tanpa mengubah rupa grafik yang dipaparkan. Pengguna hanya perlu menampal kod SVG ke dalam kawasan input, dan alat ini akan memproses kod tersebut untuk membuang bahagian yang tidak diperlukan. Selepas proses selesai, alat ini menunjukkan perbezaan saiz antara fail asal dengan fail yang telah dioptimumkan, serta membolehkan pengguna menyalin atau memuat turun kod yang telah dikecilkan itu.
Proses pembersihan ini beroperasi secara selamat dengan menyasarkan elemen kod yang tidak memberi kesan kepada paparan visual. Antara komponen yang dibuang termasuk ulasan (comments), metadata, ruang nama editor (editor namespaces), jarak atribut tambahan, ruang nama yang tidak digunakan, dan penulisan warna setara yang lebih pendek.
Untuk memastikan integriti grafik tidak terjejas, alat ini mengekalkan elemen penting seperti viewBox, ID, label, dan geometri asal. Pengoptimasi ini juga mengelak daripada melakukan tindakan agresif seperti menulis semula laluan (path rewrites), menamakan semula ID, membuang viewBox, dan pembulatan kejituan (precision rounding).
Kepentingan Saiz Fail SVG dalam Prestasi Web
SVG (Scalable Vector Graphics) memainkan peranan penting dalam reka bentuk dan pembangunan web moden. Format ini berasaskan XML, yang membolehkan grafik diskalakan ke sebarang saiz tanpa kehilangan kualiti. Walau bagaimanapun, perisian reka bentuk grafik sering memasukkan kod tambahan yang tidak diperlukan oleh pelayar web untuk memaparkan imej tersebut.
Mengoptimumkan saiz fail SVG secara langsung mempengaruhi masa pemuatan laman web dan pengalaman pengguna. Fail SVG yang lebih kecil bermakna pemindahan data yang lebih pantas, terutamanya bagi pengguna peranti mudah alih atau sambungan internet yang perlahan. Apabila menggunakan SVG dalam talian (inline SVG) secara terus di dalam dokumen HTML, setiap bait kod yang tidak diperlukan akan melambatkan proses analisis (parsing) dokumen oleh pelayar web. Dengan membuang kod berselerak, kecekapan rendering halaman dapat ditingkatkan.
Sekatan Format dan Pengendalian Ralat
Alat ini direka untuk mengendalikan kod SVG dalam talian yang biasa, namun terdapat beberapa had dan peraturan format yang ditetapkan untuk memastikan keselamatan dan kestabilan proses:
- Had Saiz Aksara: SVG yang dimasukkan mestilah berada di bawah had aksara maksimum yang ditetapkan. Jika had ini dilampaui, sistem akan memaparkan ralat: "SVG ini terlalu besar untuk alat ini. Sila pastikan ia di bawah
{max}aksara.". - Sekatan Jenis Dokumen: SVG yang mengandungi jenis dokumen (doctype) atau pengisytiharan entiti tersuai (custom entity declarations) akan disekat. Jika dikesan, mesej ralat yang dipaparkan ialah: "SVG ini menggunakan jenis dokumen atau entiti tersuai. Sila buang entiti tersebut sebelum mengoptimumkan.". Sekatan ini penting untuk keselamatan bagi mengelakkan implikasi keselamatan berkaitan analisis entiti XML dalam aplikasi web.
- Had Masa Proses: Sekiranya proses pengoptimuman mengambil masa melebihi 15 saat, operasi akan dihentikan secara automatik dengan paparan ralat: "Proses mengambil masa terlalu lama dan telah dihentikan — sila cuba SVG yang lebih kecil.".
- Input Kosong atau Tidak Sah: Jika butang pengoptimuman ditekan tanpa sebarang input, mesej "Tampal kod SVG terlebih dahulu." akan muncul. Sekiranya input yang dimasukkan tidak mengandungi sebarang elemen SVG, sistem akan memaparkan ralat: "Tiada elemen <svg> ditemui.". Bagi ralat pemprosesan umum yang lain, mesej "Tidak dapat mengoptimumkan SVG ini." akan ditunjukkan.
Sebarang tindakan mengosongkan input atau menukar kandungan input semasa proses pengoptimuman sedang berjalan akan menghentikan proses tersebut serta-merta.
Privasi dan Pemprosesan Data
Keselamatan data pengguna adalah keutamaan dalam pengendalian alat ini. Kod SVG anda dioptimumkan di dalam pelayar anda. Tiada apa-apa yang dimuat naik ke BroBroGo. Kesemua proses analisis, pembersihan, dan pengurangan saiz kod dilakukan secara lokal pada peranti anda sendiri, tanpa melibatkan sebarang penghantaran data ke pelayan luar.
Metrik Prestasi Pengoptimuman
Selepas proses pengoptimuman selesai, alat ini akan memaparkan statistik prestasi berdasarkan tiga metrik utama:
| Metrik | Label Antara Muka | Penerangan |
|---|---|---|
| Asal | Asal | Saiz kod SVG asal sebelum dioptimumkan (dalam unit bait). |
| Hasil | Hasil | Saiz kod SVG yang telah dibersihkan (dalam unit bait). |
| Dijimatkan | Dijimatkan | Jumlah ruang yang berjaya dikurangkan, dinyatakan dalam nilai bait dan peratusan. |
Jika pengoptimuman berjaya mengurangkan saiz fail, sistem akan memaparkan mesej kejayaan: "Dioptimumkan — {pct}% lebih kecil ({saved} dijimatkan).". Sekiranya kod SVG yang dimasukkan sudah berada dalam keadaan paling optimum dan tiada pengurangan saiz berlaku melalui kaedah pembersihan selamat, sistem akan memaparkan mesej: "Dioptimumkan. Tiada pengurangan saiz dengan pembersihan selamat yang ditetapkan.".
Soalan Lazim (FAQ)
Apakah yang dibuang oleh alat ini?
Ia membuang ulasan, metadata, ruang nama editor, jarak atribut tambahan, ruang nama yang tidak digunakan dan warna setara yang lebih pendek. Ia mengekalkan viewBox, ID, label dan geometri seperti asal.
Bolehkah ia mengoptimumkan setiap SVG?
Ia mengendalikan kod SVG dalam talian (inline) yang biasa. SVG dengan jenis dokumen (doctype) atau pengisytiharan entiti tersuai disekat kerana ia boleh menyebabkan proses analisis menjadi tidak selamat. Buang pengisytiharan tersebut dan cuba lagi.
Adakah ia akan mengubah rupa grafik tersebut?
Alat pengoptimuman ini mengelak daripada menulis semula laluan (path), menamakan semula ID, membuang viewBox dan pembulatan kejituan. Jika SVG anda bergantung pada ulasan atau metadata untuk aliran kerja reka bentuk, sila simpan salinan fail asal.
Adakah fail SVG saya disimpan di pelayan?
Tidak. Kod SVG anda dioptimumkan di dalam pelayar anda dan tiada apa-apa yang dimuat naik ke BroBroGo.