HTML šiukšlių valiklis: kodėl Microsoft Word primygtinai bando įgrūsti nedidelę biurokratinę imperiją į jūsų kodą

HTML šiukšlių valiklis yra sukurtas problemai, kuri yra tokia dažna, jog praktiškai tapo skaitmeniniu krikštu: kažkas nukopijuoja turinį iš Microsoft Word, įklijuoja jį į svetainę, o gautas HTML kodas atvyksta su tiek daug ceremoninio bagažo, kad galėtų pretenduoti į keliaujančią ministeriją. Vietoj švarios pastraipos, antraštės ir galbūt lentelės gaunate vardų sritis (namespaces), Office XML salas, sąlyginius komentarus, mso-* stiliaus šiukšles, fantomines span žymes, antikines suderinamumo vėliavėles ir tiek tipografinės biurokratijos, kad sveiko proto programuotojas imtų murmėti lotyniškai.

Būtent tam ir skirtas šis valiklis. Jis pašalina Word generuojamą perteklių, tiek seną, tiek naują, išlaikydamas tikrąjį turinį, naudingą struktūrą ir skaitomą HTML. Siekis paprastas: išsaugoti tekstą, išlaikyti prasmingas lenteles bei antraštes, kur įmanoma, ir pašalinti įkyrų žymėjimo rūką, kurį Word eksportuoja suderinamumo, grįžtamojo ryšio tikslumo ir kitų institucinio perteklinio pasitikėjimo formų vardu.

Kaip Word tapo žymėjimo pertekliaus didmeistriu

Microsoft Word savo kelią pradėjo kaip Multi-Tool Word, pirmą kartą išleistas Xenix ir MS-DOS operacinėms sistemoms 1983 m.. Jį Microsoft sukūrė Charles Simonyi ir Richard Brodie, ir tuo etapu jo misija buvo paprasta: būti rimtu tekstų redaktoriumi. Mac OS skirta versija pasirodė 1985 m., Word for Windows – 1989 m., ir nuo tada produktas išaugo į galingą dokumentų mašiną, apsėstą maketo, stiliaus, dokumentų metaduomenų, redagavimo būsenos, kalbos detalių, suderinamumo taisyklių, numeravimo sistemų, įterptų objektų ir visų kitų biuro civilizacijos elementų išsaugojimo.

Versijų seka yra svarbi, nes eksportuojamas HTML dažnai turi tos linijos pėdsakų. Word 6.0 pasirodė 1993 m.. Tada sekė Word 95 kaip versija 7.0, Word 97 kaip 8.0, Word 2000 kaip 9.0, Word 2002 / XP kaip 10.0, Word 2003 kaip 11.0, Word 2007 kaip 12.0, Word 2010 kaip 14.0, Word 2013 kaip 15.0, o tada ilgaamžė 16.0 šeima, naudojama Word 2016, 2019, 2021 ir Microsoft 365 paketuose. Ne, Word 13.0 versijos Office prekės ženkle nebuvo, nes programinės įrangos pardavėjai kartais rimtu veidu užsiima numerologiniu teatru.

Kai Word eksportuoja HTML, jis nesielgia kaip minimalistinis interneto redaktorius. Jis elgiasi kaip dokumentų suverenas, bandantis išsaugoti kiekvieną silpną savo vidinės respublikos šnabždesį. Štai kodėl išvestis tampa perpildyta. Word ne šiaip saugo turinį. Jis gabena politiką.

Ne tik Word: kaip modernūs interneto karkasai ir portalai užteršia jūsų HTML

Šiuolaikinis žiniatinklis sukūrė naują kodo šiukšlių rūšį, kuri savo apimtimi ir agresyvumu nenusileidžia net Microsoft Word eksportui. Kai kopijuojate kodą ar straipsnius iš didžiųjų naujienų portalų (Delfi, BBC, Yahoo) arba modernių karkasų (tokių kaip Next.js, Nuxt.js, React, Vue, Svelte), kartu parsitempiate ištisą skaitmeninį atliekų sąvartyną:

  • SSR hidracijos metaduomenys ir atributai: Objektai, tokie kaip data-n-head, data-hid, data-v-*, data-hydrated, data-nscript, data-testid, kurie reikalingi tik karkaso vidinei būsenai atkurti, bet jūsų svetainėje tampa visiškai nenaudingu balastu.
  • Analitikos ir sekimo tinklai: Paslėptos meta žymės (pvz., og-profile-acct, cXenseParse, oath:guce, gemius, dimatter, origin-trial) ir sekimo pikselių nuorodos, kurios ten buvo įterptos vartotojų elgsenai stebėti.
  • Išteklių išankstinio krovimo (Prefetch / Preload) nuorodos: Eilutės <link rel="preload"> ar dns-prefetch, kurios bando jungtis prie trečiųjų šalių reklamų serverių (Taboola, DoubleClick, Ozone ir kt.).
  • FontAwesome ir CSS kintamųjų balastas: Monstriški stilių blokai su šimtais kintamųjų (--fa-font-*), @keyframes animacijomis ir užkoduotomis klasėmis (pvz., .gb_*, .uds-color-mode-*), kurios tik padidina puslapio svorį ir gadina jūsų svetainės dizainą.

