๐Ÿ“ฆ

Minifikasi JSON: kapan penting dan kapan tidak

Meminifikasi JSON dapat menghemat 30-50% ukuran file - tetapi hanya jika itu akan penting di hilir. Berikut kapan harus repot, kapan harus melewati, dan cara melakukannya dengan aman.

· 5menit baca

Minifikasi adalah proses menghapus semua whitespace yang tidak perlu dari dokumen JSON. File 2 KB yang sudah di-prettify biasanya menyusut jadi sekitar 1,2 KB โ€” penghematan 35-45%. Sesederhana itu. Pertanyaannya adalah: apakah penghematan byte itu benar-benar penting untuk kasus penggunaan Anda?

Sering kali, tidak. Dan meminifikasi JSON yang tidak perlu diminifikasi hanya membuat hidup lebih susah bagi siapa pun yang harus membacanya. Mari kita bahas kapan trade-off itu layak, dan kapan tidak.

Apa yang sebenarnya dilakukan minifikasi

Minifikasi menghapus:

  • Indentasi (spasi di awal setiap baris)
  • Baris baru antara key, item, dan bracket
  • Spasi setelah titik dua dan koma
  • Trailing whitespace

Ia tidak menghapus:

  • Kutip (itu diperlukan)
  • Nama key (itu data, bukan pemformatan)
  • Key duplikat atau tidak terpakai (itu tetap data)

Diformat:

{
 "name": "Alice",
 "role": "admin",
 "active": true
}

Diminifikasi:

{"name":"Alice","role":"admin","active":true}

Keduanya diparsing ke object JavaScript yang identik. Satu-satunya perbedaan adalah byte di disk atau di jaringan.

Berapa banyak yang Anda hemat dalam praktik

Penghematan bervariasi dengan seberapa โ€œpadatโ€ JSON:

Tipe kontenUkuran diformat tipikalDiminifikasiPenghematan
File konfigurasi (kecil, disetel manusia)800 B450 B~45%
Respons API (banyak record kecil)12 KB7 KB~40%
Dokumen dengan string panjang50 KB43 KB~15%
Dokumen dengan sebagian besar angka8 KB4,5 KB~45%

Penghematan paling besar ketika JSON kompleks secara struktural dengan nilai pendek, dan terkecil ketika itu segelintir string besar.

Kapan harus meminifikasi

1. Respons API production

Jika Anda mengirim JSON dari server ke klien melalui jaringan, minifikasi. Untuk API lalu lintas tinggi:

  • Payload 40% lebih kecil = 40% lebih sedikit bandwidth egress
  • Lebih cepat diserialisasi, ditransmisikan, dan diparsing (lebih sedikit byte di kedua arah)
  • Tidak terlihat bagi klien (mereka tidak pernah membacanya - mereka mem-parsing-nya)

Indentasi adalah bobot mati dalam production. Cadangkan output yang diformat untuk lingkungan pengembangan atau endpoint debug.

URL memiliki batas panjang (biasanya 2048 byte aman). Cookie memiliki batas ukuran (4 KB per cookie). Setiap byte penting. Minifikasi sebelum URI-encoding.

3. JSON yang disimpan dalam database atau log

Jika Anda menyimpan JSON mentah dalam kolom TEXT (agak anti-pattern, tetapi umum), minifikasi sebelum insert. Lebih dari jutaan baris, Anda akan menghemat ruang disk nyata - dan kolom JSON sering tidak terkompresi sebaik teks biasa karena struktur yang diurutkan.

Untuk log terstruktur, minifikasi untuk menjaga baris tetap dapat dibaca pada satu baris layar masing-masing.

4. JSON yang di-bundle ke dalam JavaScript atau HTML

Jika Anda menyelaraskan JSON ke dalam file JavaScript (misalnya const data = {...}) atau HTML (misalnya blok <script type="application/json">), minifikasi. Bundler tidak akan melakukannya untuk Anda dengan andal, dan byte yang dihemat langsung keluar dari bobot halaman Anda.

Kapan tidak meminifikasi

