Kuidas tihendatud HTML töötab ja miks seda vajate

Kuidas tihendatud HTML töötab ja miks seda vajate

Kui haldate veebisaiti, peaksite juba teadma, kuidas seda teha kasutage õigeid pildivorminguid ja optimeerige oma pilte veebis. Kuigi piltide tihendamine on tuntud tava, kipub HTML-tihendamine kahe silma vahele jääma, millest on kahju, sest kasu on seda väärt.





Selles artiklis käsitleme kahte peamist meetodit HTML -failide kahandamiseks, miks peaks HTML -faile vähendama ja kuidas seda teha.



Kompressioon vs minimeerimine

HTML -failide optimeerimise osas on selle jaoks kaks peamist meetodit: kokkusurumine ja minimeerimine . Pealtnäha kõlavad nad sarnaselt, kuid on tegelikult kaks erinevat tehnikat, nii et ärge ajage neid segamini.





Minimeerimine

Minimeerimiseks võite mõelda kui lähtekoodi mittevajalike märkide ja ridade eemaldamisest. Mõelge taandele, kommentaaridele, tühjadele ridadele jne. Ükski neist pole HTML -is nõutav - need on olemas faili hõlpsamaks lugemiseks. Nende üksikasjade kärpimine võib faili suurust raseerida, ilma et see midagi muudaks.

HTML -lehe näidis:





Your Title Here



Send me mail at support@yourcompany.com .

This is a new paragraph!

This is a new paragraph in bold and italics.

Algne suurus: 354. Minimeeritud suurus: 272. Sääst: 82 (23,16%).

Paljud veebiarendajad ja saitide omanikud reserveerivad minimeerimise ainult JS- ja CSS -failide jaoks, kuid see aegunud praktika on viga. HTML -i minimeerimine on samuti oluline.



Veel 2000. aastatel olid minimeerimisvahendid haruldased. Iga kord, kui midagi muutus, pidite failid käsitsi minimeerima. Kuna HTML -failid muutuvad sagedamini kui JS- ja CSS -failid, oli toona lihtsalt igav minimeerimine lihtsalt liiga tüütu. Tänapäeval on see vaieldav küsimus.

Tihendamine

Kui kasutajad teie veebisaiti külastavad, kasutavad nad seda HTTP -protokolli abil. Brauser saadab teie veebiserverile konkreetse lehe taotluse, teie veebiserver leiab lehe ja saadab selle lehe sisu külastaja brauserisse tagasi.



Kuid kuna HTTP -protokoll toetab tihendamist, saab teie veebiserver lehe enne külastajale saatmist tihendada (eeldades, et tihendamine on teie serveri seadetes lubatud) ja seejärel saab külastaja brauser lehe esialgsesse olekusse lahti pakkida.

Kõige tavalisem kokkusurumisskeem on GZIP , mis on failivorming, mis kasutab a kadudeta pakkimise algoritm nimega DEFLATE.

Algoritm otsib HTML -failist teksti korduvaid esinemisi, seejärel asendab need kordused viitega eelmisele esinemisele. Iga viide on lihtsalt kaks numbrit: kui kaugel on viide ja kui palju märke me viitame.

Kaaluge sellist tekstirida (näide GZIP -i veebisaidilt):

Blah blah blah blah blah.

Algoritm tuvastab järgmise korduse:

B{lah b}{lah b}{lah b}{lah b}lah.

Esimene juhtum on meie viide, nii et jätke see:

Blah b{lah b}{lah b}{lah b}lah.

Teine esinemine viitab esimesele esinemisele, mis on viis tähemärki taga ja viis tähemärki pikk:

Blah b[5,5]{lah b}{lah b}lah.

Kuid sel juhul tuvastab algoritm, et järgmine esinemine on sama tähemärkide jada, seega pikendab see võrdluspikkust veel viie võrra:

Blah b[5,10]{lah b}lah.

Ja jälle:

Blah b[5,15]lah.

Ja algoritm on piisavalt nutikas, et mõista, et järgmised kolm märki on viite esimesed kolm tähemärki, seega pikeneb see kolme võrra:

Blah b[5,18].

Mõelge nüüd tüüpilisele HTML -failile ja sellele, kui palju kordusi selles on. Peaaegu iga silt, näiteks

, on vastav sulgemissilt, nagu

. Lisaks korratakse paljusid silte kogu aeg, näiteks

,

,

