JS küçültücü

Daha hızlı sayfalar için daha hafif JavaScript

JavaScript çoğu zaman bir web sayfasının en pahalı kaynağıdır: indirilmesi, ayrıştırılması ve çalıştırılması gerekir ve sayfanın dokunuşlara ve tıklamalara ne kadar hızlı yanıt verdiğini geciktirebilir. Küçültme yorumları, boşlukları ve satır sonlarını silerek dosyayı küçültür; araç öncesindeki JS karakter sayısını ve sonrasındaki küçültülmüş JS karakter sayısını gösterir.

Küçük projelerdeki script’ler, bir CMS’e eklediğiniz kod parçacıkları, takip veya widget kodları ya da bunu otomatik yapan bir bundler’ınız olmayan her yer için kullanın.

Kodun davranışı aynı kalır. Düzenleme ve hata ayıklama için orijinalinizi saklayın.

JS küçültücü nasıl kullanılır?

1. JavaScript kodunuzu yapıştırın.
2. Küçültmek için gönderin.
3. Karakter sayılarını karşılaştırın.
4. Küçültülmüş script’i kopyalayın ve sayfanızı test edin.

Örnekler

Küçük bir fonksiyon

Girdi:

// Greet the user
function greet(name) {
  const message = 'Hello, ' + name + '!';
  console.log(message);
  return message;
}

greet('Zach');

Çıktı:

function greet(name){const message="Hello, "+name+"!";console.log(message);return message}greet("Zach")

Yorumlar, satır sonları ve boşluklar silinir, tek tırnaklar çift tırnağa dönüşür ve her bloktaki son noktalı virgül atılır. Değişken adları olduğu gibi kalır: bu araç boşlukları küçültür ama yeniden adlandırma yapmaz.

Sık kullanım alanları

• WordPress, Shopify veya diğer CMS altbilgileri için özel script’leri küçültmek.
• Dağıttığınız küçük kütüphaneleri ve widget’ları küçültmek.
• Bookmarklet’ler ve satır içi script’ler hazırlamak.
• Derleme aracı olmayan basit siteler için hızlı canlı ortam sürümleri.

İpuçları ve bilinmesi gerekenler

• Her ifadenin düzgün bittiğinden emin olun (gerektiği yerde noktalı virgülle). Satır sonlarına dayanan kod, bunlar silindiğinde bozulabilir.
• Küçültme bir güvenlik önlemi değildir. Küçültülmüş kodu herkes yeniden biçimlendirip okuyabilir.
• Script’ler işlemeyi engellemesin diye script etiketlerinde defer veya async kullanın.
• JSON verisini ayrıca JSON doğrulayıcı ile kontrol edin, stilleri CSS küçültücü ile küçültün.

Özel durumlar ve sınırlamalar

• Otomatik noktalı virgül eklemeye dayanan kod, örneğin ( veya [ ile başlayan bir satır, satırlar birleştirilince bozulabilir. Küçültmeden önce noktalı virgül ekleyin.
• /*! license */ yorumları dahil yorumlar silinir; gerekli notları geri ekleyin.
• Girdideki sözdizimi hataları yanlış çıktıya veya hataya yol açar. Kodu küçültmeden önce test edin.
• Daha büyük kazanç için değişken adlarını da kısaltan bir minifier’a (Terser veya esbuild gibi) sahip bir bundler kullanın.

Sıkça sorulan sorular

JS küçültme nedir?

JavaScript’ten motorun ihtiyaç duymadığı boşluk ve yorum gibi karakterleri silerek dosyayı küçültmektir.

Küçültme JavaScript’imi bozabilir mi?

Kod satır sonlarında otomatik noktalı virgül eklemeye dayanıyorsa bozabilir. Yayına almadan önce küçültülmüş sürümü test edin.

Küçültme ile karartma (obfuscation) arasındaki fark nedir?

Küçültme kodu küçültür. Karartma ise kodu bilerek anlaşılmaz hale getirir. İkisi de kodunuzu gerçek anlamda korumaz.

Bundler kullanıyorsam buna ihtiyacım var mı?

Vite, webpack veya esbuild gibi araçlar canlı ortam derlemelerinde genellikle sizin için küçültür. Bu araç hızlı, tek seferlik işler içindir.

Küçültülmüş kod daha hızlı çalışır mı?

Daha küçük olduğu için biraz daha hızlı iner ve ayrıştırılır. Kodun kendisi aynı şekilde çalışır.

İlgili araçlar

• CSS küçültücü: Tüm gereksiz karakterleri silerek CSS’inizi küçültün.
• HTML küçültücü: Tüm gereksiz karakterleri silerek HTML’inizi küçültün.
• JSON doğrulayıcı ve biçimlendirici: JSON içeriğini doğrulayın ve düzgün görünmesini sağlayın.
• Metin boyutu hesaplama: Bir metnin boyutunu bayt (B), kilobayt (KB) veya megabayt (MB) olarak alın.
• SQL biçimlendirici: SQL kodunuzu kolayca biçimlendirin ve düzenleyin.