HTML Küçültücü - DigiKitApp

HTML kodundaki gereksiz boşlukları temizleyin.

Ne zaman kullanmalısın?

Bir HTML sayfasının boyutunu küçültüp sunucudan aktarım süresini kısaltmak için, canlıya almadan önce kullan.

Ne zaman kullanmamalısın?

HTML'i minify ettikten sonra elle düzenlemen gerekiyorsa çok zorlaşır; düzenlemeyi her zaman orijinal dosya üzerinde yapıp minify işlemini en son uygulaman gerekir.

Adım adım kullanım

  1. Küçültmek istediğiniz sayfanın kaynak kodunu editörünüzden kopyalayın. Tam bir belge de olabilir, tek bir bileşen parçası da.
  2. Kodu "HTML kodu" alanına yapıştırın.
  3. "Çalıştır" butonuna tıklayın. Boşlukları temizlenmiş çıktı, "Sonuç burada görünecek" yazan bölümde belirir.
  4. Çıktıyı kopyalayıp yayına alacağınız dosyaya kaydedin. Orijinal, okunaklı dosyayı ayrı bir yerde saklamaya devam edin.

Örnek

Elle yazdığınız bir açılış sayfasını düşünün: her etiket kendi satırında, iç içe bloklar dört boşlukla girintilenmiş. Bu girintiler editörde okumayı kolaylaştırır ama tarayıcı için hiçbir anlam taşımaz. Kodu araca verdiğinizde satır başlarındaki boşluklar ve etiketler arasındaki gereksiz boşluk karakterleri ayıklanır, sayfa daha sıkışık bir hale gelir. Kazanç, girintinin yoğun olduğu uzun şablonlarda belirgindir. Birkaç satırlık bir parçada fark küçük kalır.

Pratik bir alışkanlık olarak, küçültülmüş dosyayı yükledikten sonra sayfayı mobil ve masaüstünde bir kez açıp menüler, formlar ve butonlar gibi etkileşimli bölümlerin eskisi gibi çalıştığını kontrol edin. Bir sorun görürseniz orijinal dosyaya dönüp hangi bölümün etkilendiğini parça parça deneyerek bulmak, küçültülmüş tek satırlık kod üzerinde arama yapmaktan çok daha kolaydır.

HTML küçültme ne işe yarar?

Küçültme, dosya boyutunu azaltmak için gereksiz boşlukları sıkıştırır. Araç HTML yorumlarını (<!-- -->) siler (koşullu yorumlar hariç), art arda gelen boşluk ve satır sonlarını tek boşluğa indirir ve etiketler arasındaki boşluğu tek boşluğa düşürür. pre, textarea, script ve style bloklarına dokunmaz. Metindeki virgül, iki nokta gibi karakterlerin çevresindeki boşluklar silinmez.

Küçültürken

  • Etiketler arasında tek boşluk bırakılır, çünkü satır içi öğeler arasındaki boşluk görünen metnin parçasıdır. Bu yüzden kazanç, boşlukların tamamen silindiği küçültücülerden daha azdır.
  • script ve style blokları olduğu gibi kalır; onları JavaScript ve CSS küçültücüleriyle ayrıca küçültebilirsiniz.
  • Küçültmeden önce orijinal dosyayı yedekleyin; küçültülmüş kodu düzenlemek zordur.
  • Üretim için yapı sürecinde çalışan bir HTML küçültücü, öznitelik tırnaklarını ve isteğe bağlı etiketleri de kısaltır; bu araç yalnızca boşluk ve yorumları temizler.

Dikkat edilmesi gerekenler

  • Satır içi öğeler arasındaki tek boşluk bazen görünür metnin parçasıdır. Örneğin iki bağlantı arasındaki boşluk silinirse kelimeler yapışabilir. Çıktıyı tarayıcıda açıp bu tür yerleri gözle kontrol edin.
  • pre ve textarea içeriğinde boşluklar anlamlıdır. Bu etiketleri içeren sayfalarda küçültme sonrası biçimin bozulmadığından emin olun.
  • Sayfa içine gömülü script veya style blokları varsa, bunlar için ayrı JavaScript ve CSS küçültücüler daha uygun sonuç verebilir.
  • Sunucunuz gzip veya benzeri bir sıkıştırma kullanıyorsa, küçültmenin aktarımdaki ek etkisi beklediğinizden az olabilir. Yine de dosya boyutu ve okunan bayt sayısı azalır.

Sık sorulan sorular

Girdiğim kod/veri kaydediliyor mu?

Hayır, hiçbir veri sunucuya gönderilmez veya saklanmaz; işlem tamamen tarayıcınızda gerçekleşir.

Büyük dosyalarda çalışır mı?

Evet, ancak çok büyük girdilerde (birkaç MB üzeri) tarayıcı performansı düşebilir.

Bu araç ücretsiz mi?

Evet, temel kullanım için tamamen ücretsizdir ve üyelik gerektirmez.