Mūsų HTML šiukšlių valiklis naudoja išmanųjį daugiasluoksnį filtravimo algoritmą. Jis ne tik atpažįsta klasikinį Office mso-* balastą, bet ir automatiškai išvalo modernias karkasų hidracijos liekanas, užšifruotas klases, pasenusias žymes (konvertuoja <b> ➔ <strong>, <i> ➔ <em>, <strike> ➔ <del>) ir išsaugo tik tai, kas iš tiesų privalo būti jūsų HTML kode.

Ką iš tikrųjų reiškia tos vardų srities eilutės

<html xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office"
xmlns:w="urn:schemas-microsoft-com:office:word"
xmlns:m="http://schemas.microsoft.com/office/2004/12/omml"
xmlns="http://www.w3.org/TR/REC-html40">

Vien ši pradžia jau yra nedidelė opera. Numatytoji vardų sritis (default namespace) rodo į HTML 4.0, o tai atskleidžia, kad eksporto logika vis dar stovi viena koja senesnėje interneto kosmologijoje. Tuomet Word prideda privačias Microsoft vardų sritis komponentams, kurių paprastas internetas nei prašė, nei itin jais džiaugiasi.

xmlns:v deklaruoja VML (Vector Markup Language) – seną Microsoft vektorinį formatą, kadaise naudotą figūroms, piešimo objektams ir įvairioms dekoratyvinėms komplikacijoms. xmlns:o yra Office vardų sritis, skirta specifiniams Office metaduomenims ir nustatymams. xmlns:w yra Word vardų sritis, skirta vidiniam Word dokumento aprašymui. xmlns:m yra susieta su Office Math Markup Language, skirta matematinių lygčių valdymui. Paprastai tariant: Word jus įspėja, kad šis failas nėra paprastas HTML. Tai yra HTML su Office egzoskeletu.

Stilių blokas: kur CSS eina prarasti savo orumo

<style>
 @font-face { font-family:"Cambria Math"; ... }
 p.MsoNormal, li.MsoNormal { mso-style-qformat:yes; ... }
 h1 { mso-outline-level:1; ... }
</style>

Šis stilių blokas yra vienas garsiausių Word HTML nusikaltimų. Jame yra šriftų deklaracijos, Word klasių taisyklės, antraščių apibrėžimai, temų spalvos, tipografiniai nustatymai, pastraipų elgsena, tik eksportui skirtos savybės ir didžiuliai kiekiai patentuotų CSS stilių su priešdėliu mso-. Dauguma šių deklaracijų yra skirtos Word, Office aplinkai arba istoriniam Microsoft atvaizdavimo elgesiui. Įprastos naršyklės didžiąją dalį to ignoruoja, tačiau tai nereiškia, kad tai nekenksminga.

Garsiosios o:p žymės ir tuščios pastraipos

<p class=MsoNormal>
  <span>Testinis tekstas.<o:p></o:p></span>
</p>

Žymė o:p yra viena žinomiausių fosilijų Word HTML kode. Ji priklauso Office vardų sričiai ir dažnai pasirodo kaip tuščias vietos rezervavimo ženklas pastraipose ar span elementuose. Ji neprideda jokios prasmingos semantikos viešajam žiniatinkliui. Valiklis pašalina o:p elementus ir išvalo tuščias eilučių pėdas.

Lentelių žymėjimas: išsaugokite lentelę, atleiskite palydą

<table class=MsoTableGrid border=1 cellspacing=0 cellpadding=0
 style='border-collapse:collapse;mso-padding-alt:0cm 5.4pt'>

Geroji žinia: ten yra tikra lentelė. Blogoji žinia: Word apgaubė ją pakankamai dekoratyvinių pastolių, kad būtų galima įrengti provincijos teismą. Rimtas valiklis išsaugo tikrąją lentelės struktūrą, eilutes ir ląsteles, pašalindamas tik Word skirtas klases, Office savybes ir perteklinį inline turinį.

Kodėl HTML šiukšlių valiklis turi suprasti tiek senąjį Word, tiek naująsias sistemų kartas

HTML šiukšlių valiklis negali būti naivus. Jis privalo atpažinti priešistorines šiukšles iš Word 97–Word 2003, intermediate įpročius iš Word 2007/2010 ir modernius eksportus iš Microsoft 365, taip pat portalų karkasus (Next.js, Nuxt.js). Rūšys skiriasi, bet kodo užteršimo logika sutampa.

Ką valiklis pašalina, o ką gerbia

Valiklis pašalina Microsoft vardų sritis, Office XML blokus, sąlyginius komentarus, VML aidus, temų nuorodas, mso-* CSS, Word klases (tokias kaip MsoNormal), SSR hidracijos žymes, sekimo nuorodas, tuščius span ir o:p elementus. Tuo pačiu metu jis gerbia tikrąją pradinę struktūrą: pastraipas, antraštes, sąrašus, lenteles, nuorodas ir prasmingas žymes.

Kodėl egzistuoja HTML šiukšlių valiklis

HTML šiukšlių valiklis egzistuoja tam, kad paverstų nešvarų kodą atgal į tai, ką naršyklė ir TVS gali toleruoti be krizės. Tai nėra glamūrinis darbas. Tačiau tai yra tikras darbas. Kartais kilniausia paslauga programinėje įrangoje yra ne išradimas, o švarus egzorcizmas.