TanodTools
TR

CSS küçült ve düzenle

Bir stil sayfasını yayın için küçültmek veya okunaklı biçimde yerleştirmek üzere yapıştırın ve kaç bayt kazandığınızı görün.

Tamamen tarayıcınızda çalışır

Mod
Yorumlar

Yaklaşık 10 MB'a kadar girdi. Yalnızca boşlukları ve yorumları kaldırır; kuralları birleştirmez, değerleri yeniden yazmaz ve kullanılmayan CSS'i silmez.

CSS nasıl küçültülür veya düzenlenir?

  1. CSS'inizi kutuya yapıştırın ya da Örnek ekle düğmesine basın.
  2. Sıkıştırmak için Küçült'ü, girintinizle yerleştirmek için Düzenle'yi seçin. Küçültürken lisans yorumu seçeneğini işaretleyin veya işaretini kaldırın.
  3. Kazanılan boyuta bakın, ardından sonucu kopyalayın ya da .css dosyası olarak indirin.

CSS'i bozmadan küçültmek

Bir stil sayfasını küçültmek, tarayıcının yok saydığı her şeyi kaldırmak demektir: yorumlar, girintiler, satır sonları ve noktalama işaretlerinin çevresindeki boşluklar. Daha küçük dosyalar daha hızlı iner ve ayrıştırılır; büyük bir stil sayfasında kazanç çoğu zaman sıkıştırmadan önce boyutunun dörtte biri ile yarısı kadardır. Kurallar ve sıraları aynen yazıldığı gibi kalır.

İşin zor kısmı, tarayıcının hangi boşlukları yok saydığını bilmektir. nav a örneğindeki gibi iki seçici arasındaki boşluk "herhangi bir alt öğe" anlamına gelen bir birleştiricidir; bu yüzden nav a ile nava farklı şeylerdir. calc(1rem + 2px) içinde + çevresindeki boşluklar zorunludur ve calc(1rem+2px) geçersizdir. Tırnak içindeki ve url() içindeki metin söz dizimi değil veridir. Düzenli ifadelerle yapılmış bir küçültücü çoğu zaman bunlardan birini yanlış yapar; bu araç stil sayfasını bir belirteç dizisi olarak okur ve boşluğu yalnızca dilbilgisinin isteğe bağlı kıldığı yerde kaldırır.

Düzenleme ters yöndür: satır başına bir bildirim, süslü parantezlerin içinde girintili; böylece bir CDN'den gelen küçültülmüş dosya okuyabileceğiniz ve karşılaştırabileceğiniz bir şeye dönüşür.

İpuçları

Sık sorulan sorular

CSS'im yükleniyor mu?

Hayır. Küçültme tarayıcınızda çalışır ve düzenleme kitaplığı bu siteden yalnızca Düzenle'yi seçerseniz yüklenir. Stil sayfanız hiçbir yere gönderilmez.

Küçült tam olarak neyi değiştirir?

Yorumları; süslü parantezlerin, noktalı virgüllerin, virgüllerin ve birleştiricilerin (>, ~, +) çevresindeki boşlukları kaldırır ve her bloktaki son noktalı virgülü atar. Kaldırılması değeri bozacağı için a b (alt öğe birleştiricisi), and (min-width: ...) içindeki boşluğu ve calc(), clamp(), min() ve max() içindeki + ile - çevresindeki boşluğu korur.

Dizelere ve url()'ye dokunuyor mu?

Hayır. Yorum veya süslü parantez gibi görünen metin dahil tırnak içindeki her şey ve url() içeriği karakter karakter kopyalanır.

Renkleri veya sayıları kısaltıyor mu?

Hayır. #336699, 0.5em ve 0px gibi değerler yazıldığı gibi bırakılır. Bu yeniden yazımlar az kazandırır ve bir miktar risk taşır; bu yüzden yalnızca boşluklar ve yorumlar gider.

Küçültülmüş CSS'in güvenli olduğunu nasıl bilirim?

Her çalıştırmadan sonra sayfa, özgününüzü ve sonucu tarayıcının kendi CSS ayrıştırıcısıyla ayrıştırır ve okuduklarını karşılaştırır. Farklıysa sonucun üstünde bir uyarı görünür. Eşleşme, tarayıcının aynı kuralları gördüğü anlamına gelir.

Lisans yorumları nedir?

/*! ile başlayan yorumlar, bir lisansın korumanızı gerektirebileceği telif hakkı veya lisans metnini taşıdığından geleneksel olarak küçültücüler tarafından korunur. Onları da silmek için seçeneği kapatın.