Uraikan minifikasi dan rapikan kode Anda secara online
Tempel JavaScript, CSS, HTML, XML, atau JSON yang diminifikasi dan dapatkan kode yang mudah dibaca dengan indentasi rapi. Gratis, instan, dan diproses sepenuhnya di browser Anda.
Uraikan minifikasi format tertentu
Setiap format memiliki halaman tersendiri dengan penjelasan yang relevan untuk bahasa tersebut:
Apa itu minifikasi kode?
Pengembang menulis kode agar dapat dibaca pengembang lain. Karena itu, kode dilengkapi komentar, indentasi, baris kosong antarblok, dan nama variabel yang menjelaskan isinya. Semua itu membantu manusia, tetapi tidak dibutuhkan browser. Minifikasi adalah tahap build yang membuang segala hal yang tidak diperlukan mesin: spasi, pergantian baris, komentar, dan sering kali nama asli variabel serta fungsi yang diganti menjadi satu huruf. Perilaku program tetap sama persis, hanya bentuk penulisannya yang berubah.
Manfaatnya nyata. Bundle JavaScript yang diminifikasi umumnya berukuran 30 hingga 70 persen lebih kecil daripada sumbernya. Artinya, lebih sedikit data yang dikirim lewat jaringan, tampilan awal lebih cepat, dan Core Web Vitals lebih baik. Itulah sebabnya hampir semua situs produksi menyajikan JS, CSS, dan HTML yang diminifikasi. Konsekuensinya, file yang Anda unduh dari situs menjadi satu baris padat yang sulit dibaca siapa pun. Untuk memahami, menelusuri kesalahan, atau mengaudit apa yang sebenarnya dilakukan file tersebut, Anda perlu menguraikan minifikasinya terlebih dahulu.
Apa yang dilakukan alat pengurai minifikasi ini?
LFUnminify menerima kode yang diminifikasi dan menyusun kembali strukturnya agar mudah dibaca. Alat ini mengembalikan indentasi, menempatkan setiap pernyataan pada baris tersendiri, memberi jarak pada blok dan operator, serta menerapkan aturan pemformatan yang konsisten sesuai bahasa yang terdeteksi. Bundle satu baris sepanjang empat ribu karakter berubah menjadi ratusan baris dengan susunan bertingkat yang rapi, sehingga Anda dapat menelusuri, mencari, dan memahami alurnya.
Di balik layar, alat ini menjalankan Prettier, pemformat yang sudah digunakan oleh banyak tim JavaScript, langsung di browser Anda. Hasilnya mengikuti format yang biasanya diterapkan editor pada file sumber biasa, sehingga terasa familier. Deteksi berjalan otomatis: tempel kode apa pun dan alat akan menentukan apakah isinya JavaScript, CSS, HTML, XML, atau JSON sebelum memformatnya sesuai bahasa tersebut.
Ada batasan yang perlu dijelaskan sejak awal. Menguraikan minifikasi bukanlah dekompilasi. Komentar, nama variabel asli, dan catatan pengembang telah dihapus saat build, dan tidak ada alat yang dapat mengembalikannya. Anda mendapatkan kode yang terstruktur, mudah dibaca, dan mudah ditelusuri, dengan nama pendek hasil minifikasi tetap dipertahankan. Dalam praktiknya, itu cukup untuk mengikuti logika, menemukan fungsi, atau melihat data apa yang dikirim skrip dan ke mana tujuannya.
Format kode yang didukung
Satu editor, lima bahasa. LFUnminify membaca konten yang Anda tempel, mengenali bahasanya, lalu meneruskannya ke pengurai yang sesuai dengan sintaks tersebut. Anda tidak perlu memilih format dari menu, dan file dengan ekstensi yang keliru tetap dapat ditangani dengan benar:
- JavaScript, termasuk sintaks ES6 dan versi setelahnya, modul, kode asinkron, dan JSX. Contoh umumnya adalah bundle yang dihasilkan webpack, Vite, esbuild, atau Terser.
- CSS, termasuk sintaks modern, properti kustom, media query, dan aturan bersarang. Cocok untuk stylesheet yang dikompilasi oleh Tailwind, Sass, atau PostCSS.
- HTML, termasuk blok script dan style di dalam dokumen yang ikut diformat bersama markup, bukan dibiarkan sebagai satu baris panjang.
- XML, termasuk sitemap, feed RSS, file SVG, envelope SOAP, dan file konfigurasi tanpa satu pun pergantian baris.
- JSON, termasuk respons API dengan susunan bersarang yang dalam, manifes paket, file konfigurasi, dan data log.
Kapan Anda memerlukan pengurai minifikasi kode?
Menguraikan minifikasi jarang sekadar soal rasa ingin tahu. Biasanya, ini cara tercepat untuk menjawab pertanyaan konkret tentang kode orang lain, atau kode buatan sendiri yang sudah tidak mudah dibaca:
- Menelusuri bug di produksi. Stack trace menunjuk baris 1, kolom 24815 dalam sebuah bundle. Memformat file memberi Anda nomor baris yang berguna dan membantu menemukan fungsi yang benar-benar memicu kesalahan.
- Mengaudit skrip pihak ketiga. Sebelum memasang tag analitik, widget obrolan, atau skrip afiliasi di situs, uraikan minifikasinya dan periksa data yang dikumpulkan, domain yang dihubungi, serta data yang ditulis ke penyimpanan.
- Membaca stylesheet hasil kompilasi. Framework utilitas menghasilkan file CSS sangat besar dalam satu baris. Merapikannya membantu Anda melihat cascade, menemukan aturan yang berlaku, dan memahami mengapa aturan pengganti Anda diabaikan.
- Memeriksa respons API. Data JSON yang disalin dari tab jaringan sulit dibaca sebelum diformat. Setelah dirapikan, struktur, susunan bersarang, dan kolom yang hilang akan terlihat dalam hitungan detik.
- Belajar dari kode nyata. Membaca cara sebuah pustaka yang dirancang dengan baik menyelesaikan masalah adalah cara cepat untuk meningkatkan kemampuan, dan file yang diformat membuatnya nyaman dibaca.
Cara menggunakan LFUnminify
Ada tiga cara memasukkan kode ke editor. Tempel langsung ke panel kiri, klik Pilih file untuk membuka file dari perangkat Anda, atau seret dan lepas file ke area masukan. Untuk memeriksa aset dari situs aktif, buka melalui view-source atau DevTools browser, salin isinya, lalu tempel di sini. Anda juga dapat menyimpan file .js, .css, .html, .xml, atau .json dan membukanya lewat Pilih file.
Pemformatan dimulai secara otomatis, tanpa perlu mencari tombol. Alat menunggu hingga Anda berhenti mengetik, mendeteksi bahasa, lalu menampilkan hasil yang rapi di panel kanan dengan penyorotan sintaks. Anda dapat menyalin seluruh hasil ke papan klip dengan satu klik atau mengunduhnya sebagai file dengan nama yang sesuai untuk dibuka di editor Anda.
Dua fitur kecil membantu saat menangani file panjang. Aktifkan nomor baris untuk merujuk posisi tertentu atau membandingkan dua versi berdampingan; pilihan ini akan diingat pada kunjungan berikutnya. Jika format yang terdeteksi berbeda dari perkiraan, itu sering menjadi petunjuk: file yang dianggap JSON tetapi terbaca sebagai JavaScript mungkin sebenarnya merupakan respons JSONP atau konfigurasi yang dibungkus dalam penetapan variabel.
Kode Anda tidak pernah meninggalkan perangkat Anda
Hal ini perlu ditegaskan. Pemformatan berlangsung secara lokal di browser dengan JavaScript yang dimuat bersama halaman. Kode Anda tidak diunggah, tidak masuk antrean server, tidak ditulis ke basis data, dan tidak dicatat di mana pun. Anda dapat memutus koneksi jaringan setelah halaman dimuat dan alat tetap bekerja. Itulah bukti paling sederhana bahwa tidak ada yang dikirim.
Artinya, Anda dapat menempel kode milik perusahaan, bundle internal, proyek klien, atau file konfigurasi dengan struktur yang tidak ingin dibagikan. Konten yang Anda tempel atau buka tidak pernah keluar dari browser, dan alat ini tidak mengambil file atas nama Anda, sehingga server kami tidak mengetahui kode atau situs yang sedang Anda periksa. Anda tidak perlu membuat akun dan konten yang ditempel tidak dilacak.
Mengapa LFUnminify gratis?
LFUnminify merupakan bagian dari kumpulan alat gratis buatan Ludovic Frank, bersama pembuat kata sandi, pembuat favicon, penyusun palet warna, dan beberapa alat lain. Alasannya sederhana: utilitas kecil yang digunakan pengembang beberapa kali seminggu seharusnya tidak memerlukan pendaftaran, terhalang iklan, atau dibatasi kredit. Alat ini tidak memerlukan akun, tidak memiliki kuota, dan tidak menawarkan peningkatan berbayar di dalam produk.
Alat ini juga menjadi demonstrasi nyata cara kami bekerja. Setiap alat adalah aplikasi sungguhan yang dibangun dan dipelihara sebagaimana proyek klien, sehingga menunjukkan kemampuan kami lebih jelas daripada halaman portofolio. Jika Anda membutuhkan pengembangan web khusus, aplikasi serius alih-alih templat, atau konsultasi teknis, Anda dapat menghubungi kami melalui tautan di bagian bawah halaman.
Pertanyaan yang sering diajukan
Bisakah saya memulihkan kode sumber asli dari file yang diminifikasi?
Tidak sepenuhnya, dan berhati-hatilah terhadap alat yang mengklaim sebaliknya. Minifikasi menghapus komentar secara permanen dan biasanya mengganti nama variabel menjadi satu huruf, sehingga informasi tersebut sudah tidak ada di dalam file. LFUnminify memulihkan struktur, indentasi, dan pergantian baris agar kode kembali mudah dibaca serta ditelusuri, tetapi tidak dapat menciptakan kembali nama atau komentar yang dibuang saat build. Jika source map diterbitkan bersama bundle, itulah satu-satunya cara untuk mendapatkan kembali sumber aslinya.
Apakah kode saya dikirim ke server?
Tidak. Pemformatan berjalan sepenuhnya di browser dengan JavaScript yang dimuat bersama halaman. Tidak ada konten yang diunggah, disimpan, atau dicatat. Server kami juga tidak mengambil file untuk Anda. Untuk memeriksa file dari situs aktif, Anda menyalin atau menyimpannya sendiri lalu membukanya di sini, sehingga seluruh proses tetap berlangsung antara Anda dan browser Anda.
Format apa saja yang didukung?
JavaScript, CSS, HTML, XML, dan JSON. Format dideteksi otomatis dari konten sehingga Anda tidak perlu memilihnya, dan setiap bahasa ditangani oleh pengurai yang dirancang untuk bahasa tersebut. JavaScript mencakup sintaks modern seperti modul ES dan JSX, CSS mencakup properti kustom dan aturan bersarang, sedangkan XML mencakup sitemap, feed RSS, hingga file SVG.
Apakah ada batas ukuran?
Tidak ada batas tetap untuk konten yang ditempel, tetapi file sangat besar membutuhkan waktu lebih lama karena pemrosesan dilakukan oleh prosesor Anda sendiri, bukan server. Bundle berukuran beberapa megabita dapat diformat dengan baik pada laptop biasa. Aturan yang sama berlaku untuk file yang dibuka melalui Pilih file atau diseret ke area masukan karena file dibaca secara lokal, bukan diunggah.
Apa perbedaan menguraikan minifikasi dan merapikan kode?
Dalam praktiknya, kedua istilah menggambarkan operasi yang sama, dan alat ini melakukannya sekaligus. Menguraikan minifikasi biasanya berarti membalik pemadatan file saat build, sedangkan merapikan kode berarti memformat ulang kode apa pun, baik yang diminifikasi maupun tidak, sesuai aturan gaya yang konsisten. Karena LFUnminify menjalankan Prettier pada masukan, Anda juga dapat menggunakannya untuk memperbaiki indentasi kode yang belum pernah diminifikasi.
Bisakah alat ini digunakan untuk JavaScript yang diobfuskasi?
Kode tersebut dapat diformat, dan itu sering menjadi langkah awal yang berguna, tetapi pemformatan tidak membatalkan obfuskasi. Alat obfuskasi melangkah lebih jauh daripada minifikasi dengan menyandikan string, memecah alur kontrol, dan sengaja menambahkan kode mati. Merapikan file semacam ini menghasilkan struktur yang mudah dibaca agar logikanya lebih mudah ditelusuri, tetapi pengaburan yang disengaja tetap ada.