İçeriğe geç

CSS/JS Sıkıştırma

CSS ve JavaScript kodunu küçültün (minify)

Kodunuz tarayıcınızda işlenir; sunucuya gönderilmez. CSS için csso, JavaScript için Terser kullanılır. Yayına almadan önce sonucu test edin.

CSS/JS sıkıştırma (minify) nedir?

Sıkıştırma, CSS ve JavaScript dosyalarındaki boşlukları, satır sonlarını, yorumları ve gereksiz karakterleri kaldırarak dosya boyutunu küçültme işlemidir. Kodun çalışması değişmez; yalnızca daha az veri indirilir. JavaScript'te isteğe bağlı olarak yerel değişken adları da kısaltılır.

Neden önemli?

  • Daha küçük dosyalar sayfanın daha hızlı yüklenmesini sağlar; bu, kullanıcı deneyimini ve Core Web Vitals değerlerini (özellikle LCP) iyileştirir.
  • Mobil bağlantılarda veri tüketimi azalır.
  • Google PageSpeed raporlarındaki "CSS/JavaScript küçült" önerisini giderir.

Nasıl kullanılır?

  1. Türü seçin: CSS veya JavaScript.
  2. Kodu kutuya yapıştırın ve Sıkıştır'a basın.
  3. Önce/sonra boyutunu ve kazancı görün; sonucu kopyalayın veya .min.css / .min.js olarak indirin.

İpuçları

  • Özgün (okunabilir) dosyanızı mutlaka saklayın; sıkıştırılmış dosyadan geri dönmek zordur.
  • JavaScript sıkıştırması modern söz dizimini (ES2022+) destekler. Hatalı kodda satır ve sütun bilgisiyle hata gösterilir.
  • Değişken adı kısaltma, global değişkenlere kod dışından erişen betikleri bozmaz (yalnızca yerel adlar kısalır). Yine de yayına almadan önce test edin.

Sıkça Sorulan Sorular

Araç ücretsiz mi, sınır var mı?

Ücretsizdir. Kodunuz tarayıcınızda işlenir, sunucuya gönderilmez; tek seferde en fazla 2 milyon karakter işlenir.

Sıkıştırma kodumun çalışmasını bozar mı?

Doğru yapıldığında davranış değişmez. Terser (JavaScript) ve csso (CSS) yaygın, güvenilir araçlardır; yine de canlıya almadan önce sayfanızı test etmenizi öneririz.

Ne kadar küçülür?

Yorum ve girintisi bol kodlarda genellikle %20–60 arası. Zaten sıkıştırılmış kodlarda kazanç düşük olur.

Sonucu nasıl indirebilirim?

Sıkıştırma sonrası İndir düğmesi sonucu .min.css veya .min.js dosyası olarak kaydeder.

HTML de sıkıştırabilir miyim?

Bu araç yalnızca CSS ve JavaScript içindir.