LFUnminify, Ludovic Frank tiešsaistes koda formatētājs

HTML formatēšana tiešsaistē

Pārvērtiet saspiestu avota kodu lasāmā marķējumā. Tagu atkāpes atbilst to dziļumam, atribūti ir pārskatāmi, un iekļautie skripti un stili tiek formatēti kopā ar dokumentu.

Šeit parādīsies sakārtots kods ar atkāpēm

Kāpēc lapas avots izskatās tik blīvs

HTML minificētāji saspiež atstarpes starp tagiem, dzēš komentārus, izlaiž neobligātus noslēguma tagus un noņem pēdiņas ap atribūtu vērtībām, kur tās nav vajadzīgas. Servera veidnes to papildina: no desmitiem fragmentu salikta lapa nonāk vienā plūsmā, kas neatgādina sākotnējos failus. Atveriet gandrīz jebkuras publicētas vietnes avotu, un redzēsiet dažas milzīgas rindas. Lai atrastu sadaļas noslēguma tagu, atliek ar acīm skaitīt leņķiekavas.

Galvenais ieguvums ir redzama struktūra

HTML ir koks, un plakani pierakstītu koku ir grūti lasīt. Atkāpes pēc ligzdojuma dziļuma uzreiz parāda dokumenta uzbūvi: kur beidzas galvene, kurš konteiners aptver galveno saturu, cik dziļi ievietots komponents un kuram elementam trūkst noslēguma taga. Tāpēc formatēts avots noder virsrakstu secības pārbaudei, ietvara ģenerētā marķējuma izpētei un sapratnei, kā citā vietnē uzbūvēta jūs interesējoša sadaļa.

Tiek sakārtoti arī iekļautie skripti un stili

Īsta lapa gandrīz nekad nesastāv tikai no marķējuma. Dokumentā tieši ievieto analītikas fragmentus, JSON-LD strukturētos datus, konfigurācijas objektus un kritisko CSS, un minificētājs saspiež arī tos. Formatētājs katru iekļauto bloku nodod atbilstošam parsētājam. script tags ar minificētu JavaScript pārtop lasāmā JavaScript, bet style tags pārtop lasāmā CSS. Viss saglabājas pareizi atkāpotā HTML dokumentā.

Ņemtas vērā nozīmīgās atstarpes

HTML atkāpes maina atstarpes starp tagiem, un atstarpēm var būt nozīme. Formatētājs to ievēro: pre un textarea tagu saturs tiek saglabāts, bet rindas elementi netiek sadalīti tā, ka ap tekstu rastos vai pazustu redzamas atstarpes. Tas palīdz iegūt lasāmu dokumentu, saglabājot paredzēto lapas izskatu. Pirms formatēto kopiju izmantot publicētā projektā, tomēr pārbaudiet tās attēlojumu konkrētajā lapā.

Biežāk uzdotie jautājumi

Vai var ielīmēt visas lapas avota kodu?

Jā. Nokopējiet avotu pārlūka view-source skatā vai saglabājiet lapu un atveriet failu. Tiks formatēts viss dokuments, tostarp head, body, iekļautie skripti un strukturētie dati.

Vai formatēšana mainīs lapas izskatu?

Parasti ne. Elementi, kuros atstarpēm ir nozīme, piemēram, pre un textarea, tiek saglabāti, un rindas saturs tiek apstrādāts uzmanīgi. Tomēr formatējiet kopiju lasīšanai un pirms atkārtotas publicēšanas pārbaudiet rezultātu.

Vai var formatēt Twig vai Blade veidnes?

Daļēji. Parasts marķējums tiek formatēts labi, bet veidnes tagi ar savu sintaksi var traucēt HTML parsētājam. Rīks paredzēts HTML, ko saņem pārlūks, nevis veidnei, kas to ģenerēja.

Formatēt citu koda veidu