Minifikasi JavaScript Online
Optimalkan ukuran bundle JavaScript Anda. Minifikasi atau perindah secara instan.
Mengapa menggunakannya
JavaScript lebih ringan, aplikasi lebih cepat
Pengurangan 40 hingga 60%
Menghapus spasi, komentar, dan mempersingkat variabel tanpa mengubah fungsionalitas.
Privat
JS diproses di browser Anda. Tidak pernah diunggah ke server mana pun.
Dua arah
Minifikasi untuk produksi atau perindah JS yang sudah diminifikasi agar mudah dibaca dan di-debug.
Instan
Hasil dalam milidetik. Tanpa pemrosesan server.
Cara kerjanya
Tiga langkah, tanpa kerumitan
Tempel atau unggah JavaScript Anda
Tempel kode JS langsung atau seret berkas .js. Tanpa batas ukuran.
Pilih: minifikasi atau perindah
Minifikasi untuk produksi (memperkecil variabel, menghapus spasi) atau perindah JS yang sudah diminifikasi agar mudah dibaca.
Salin atau unduh hasilnya
JavaScript yang dioptimalkan muncul secara instan. Salin ke clipboard atau unduh sebagai berkas.
FAQ
Ada pertanyaan?
Minifikasi JavaScript menghapus spasi, komentar, dan jeda baris, mempersingkat nama variabel dan fungsi lokal (renaming/mangling), dan dalam beberapa kasus menghilangkan kode mati. Hasilnya secara fungsional identik tetapi jauh lebih kecil, mengurangi waktu unduh dan waktu parsing mesin JS.
UglifyJS (2010) adalah minifier JavaScript pertama yang diadopsi secara luas, memperkenalkan kompresi dan mangling (pengubahan nama variabel). Terser adalah penerus modern UglifyJS, kompatibel dengan ES2015 dan ES modules. Minify adalah istilah umum untuk pengurangan ukuran. Terser adalah standar de facto saat ini, digunakan secara internal oleh webpack, Vite, Rollup, dan esbuild.
Biasanya 40 hingga 60% dari ukuran asli untuk JavaScript yang diberi komentar dan diformat dengan baik. Berkas 200 KB dapat dikurangi menjadi 80 hingga 120 KB hanya dengan minifikasi. Dikombinasikan dengan kompresi gzip/Brotli, penghematan total dapat melebihi 80%. Pengubahan nama variabel memberikan pengurangan tambahan 10 hingga 20% di atas sekadar menghapus spasi.
JavaScript yang diminifikasi dapat diperindah kembali untuk memulihkan struktur yang dapat dibaca, tetapi nama variabel dan fungsi yang telah diubah tidak dapat dipulihkan: calculateMonthlyPayment mungkin telah menjadi a atau b. Tanpa source map asli, kode yang diperindah berfungsi tetapi sulit dipahami. Source map memetakan kode yang diminifikasi kembali ke sumber asli dan sangat penting untuk debugging di produksi.
Source map adalah berkas .js.map yang membuat korespondensi antara kode yang diminifikasi atau ditranspilasi dan kode sumber aslinya. Ketika terjadi kesalahan di produksi, browser menggunakan source map untuk menampilkan stack trace dengan nama dan nomor baris asli, bukan versi yang diminifikasi. Source map dihasilkan secara otomatis oleh webpack (devtool: source-map), Vite (build.sourcemap: true), atau Terser (--source-map).
Sejarah minifikasi JavaScript dan optimasi bundle
Minifikasi JavaScript bermula dengan JSMin, yang dibuat oleh Douglas Crockford pada tahun 2001. Crockford mengamati bahwa JavaScript yang dikirim ke klien mengandung sejumlah besar spasi dan komentar yang menghabiskan bandwidth yang tidak perlu. JSMin adalah kompressor sistematis pertama: ia menghapus komentar dan spasi sambil mempertahankan semantik bahasa. Tidak lama kemudian, YUI Compressor (Yahoo, 2007) memperkenalkan pengubahan nama variabel dasar, yang meletakkan dasar bagi minifikasi modern.
Tree-shaking adalah teknik terkait tetapi berbeda: sementara minifikasi mengurangi kode yang ada, tree-shaking menghilangkan kode yang tidak pernah dieksekusi (kode mati) dengan menganalisis grafik impor ES module. Rollup mempopulerkan tree-shaking pada tahun 2015; webpack mengadopsinya di versi 2. Code splitting melengkapi teknik-teknik ini dengan membagi bundle menjadi potongan-potongan yang dimuat sesuai kebutuhan melalui dynamic import(), sehingga mengurangi JavaScript awal yang harus di-parse dan dieksekusi oleh browser.
Alat Lighthouse Google menyertakan analisis cakupan JavaScript (tab Coverage di Chrome DevTools) yang mengidentifikasi berapa persen JS yang diunduh benar-benar dieksekusi pada pemuatan awal. Studi HTTP Archive menunjukkan bahwa halaman web rata-rata memuat lebih dari 400 KB JavaScript terkompresi (lebih dari 1 MB tidak terkompresi), menjadikannya sumber daya yang paling merusak Time to Interactive (TTI). Adopsi native ESM di browser modern dan pola modul importmaps mewakili evolusi berikutnya dalam pengiriman JavaScript yang efisien.