Web Geliştirme

JS Minify / Beautify

Üretim için JavaScript'i sıkıştırın veya sıkıştırılmış kodu okunabilir bir biçime dönüştürün.


                        
                    

Minifying JavaScript strips whitespace, comments, and line breaks, and often shortens local variable names — none of that changes how the code runs, but it noticeably shrinks the file for a faster load.

How to use it

Common uses

Things to keep in mind

Minification isn't obfuscation — variables get renamed to shrink size, not to hide logic; serious obfuscation needs dedicated specialized tools.

Minified code in production without a source map is hard to debug — the line numbers in error messages won't match the original file.

Bu araç hakkında makale: JavaScript küçültme: küçültme ile karartma arasındaki fark

Sıkça sorulan sorular

Küçültücü perde arkasında hangi aracı kullanır?

Modern sözdizimini de anlayan, yaygın olarak kullanılan bir JavaScript küçültücü ve sıkıştırıcı olan terser'ı kullanır.

Küçültülmüş JavaScript'te hata ayıklamak neden daha zordur?

Terser değişken ve fonksiyon adlarını kısaltır, boşlukları ve yorumları kaldırır ve bu araç bir source map üretmediğinden, tarayıcı geliştirici araçları küçültülmüş kodu okunabilir orijinal satırlarla eşleştiremez.

Küçültme kodumu bozar mı?

Sözdizimsel olarak geçerli JavaScript için küçültme davranışı korur; bir sözdizimi hatası varsa, araç satır ve sütunu bildirir, böylece küçültmeden önce düzeltebilirsiniz — her şey kodunuzu yüklemeden yerel olarak çalışır.

Tree shaking, küçültmeden nasıl farklıdır?

Tree shaking, derleme sırasında modül bağımlılık grafiğini analiz ederek hiçbir yerde kullanılmayan kodu paketten kaldırır, küçültme ise yalnızca zaten var olan kodun metinsel gösterimini kısaltır — gerçekten çalıştırılan hiçbir fonksiyonu kaldırmaz.

Ek test yapmadan üretimde küçültülmüş JavaScript kullanmak güvenli midir?

Evet, küçültme tamamen sözdizimsel bir dönüşümdür ve programın davranışını tamamen aynı tutar; küçültmeden sonra herhangi bir davranış farkı, kasıtlı bir mantık değişikliğini değil, küçültücünün kendisindeki bir hatayı gösterir.

Makaleler: Web Geliştirme

HEX, RGB, HSL: bir rengi yazmanın neden bu kadar çok yolu var

Tasarımcılar elle bir renk tonu seçerken neden genellikle HEX yerine HSL'yi tercih eder.

CSS küçültme: dosyadan gerçekte ne kaldırılır ve neden

Küçültülmüş CSS, insan için okunamaz hale gelse de tarayıcıda neden tam olarak aynı şekilde çalışır.

HTML küçültme: işaretlemedeki boşluklar neden önemli

<pre> veya bir textarea içindeki boşlukları kaldırmak, hemen hemen her yerin aksine sayfanın görünümünü neden bozabilir.

CSS gradyanları: linear, radial ve conic'ten nasıl farklıdır

conic-gradient neden pasta grafikleri için işe yararken, radial-gradient neden bir ışık lekesi efekti verir.

Luhn algoritması: bir kart numarasının doğruluğu nasıl kontrol edilir

Luhn kontrolünden geçen bir kart numarasının, o kartın gerçekten var olduğu anlamına neden gelmediği.

IBAN: uluslararası bir banka hesap numarası nasıl yapılandırılmıştır

Bir IBAN'ın ilk iki harfinin neden hesap numarasının bir parçası değil, bir ülke kodu olduğu.

QR kodları: bir bağlantı piksellerden oluşan bir kareye nasıl sığar

Ortasında logo bulunan bir QR kodu, desenin bir kısmı kaplanmış olsa bile neden hâlâ taranabiliyor.

Barkodlar: Code 128, EAN-13'ten nasıl farklıdır

Mağaza raflarındaki ürünlerin neredeyse her zaman Code 128 yerine EAN-13 kullandığı.

Placeholder görseller: geliştirme sırasında sahte resimler neden önemli

Bir tasarım henüz inşa halindeyken geliştiricilerin gerçek fotoğraflar yerine bilerek gri kutular yerleştirdiği.