File konfigurasi. package.json, tsconfig.json, dan sejenisnya harus tetap terformat. Meminifikasinya membuat review, pengeditan, dan debugging jauh lebih sulit tanpa manfaat praktis โ€” konfigurasi dibaca oleh alat, bukan dikirim lewat jaringan.

JSON yang disimpan di Git. JSON terformat menghasilkan diff yang berguna. JSON minified menghasilkan satu baris raksasa yang berubah total pada setiap edit kecil โ€” code review jadi mimpi buruk.

# Diformat:
- "version": "1.0.2",
+ "version": "1.0.3",

# Diminifikasi (satu baris):
-{"name":"app","version":"1.0.2","dependencies":{...}}
+{"name":"app","version":"1.0.3","dependencies":{...}}

Commit JSON yang terformat. Selalu.

Data sampel dalam dokumentasi. Kalau Anda menunjukkan struktur JSON di dokumentasi, posting blog, atau README โ€” format. Pembaca perlu bisa memahami bentuknya sekilas.

Output debug. Saat mencoba memahami apa yang dikembalikan API, terformat selalu lebih baik. console.log(JSON.stringify(data, null, 2)) adalah pola yang benar secara universal untuk debugging.

Fixture dan data uji. Fixture yang diminifikasi membuat tes yang gagal lebih sulit didiagnosis. Biarkan tetap terformat.

Kompresi dan minifikasi bersama

Sebagian besar server web menerapkan kompresi gzip atau brotli pada respons JSON secara otomatis. Gzip biasanya mengompresi JSON menjadi 15-25% dari ukuran aslinya.

Setelah kompresi, perbedaan antara JSON yang diformat dan diminifikasi menyusut secara signifikan:

StatusUkuran
Diformat12 KB
Diminifikasi7 KB
Diformat + gzip3,5 KB
Diminifikasi + gzip2,8 KB

Setelah Anda memiliki gzip dalam pipeline, minifikasi menghemat ~20% daripada ~40%. Masih layak dilakukan untuk API lalu lintas tinggi, tetapi kurang kritis daripada yang disarankan angka naif.

Jika Anda tidak menggzip respons JSON Anda (banyak setup backend melupakan ini), perbaiki itu dulu. Gzip saja adalah kemenangan yang lebih besar daripada minifikasi saja.

Cara meminifikasi

Beberapa opsi:

Dalam JavaScript/Node:

const minified = JSON.stringify(obj); // tanpa arg indent = diminifikasi
const formatted = JSON.stringify(obj, null, 2); // indent 2 spasi

Command line dengan jq:

jq -c . input.json > minified.json # -c untuk compact

Online: JSON Formatter kami memiliki tombol Minify. Semuanya berjalan di browser Anda - tanpa unggahan, tanpa data yang dicatat, JSON sensitif tetap aman.

Alur keputusan

  • JSON ini akan melewati jaringan di production? โ†’ Minifikasi
  • Akan masuk ke URL, cookie, atau localStorage? โ†’ Minifikasi
  • Manusia akan membaca atau mengeditnya? โ†’ Jangan minifikasi
  • Akan di-commit ke Git? โ†’ Jangan minifikasi
  • Log atau data tersimpan yang mungkin dibaca saat insiden? โ†’ Jangan minifikasi
  • Masih ragu? โ†’ Jangan minifikasi. Keterbacaan hampir selalu lebih berharga dari beberapa byte yang dihemat.

Minifikasi kalau akan di-parse oleh mesin dan tidak pernah dibaca manusia. Format kalau siapa pun akan membukanya. Kalau ragu, pilih yang bisa dibaca. Byte yang dihemat penting dalam skala besar; waktu yang hilang gara-gara JSON yang tidak terbaca penting bagi setiap orang yang membuka file itu.

JSON Formatter kami punya tombol Format dan Minify. Berjalan di browser, jadi Anda bisa meminifikasi data sensitif โ€” konfigurasi production, respons API dengan data pelanggan โ€” tanpa mengirim apa pun ke mana pun. Format untuk dibaca, minifikasi untuk dikirim. Satu klik untuk masing-masing arah.