,

  • jne. Atribuute korratakse sageli, sealhulgas

    class

    ,

    href

    ja

    src

    . On lihtne mõista, miks GZIP -tihendus HTML -i puhul nii tõhus on.

    Ainus negatiivne külg on see, et veebiserver vajab iga kord lehe taotlemisel tihendamiseks natuke rohkem protsessorit. Kuid kuna protsessor ei valmista tänapäeval suurt muret, on peaaegu alati parem GZIP-i lubada kui ilma selleta, isegi kui teil on algtaseme veebimajutus.

    Miks peaksite kokku suruma ja minimeerima

    Sellel on kaks peamist eelist, mis mõlemad on tänapäeva mobiilirohke veebimaastikul üliolulised.

    Kiirem lehe laadimine

    Keskmiselt saab HTML -minifikaator põhiseadistustega vähendada faili suurust umbes 3 protsenti. Valikuliste täpsemate seadete abil saab HTML -faili vähendada veel 3–7 protsenti, vähendades potentsiaalselt kuni 10 protsenti. See tähendab otseselt lehe kiiremat laadimisaega.

    Kasutatakse vähem ribalaiust

    Oletame, et teil on 10 faili, millest igaüks on minimeeritud 50 KB -lt 45 KB -ni, vähendades kokku 50 KB. Ja oletame, et teie veebisait teenib iga päev keskmiselt 1000 külastajat, kus iga külastus teeb keskmiselt kümme lehte. Ainuüksi HTML -i minimeerimine vähendab teie ribalaiuse kasutamist 50 MB võrra päevas (1,5 GB kuus).

    Tihendamine + minimeerimine

    Nagu näete, on HTML -i minimeerimine iseenesest kasulik, eriti kui teie sait suureneb, failid suurenevad ja liiklus suureneb. Pange tähele, et Google'i PageSpeedi juhised soovitage HTML -i minimeerida, nii et kui olete skeptiline, laske sellel veenda teid vastupidises.

    kuidas luua bitmoji konto

    Kuid HTML -i optimeerimise juures on suurepärane see, et te ei pea valima minimeerimist ega tihendamist. Saate teha mõlemat! Tegelikult sina peaks teha mõlemat.

    Keskmiselt võite eeldada, et GZIP -tihendus vähendab HTML -faili 70-90 protsenti. Kasutades ülaltoodud näidet konservatiivse tihendushinnanguga, läheksid minimeeritud HTML -failid igaüks 45 KB -lt 13,5 KB -ni, kokku kahandades 365 KB. Võrreldes tihendamata/tihendamata, vähendatakse teie saidi ribalaiust nüüd 365 MB võrra päevas (11 GB kuus).

    Lisaks ribalaiuse kokkuhoiule laaditakse iga leht dramaatiliselt kiiremini, kuna lõppkasutaja brauser peab alla laadima ainult 13,5 KB versus 50 KB lehekülje kohta.

    Kuidas tihendada ja minimeerida HTML -i

    Õnneks pole tänapäeval kumbki väga raske ja nende seadistamiseks pole vaja palju tehnilist oskusteavet.

    WordPressi pistikprogrammid

    Kui käitate WordPressi saiti, pole vaja teha muud, kui installida üks pistikprogramm ja saate kasu nii tihendamisest kui ka minimeerimisest.

    Enamik vahemällu salvestamise pistikprogramme ei tee lihtsalt lehti. Näiteks, WP kiireim vahemälu ja W3 Vahemälu kokku mõlemal on ühe klõpsuga seaded, mis võimaldavad teil sisse lülitada HTML-i minimeerimise ja GZIP-tihendamise, lisaks muudele funktsioonidele, mis veelgi kiirendavad lehe laadimist ja vähendavad ribalaiuse kasutamist.

    Kui sa ainult tahate minimeerida, soovitame Minimeeri HTML sisse panema. See on lihtne, toetab HTML/CSS/JS -i ja võimaldab teil minimeerimismeetodit veidi muuta (nt kas eemaldada

    http:

    ja

    https:

    URL -idelt).

    Staatilised HTML -minifikaatorid

    Kui teie HTML -failid on staatilised (st neid ei genereeri dünaamiliselt CMS või veebiraamistik), saate säilitada kahte HTML -failide komplekti: „allikakomplekti”, mis on lihtsaks redigeerimiseks minimeerimata, ja „minimeeritud” komplekti, mille loote iga kord, kui muudate lähtefaili.

    Vähendamiseks kasutage ühte järgmistest tööriistadest:

    See on elujõuline tehnika, kui olete eemaldunud CMSidest nagu WordPress ja kasutate nüüd staatilisi saidigeneraatoreid.

    Luba GZIP -tihendus

    GZIP -tihendamise lubamise sammud võivad erineda sõltuvalt kasutatavast veebiserveri tarkvarast. Kuna Apache on kõige populaarsem valik, käsitleme selle lubamist .htaccess abil.

    Ühendage oma veebiserveriga FTP abil, seejärel looge fail nimega

    .htaccess

    juurkataloogis. Muutke .htaccess -faili järgmiste seadete saamiseks:


    mod_gzip_on Yes
    mod_gzip_dechunk Yes
    mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
    mod_gzip_item_include handler ^cgi-script$
    mod_gzip_item_include mime ^text/.*
    mod_gzip_item_include mime ^application/x-javascript.*
    mod_gzip_item_exclude mime ^image/.*
    mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*


    SetOutputFilter DEFLATE

    Kas pole kindel, kas tihendamine teie veebisaidil töötab? Testige seda tööriista .

    Maksimaalse efektiivsuse saavutamiseks peaksite ka seda tegema saate teada, kuidas oma CSS -i kontrollida, puhastada ja optimeerida .

    Jaga Jaga Piiksuma E -post Kas peaksite kohe Windows 11 -le üle minema?

    Windows 11 on peagi saadaval, kuid kas peaksite värskendama nii kiiresti kui võimalik või ootama paar nädalat? Uurime välja.

    Loe edasi     Seotud teemad
    • Programmeerimine
    • HTML
    • Veebiarendus
    Autori kohta Joel Lee(Avaldatud 1524 artiklit)

    Joel Lee on MakeUseOfi peatoimetaja aastast 2018. Tal on B.S. arvutiteaduse erialal ning üle üheksa -aastase erialase kirjutamis- ja toimetamiskogemuse.

    Veel Joel Lee'lt

    Telli meie uudiskiri

    Liituge meie uudiskirjaga, et saada tehnilisi näpunäiteid, ülevaateid, tasuta e -raamatuid ja eksklusiivseid pakkumisi!

    Tellimiseks klõpsake siin