JavaScript kodunu yapıştır ya da dosyalarını sürükle, Terser ile küçültülmüş halini anında al. Öncesi ve sonrası boyutu, kazancı ve gzip’lenmiş halini gör. Kodun tarayıcından çıkmaz.
Varsayılan ayarlar kodun davranışını değiştirmeyecek şekilde seçildi. Aşağıdaki iki kutu, işaretlenirse programın gözlenebilir davranışını değiştirir.
/**
* Cart totals and discounts.
* @license MIT
*/
const VAT_RATE = 0.20;
function formatMoney(cents) {
return (cents / 100).toLocaleString("tr-TR", { style: "currency", currency: "TRY" });
}
class Cart {
#lines = [];
add(product, quantity = 1) {
this.#lines.push({ product, quantity });
return this;
}
get subtotal() {
return this.#lines.reduce((total, line) => total + line.product.price * line.quantity, 0);
}
total({ discountRate = 0 } = {}) {
const discounted = this.subtotal * (1 - discountRate);
return Math.round(discounted * (1 + VAT_RATE));
}
}
const cart = new Cart()
.add({ name: "Klavye", price: 129900 }, 2)
.add({ name: "Mouse", price: 49900 });
// A coupon code may only contain letters and digits.
const COUPON = /^[A-Z0-9]{4,12}$/;
function discountRate(coupon) {
if (!COUPON.test(coupon)) return 0;
return coupon.startsWith("YAZ") ? 0.25 : 0.1;
}
console.log(`Ara toplam: ${formatMoney(cart.subtotal)}`);
console.log("Ödenecek:", formatMoney(cart.total({ discountRate: discountRate("YAZ2026") })));
JavaScript kodunu kutuya yapıştır, ya da .js dosyalarını üzerine sürükle. Birden fazla dosya bırakırsan aralarına noktalı virgül konarak birleştirilir.
Yorumları silmek, ad kısaltmayı kapatmak ya da console çağrılarını atmak senin elinde. Varsayılanlar kodun davranışını değiştirmeyecek şekilde seçilidir.
Öncesi ve sonrası boyut, kazanç oranı ve çıktının gzip’li hali yan yana durur. Kod ayrıştırılamıyorsa hangi satır ve sütunda takıldığı yazar.
Küçültülmüş kodu tek tıkla panoya al, ya da doğrudan .min.js dosyası olarak indir. Hiçbir adımda kodun sunucuya gitmez.
Küçültme, kodu okunmaz hale getirmek değil, tarayıcının umursamadığı her karakteri atmaktır. Girintiler, satır sonları, açıklama satırları ve zorunlu olmayan noktalı virgüller çalışma anında hiçbir işe yaramaz; yalnızca indirilecek bayt sayısını büyütür. Aşağıdaki tablo, varsayılan ayarlarda hangi dönüşümlerin uygulandığını gösterir.
| Dönüşüm | Öncesi | Sonrası |
|---|---|---|
| Boşluk ve girinti | if (a) { b(); } |
if(a)b(); |
| Yorumlar | // toplamı bul topla(); |
topla(); |
| Yerel değişken adları | function f(){var toplamTutar=1;return toplamTutar} |
function f(){return 1} |
| Sabit ifadeler | var ms = 60 * 60 * 1000; |
var ms=36e5; |
| Erişilmeyen kod | if (false) { eskiYol(); } |
(tamamen atılır) |
| Gereksiz süslü parantez | for (;;) { x(); } |
for(;;)x(); |
Bu araç, kodu düzenli ifadelerle kesip biçen bir betik değil; webpack, Rollup ve Vite gibi paketleyicilerin üretim çıktısını hazırlarken kullandığı Terser’ın kendisidir. Terser kodu önce gerçek bir sözdizimi ağacına çevirir, kapsamları çözer, sonra o ağacı yeniden yazar. Bu yüzden bir dize içindeki eğik çizgiyi yorum başlangıcı, bir düzenli ifade değişmezini bölme işlemi sanmaz.
Küçültücü sayfa açılırken indirilmez. Yalnızca ilk kez “Küçült” dediğinde yüklenir; araca göz atıp geçen biri o dosyayı hiç indirmez.
Yayına almadan önce çıktıyı kendi testlerinle bir kez çalıştırmak her zaman iyi bir alışkanlıktır. Bu araçta kullanılan ayarlar, davranışı değiştirmediği ölçülerek seçildi: otomatik noktalı virgül ekleme, düzenli ifade değişmezleri, şablon dizeleri, üreteçler, async/await, sınıflar ve özel alanlar dahil olmak üzere onlarca örnekte küçültülmüş kodun sonucu özgün kodunkiyle birebir aynı çıktı.
Kendi yazdığı “boşlukları sil” betiğiyle küçültme yapan araçların bozduğu yerler hep aynıdır. Üçü de sözdizimi hatası vermez; kod çalışır, yalnızca yanlış çalışır.
| Tuzak | Neden bozar? | Bu araçta |
|---|---|---|
| Otomatik noktalı virgül | Satır sonundaki return, kendisinden sonraki satırı değil, boş değeri döndürür. Satırları körlemesine birleştiren bir araç bu davranışı tersine çevirir. | Ağaç üzerinden yeniden yazıldığı için anlam korunur. |
| Eğik çizgi: bölme mi, düzenli ifade mi? | a = b / c ile a = /re/g aynı karakteri kullanır. Ayrımı yalnızca dilbilgisel bağlam belirler. | Ayrım ayrıştırıcı düzeyinde yapılır, tahmin edilmez. |
| Fonksiyon adının kaybolması | İç içe bir fonksiyonun adı silinirse fn.name boş dizeye döner; bağımlılık kapları ve ad üzerinden çalışan yönlendirmeler sessizce çöker. | Adlar varsayılan olarak korunur; kapatmak isteyen açıkça kapatır. |
| Dosyaların uç uca eklenmesi | Noktalı virgülle bitmeyen bir dosyanın ardından parantezle başlayan bir dosya gelirse, ikisi tek bir çağrı ifadesi olarak okunur. | Birleştirmede her dosyanın sonuna noktalı virgül konur. |
| Terim | Ne yapar? | Nerede olur? |
|---|---|---|
| Minify (küçültme) | Gereksiz karakterleri atar, adları kısaltır. Sonuç hâlâ geçerli JavaScript’tir. | Derleme sırasında, bir kez. |
| Uglify | Aynı işin eski adı. UglifyJS modern söz dizimini tam desteklemediği için yerini Terser aldı. | Tarihe karıştı. |
| Obfuscate (karartma) | Kodu bilerek okunmaz kılar; dizeleri şifreler, akışı bozar. Boyutu genellikle büyütür. | Ayrı bir araç, ayrı bir amaç. |
| Gzip / Brotli | Baytları aktarım için sıkıştırır. Tarayıcı açar, dosya diskte küçülmüş olmaz. | Her istekte, sunucuda. |
İkisi birbirinin yerine geçmez, birlikte çalışır. Küçültme tekrar eden adları kısalttığı için gzip’in bulacağı örüntüleri de artırır: önce küçültülüp sonra gzip’lenen bir dosya, doğrudan gzip’lenenden gözle görülür biçimde küçük olur. Yukarıdaki sonuç kutusunda hem küçültülmüş boyutu hem de o çıktının gzip’li halini birlikte görürsün.
Kod, düzenli ifadelerle değil, üretim paketleyicilerinin kullandığı Terser ile sözdizimi ağacına çevrilerek yeniden yazılır.
Kaç bayttan kaç bayta indiğini, kazanç oranını ve çıktının gzip’li boyutunu aynı anda gösterir.
Kod ayrıştırılamıyorsa hangi satırın hangi sütununda takıldığını yazar; sessizce yarım çıktı vermez.
Birden çok .js dosyasını bırak, aralarına noktalı virgül konarak birleştirilsin ve tek dosya olarak küçültülsün.
Yorumları koru, ad kısaltmayı kapat, console çağrılarını at. Davranışı değiştiren seçenekler ayrıca işaretlenmiştir.
Küçültme tarayıcında çalışır. Kodun bize ulaşmaz, hiçbir yerde saklanmaz; kapalı kaynak bir projeyi de rahatça yapıştırabilirsin.
Küçültme, kodun çalışmasını değiştirmeden dosya boyutunu düşürmektir. Girintiler, satır sonları, yorumlar ve zorunlu olmayan noktalı virgüller atılır; yerel değişken adları tek harfe iner; sabit ifadeler önceden hesaplanır. Sonuç hâlâ geçerli JavaScript’tir, tarayıcı ek bir işlem yapmadan çalıştırır.
Hayır. Küçültme tamamen tarayıcında çalışır; yazdığın ya da sürüklediğin kod hiçbir zaman bize ulaşmaz ve hiçbir yerde saklanmaz. Kapalı kaynak bir projenin dosyasını da rahatlıkla yapıştırabilirsin.
Terser. webpack, Rollup ve Vite gibi paketleyicilerin üretim çıktısını hazırlarken kullandığı kütüphanenin tarayıcı sürümü sayfaya gömülüdür. Kod düzenli ifadelerle kesilmez; gerçek bir sözdizimi ağacına çevrilir, kapsamlar çözülür ve ağaç yeniden yazılır.
Varsayılan ayarlarda evet. Ayarlar, davranışı koruyacak şekilde seçildi: üst düzey adlar korunur, fonksiyon ve sınıf adları silinmez, console ve debugger ifadeleri sen istemedikçe atılmaz. Yine de yayına almadan önce çıktıyı kendi testlerinle bir kez çalıştırmak iyi bir alışkanlıktır.
Evet. Terser modern söz dizimini bütünüyle okur: ok fonksiyonları, şablon dizeleri, sınıflar ve özel alanlar, üreteçler, async/await, isteğe bağlı zincirleme, nullish birleştirme, BigInt ve sayısal ayraçlar. Dosyanın başında import ya da export varsa modül olarak ayrıştırılır.
Evet, birden çok .js dosyasını aynı anda bırakabilirsin. Dosyalar bıraktığın sırayla, aralarına noktalı virgül konarak birleştirilir. Bu ayrıntı önemlidir: noktalı virgülle bitmeyen bir dosyanın ardından parantezle başlayan bir dosya gelirse, düz birleştirme ikisini tek bir çağrı ifadesi olarak okur ve kod bozulur.
Yalnızca kodun fonksiyon adlarını okumuyorsa. Bu kutu kapalıyken iç içe fonksiyonların adı silinir ve fn.name boş dizeye döner. Bağımlılık kapları, ad üzerinden çalışan yönlendirmeler, hata sınıflarının adına bakan günlükleme kodları bundan sessizce etkilenir. Kazandırdığı birkaç yüz bayt, çoğu projede riske değmez.
Sunucular JavaScript dosyalarını sıkıştırarak gönderir; kullanıcının gerçekten indirdiği bayt sayısı budur. Araç, küçültülmüş çıktıyı tarayıcının kendi gzip kodlayıcısından geçirip ölçer, tahmin etmez. Küçültme tekrar eden adları kısalttığı için gzip’in bulacağı örüntüleri de artırır: önce küçültülüp sonra gzip’lenen dosya, doğrudan gzip’lenenden belirgin biçimde küçüktür.
Araç yarım ya da bozuk bir çıktı üretmez. Ayrıştırıcı takıldığı yeri satır ve sütun numarasıyla birlikte bildirir, sonuç kutusu da kapalı kalır. Bu yüzden küçültücüyü hızlı bir sözdizimi denetleyicisi olarak da kullanabilirsin.
Küçültmenin amacı boyutu düşürmektir; okunaksızlık yan üründür ve kaynak haritasıyla geri alınabilir. Karartma ise kodu bilerek anlaşılmaz kılmayı hedefler: dizeleri şifreler, akışı bozar, sahte dallar ekler. Boyutu genellikle büyütür ve çalışmayı yavaşlatır. İkisi farklı işlerdir; bu araç küçültme yapar.
Hayır, bu araç tek yönlüdür. Küçültme geri alınamaz bir işlem değildir ama silinen bilgi (yorumlar, özgün değişken adları, biçimlendirme) geri getirilemez; bir biçimlendirici yalnızca okunabilir girinti ekler. Özgün kaynağa dönmek istiyorsan derleme sırasında kaynak haritası (source map) üretmen gerekir.