HTML Minifier

Tampal HTML untuk membuang komen dan ruang putih berlebihan serta minify CSS dan JavaScript sebaris. Kandungan dalam <pre> dan <textarea> dibiarkan tepat seperti yang ditulis.

Berjalan dalam pelayar andaTanpa pendaftaranTiada apa dimuat naik

Output yang di-minify

Cara menggunakan HTML Minifier

  1. Tampal dokumen atau serpihan HTML, atau buka fail .html.
  2. Pilih apa yang hendak dibuang: komen, ruang putih, dan sama ada blok <style> dan <script> sebaris juga perlu di-minify.
  3. Semak baris amaran: skrip sebaris yang mempunyai ralat sintaks dikekalkan tanpa perubahan supaya tidak merosakkan halaman anda.
  4. Salin HTML yang di-minify atau muat turunnya.

Apa yang dibuang?

  • Komen: <!-- … --> dibuang, kecuali komen bersyarat Internet Explorer dan komen yang bermula dengan <!--!.
  • Ruang putih antara elemen blok: baris baharu dan inden antara tag seperti <div>, <li> atau <head> tidak pernah dipaparkan, jadi ia dibuang sepenuhnya.
  • Ruang berturut-turut dalam teks: ia diruntuhkan menjadi satu ruang, tepat seperti cara pelayar memaparkannya.
  • Ruang putih di dalam tag: <p class = "a"> menjadi <p class="a">.

Apa yang dikekalkan?

Ruang putih penting di sesetengah tempat, dan minifier menghormatinya. Kandungan <pre> dan <textarea> dikekalkan bait demi bait. Satu ruang antara elemen sebaris, seperti <b>bold</b> text, dikekalkan kerana membuangnya akan mencantumkan perkataan. Nilai atribut dan tanda petikan tidak pernah diubah.

CSS dan JavaScript sebaris

Blok <style> sebaris dioptimumkan dengan CSSO dan blok <script> sebaris dengan Terser, enjin yang sama digunakan pada halaman CSS minifier dan JavaScript minifier. JSON-LD dan blok skrip JSON lain dipadatkan, dan skrip jenis yang tidak dikenali (contohnya templat) dibiarkan.

Berbaloikah minify HTML?

Bagi halaman yang dipaparkan pelayan dan laman statik, dokumen HTML ialah perkara pertama yang dimuat turun oleh pelayar, jadi setiap bait yang dijimatkan memendekkan masa ke paparan pertama. Penjimatan 10–25% sebelum pemampatan adalah biasa, lebih lagi untuk templat yang banyak inden dan halaman dengan skrip sebaris yang besar.

Soalan lazim

Adakah minify HTML akan mengubah rupa halaman saya?
Tidak. Hanya ruang putih yang akan diruntuhkan oleh pelayar dibuang, dan kandungan <pre>/<textarea> tidak disentuh. Jika anda menggayakan elemen dengan white-space: pre dalam CSS, matikan Runtuhkan ruang putih.
Adakah ia minify JavaScript dan CSS sebaris?
Ya, apabila pilihan itu dihidupkan. Jika blok sebaris mempunyai ralat sintaks, ia dikekalkan tanpa perubahan dan amaran dipaparkan, jadi halaman tidak akan rosak.
Bolehkah saya minify fail templat seperti Handlebars, Jinja atau Blade?
Biasanya boleh, selagi tag templat muncul dalam teks atau nilai atribut. Templat yang meletakkan logik di dalam nama tag atau antara atribut mungkin perlu disemak secara manual.
Adakah HTML saya dihantar ke mana-mana?
Tidak. Semuanya diproses secara setempat dalam pelayar anda.

Alat berkaitan