Lewati ke konten

Minifier HTML, CSS, dan JavaScript

Perkecil ukuran HTML, CSS, atau JavaScript Anda: komentar dan spasi berlebih dihapus, string dan regex tetap utuh, penghematan ditampilkan. Diproses secara lokal.

  • Gratis
  • Tanpa daftar
  • Tanpa unggah file
  • Windows, Mac, Android, iPhone

Memuat alat…

Tentang alat ini

Tempel HTML, CSS, atau JavaScript, atau buka file: kode dibersihkan dari komentar dan spasi yang tidak perlu, dengan ukuran sebelum dan sesudah. Minify aman: string, template literal, ekspresi reguler, dan isi pre tetap utuh.

Kapan menggunakannya

Memperingan halaman kecil

Untuk halaman statis, email HTML, banner iklan, atau widget yang disematkan, minify memperkecil ukuran unduhan tanpa menyiapkan alat build.

Menyisipkan kode di atribut atau string

CSS atau skrip satu baris lebih mudah ditempel di tag manager, CMS, atau kolom konfigurasi yang tidak menerima baris baru.

Memperkirakan penghematan minify

Sebelum menyiapkan pipeline build, ukur berapa berat file Anda setelah di-minify, di luar kompresi gzip atau brotli dari server.

Cara menggunakan

  1. Pilih bahasa dan tempel kodenya.
  2. Bandingkan ukuran sebelum dan sesudah.
  3. Salin atau unduh kode yang sudah di-minify.

Cara kerjanya

Kode dibaca karakter demi karakter: string bertanda kutip, template literal JavaScript, dan ekspresi reguler disalin apa adanya. Komentar dihapus, kecuali yang diawali /*! (lisensi). Spasi dihapus di mana pun tidak memisahkan dua kata.

Di JavaScript, baris baru dipertahankan jika penyisipan titik koma otomatis mungkin bergantung padanya, sehingga perilaku kode tidak pernah berubah. Di HTML, spasi antar elemen inline dipertahankan (karena terlihat), isi pre dan textarea tidak diubah, dan tag style serta script di-minify dengan bahasanya masing-masing.

Tips untuk hasil terbaik

  • Selalu simpan versi kode yang mudah dibaca: versi minify hanya untuk deployment.
  • Aktifkan juga kompresi gzip atau brotli di server: hasilnya bertambah dengan minify.
  • Untuk proyek lengkap, alat build (Vite, esbuild, Terser) juga mempersingkat nama variabel dan menghapus kode yang tidak dipakai.
  • Uji halaman setelah minify, terutama JavaScript lama yang bergantung pada baris baru.
  • Komentar lisensi /*! … */ dipertahankan: jangan hapus dari pustaka yang Anda distribusikan ulang.

Masalah umum dan solusinya

JavaScript saya tidak berfungsi lagi

Jarang terjadi berkat baris baru yang dipertahankan, tetapi kode yang mencampur pembagian dan ekspresi reguler ambigu bisa bermasalah. Gunakan alat seperti Terser untuk file itu.

Penghematannya kecil

Kode yang sudah ringkas atau tanpa komentar tidak banyak berkurang. Penghematan besar datang dari mengganti nama variabel, yang dilakukan alat build.

Spasi hilang di antara dua kata

Di antara dua elemen inline, spasi dipertahankan; di sekitar tag blok (div, p, li) spasi dihapus karena tidak ditampilkan. Periksa tag yang terlibat.

Pertanyaan umum

Apakah kode saya diunggah?

Tidak. Minify sepenuhnya berjalan di browser; kode tidak pernah meninggalkan perangkat Anda.

Apakah nama variabel dipersingkat?

Tidak, sengaja: itu memerlukan analisis seluruh program. Alat ini hanya menghapus yang aman untuk dihapus.

Apakah komentar kondisional HTML dipertahankan?

Ya, komentar seperti [if IE] dipertahankan; komentar HTML lainnya dihapus.

Bisakah saya mengembalikan kode yang di-minify?

Untuk JSON, gunakan pemformat JSON; untuk SQL, pemformat SQL. JavaScript yang di-minify bisa dirapikan di tab Sources pada developer tools browser.

Pencarian terkait

Masih bermasalah?

Tanyakan di forum: kategori, alat, data perangkat, dan hasil tes akan diisi otomatis.