JavaScript Biçimlendirici ve Küçültücü

JavaScript Biçimlendirme Nedir?

Temel Özellikler

Örnekler

function add(a,b){return a+b}const doubled=[1,2,3].map(x=>x*2);console.log(doubled)

async function load(id){const r=await fetch(`/api/${id}`);if(!r.ok)throw new Error('bad');return r.json()}

const cfg={retries:3,timeout:5000,headers:{'Content-Type':'application/json'},onError(e){console.warn(e)}}

class Counter{#n=0;inc(){this.#n++}get value(){return this.#n}}

Yaygın Kullanım Senaryoları

Küçültülmüş kodu okuma

Küçültülmüş veya karartılmış bir scripti anlayıp hata ayıklayabilmek için güzelleştirin.

Kod incelemesi

Tutarlı, fark alınabilir kod için pull request açmadan önce JavaScript'i biçimlendirin.

Daha küçük paketler gönderme

Bayt azaltmak ve yükleme hızını artırmak için üretim JavaScript'ini Terser ile küçültün.

Parçacık düzenleme

Konsoldan veya bir gist'ten yapıştırılan bir kodu temiz, okunabilir koda yeniden biçimlendirin.

Teknik Ayrıntılar

js-beautify ile güzelleştirilir

Öngörülebilir, yapılandırılabilir girinti ve boşluk için kanıtlanmış js-beautify motorunu kullanır.

Terser ile küçültülür

Terser, fiili JavaScript küçültücüsüdür — yerel değişkenleri yeniden adlandırır, ölü kodu düşürür ve davranışı koruyarak yorumları soyar.

Tarayıcı tabanlı

Tamamen istemci tarafında çalışır; kodunuz cihazınızdan çıkmaz veya bir sunucuya ulaşmaz.

En İyi Uygulamalar

Kaynağı biçimlendirin, üretim için küçültün

Okunabilir kodu deponuzda tutun; derlemenizin Terser ile küçültmesine izin verin.

Modern sözdizimini dikkatli küçültün

Terser standart JavaScript'i hedefler; çok yeni öneriler önce bir derleme adımı gerektirebilir.

Küçültülmüş çıktıyı elle düzenlemeyin

Yeniden adlandırılmış değişkenler küçültülmüş kodu elle bakımı zor kılar — kaynağı düzenleyin, sonra yeniden küçültün.

Sıkça Sorulan Sorular