İstediğiniz zaman biçimlendirme ve küçültme arasında geçiş yapın; sonuç siz yazdıkça güncellenir. Dağınık HTML, CSS ve JavaScript'i düzenleyin veya daha hızlı bir web sitesi için küçültün. Tarayıcınızda çalışır, ücretsiz ve gizlidir.
Kod nasıl biçimlendirilir veya küçültülür
- Biçimlendir veya Küçült'ü seçin.
- Dili seçin: HTML, CSS veya JavaScript.
- Biçimlendirme için girintiyi seçin: 2 boşluk, 4 boşluk veya Sekme.
- Kodunuzu girdi kutusuna yapıştırın veya nasıl çalıştığını görmek için Örnek'e basın.
- Sonucu Biçimlendirilmiş altında okuyun, sonra Kopyala'ya basın.
- Temizle, girdiyi boşaltır.
Biçimlendirme ne yapar
Biçimlendirme yalnızca boşluğu değiştirir. CSS, satır başına bir bildirim, boş satırla ayrılmış kurallar ve girintili medya sorguları ve iç içe kurallar alır. JavaScript, süslü parantezlerine göre yeniden girintilenir ve satır başına bir ifade olur; dizeler, şablon değişmezleri, düzenli ifadeler ve for (;;) başlıkları tam olarak yazıldığı gibi bırakılır. HTML, iç içe geçmeye göre girintilenir; satır içi öğeler sayfanın aynı işlenmesi için metinleriyle aynı satırda tutulur ve satır içi <script> ve <style> blokları JavaScript ve CSS biçimlendiricileriyle biçimlendirilir.
Küçültme ne yapar
Küçültme, yorumları ve tarayıcının ihtiyaç duymadığı her boşluğu kaldırır. /*! ile başlayan yorumlar korunur, çünkü genellikle bir lisans içerirler. JavaScript, otomatik noktalı virgül eklemenin bir satır sonuna bağlı olduğu her yerde satır sonunu tutar, bu yüzden noktalı virgülsüz yazılmış kod yine çalışır. Adlar kısaltılmaz ve hiçbir kod yeniden yazılmaz, bu yüzden sonuç özgünle tam aynı davranır. HTML'de pre ve textarea içerikleri asla değiştirilmez ve satır içi öğeler arasındaki boşluk, kelimeler birbirine yapışmasın diye tek boşluk olarak korunur.
Bilinmesi gereken sınırlar
Biçimlendirici kodu ara ve değiştir yerine gerçek bir tokenleştiriciyle okur, ancak onu tam olarak ayrıştırmaz, bu yüzden her sözdizimi hatasını yakalamaz. Kapatılmamış bir dize, yorum veya parantez gibi bir sorun bulduğunda size satırı söyler. TypeScript, JSX ve şablon dilleri desteklenmez. HTML küçültme, liste öğeleri gibi blok öğeler arasındaki boşlukları kaldırır; bir düzen satır içi blok öğeler arasındaki o boşluğa dayanıyorsa küçültmeden sonra kontrol edin.
İpuçları
- Özgün dosyanızı saklayın. Küçültülmüş kodu okumak ve düzenlemek zordur, bu yüzden yayın için bir kopyayı küçültün.
- Küçültmeden sonra sayfanızı test edin, özellikle düzen öğeler arasındaki boşluklara bağlıysa.
- Kopyalanmış bir parça veya sıkıştırılmış bir dosya gibi sizin yazmadığınız kodu okumak için biçimlendirmeyi kullanın.
- Değişiklikler küçük kalsın diye ekibinizin kullandığı girintiyi seçin.
- Önce ve sonrayı fark denetleyiciyle karşılaştırın.
Kimler kullanır
Kod okumayı öğrenen öğrenciler, müşterinin sitesini temizleyen serbest çalışanlar ve hız için sayfa ağırlığını azaltan küçük işletmeler. JSON dosyaları için JSON araçlarını kullanın.
Tasarımdan gizli
Kodunuz bu sayfada tarayıcınızda biçimlendirilir. Hiçbir şey yüklenmez, bu yüzden özel veya yayımlanmamış işler için güvenlidir.
Sorular
Küçültme kodumu bozar mı?
Yalnızca yorumları ve gereksiz boşlukları kaldırır, kodunuzu yeniden yazmaz; bu yüzden davranış aynı kalır. Sonucu her zaman test edin.
TypeScript veya JSX'i destekliyor mu?
Hayır. HTML, CSS ve JavaScript desteklenir.
Bir yorum neden korundu?
/*! ile başlayan yorumlar korunur, çünkü genellikle bir lisans içerirler.