Hva er HTTP2? Den eneste guiden du trenger for å sette opp et raskere WordPress-nettsted

HTTP / 2 I mai 2015 ble det kunngjort at spesifikasjonen for HTTP2 var ferdig og utgitt. HTTP2 tilbyr betydelige ytelsesfordeler til ethvert nettsted, så siden de fleste nettsteder er drevet av WordPress, var det bare et spørsmål om tid før vi trengte å vite hvordan vi skulle konfigurere det og hva som er HTTP2.

Så her er vi med en komplett guide og / eller opplæring om hva HTTP2 er, hvorfor du bør aktivere HTTP2 på nettstedet ditt, hva er fordelene og til slutt - hvordan du faktisk gjør det.

 

Så la oss starte med de første tingene.

Hva er HTTP2?

HTTP2 er den siste versjonen av HTTP (HyperText Transfer Protocol) som er optimalisert på en slik måte at nettstedet ditt lastes mye raskere, uten ekstra innsats fra din side. Når du har satt opp HTTP2, er det ikke behov for slike optimaliseringer som minifisering, kombinasjon og andre hacks vi pleide å utføre før - disse er innebygd rett i selve protokollen.

(På CollectiveRay, vi liker å lage nettstedene våre vakker og raskt!) 

Før vi faktisk kommer ned til HTTP2, la oss se litt på HTTP og hvorfor en ny versjon av HTTP var nødvendig.

Hva er HTTP?

HyperText Transfer Protocol (aka HTTP) er ganske enkelt en måte som nettleseren din kommuniserer med webserveren til nettstedet du besøker.

Det er mange måter to (eller flere) maskiner kommuniserer over Internett. HTTP er den som brukes til å surfe på nettsteder. Med fremveksten av slike nettsteder som YouTube og Twitch som bærer mye trafikk over HTTP, er denne protokollen fortsatt en som har mest trafikk. Det er definitivt den som er mest "synlig" siden den er involvert i all nettsurfing.

Tross alt, hvor mange ganger skriver du https: // hver eneste dag?

http

Uten å gå for mye i detalj, brukes HTTP-protokollen av den besøkendes nettleser for å be om alt innholdet på et nettsted.

Samtalen går omtrent slik:

nett~~POS=TRUNC leseren~~POS=HEADCOMP: Hei server på www.collectiveray.com - kan du gi meg innholdet på dette nettstedet?

Server: Hei nettleser, dette er HTML -innholdet på www.collectiveray. Med

<html xmlns: og="https://ogp.me/ns#" xmlns: fb="https://www.facebook.com/2008/fbml" lang="no-no" dir="ltr" klasse='com_content visningsartikkel itemid-388 j35 mm-svever'>

...

nett~~POS=TRUNC leseren~~POS=HEADCOMP: Flott, nå ser jeg at jeg også trenger innholdet i disse js-filene: collectiveray. Js, jquery.min.js, jquery-ui.min.js ... og også innholdet i disse filene: styles.css, jquery.min.css, ... Send meg også følgende bilder: favicon.ico, logo.jpg, blog-header.jpg, advert1.jpg, ...

Server:

  1. Her er innholdet i filen collectiveray. Js
  2. Og her er innholdet i filen jquery.min.js
  3. Og her er jquery-ui.min.js
  4. ...
  1. og her er bildet bunntekst-ikon.jpg ...

Virkelig og virkelig spiller serveren og nettleseren digital tennis med dataene til nettstedet du besøker.

Hvert frem og tilbake fra serveren sender en liten del av nettstedet. Dette fortsetter til alt innholdet sendes fra nettserveren til nettleseren.

En annen veldig god analogi som har blitt brukt til å beskrive HTTP1, er at en kelner henter drikke fra baren og får bare en drink hver eneste gang de besøker baren.

http11

Selvfølgelig er denne metoden for å få en "ting" om gangen ikke veldig effektiv, og her er der problemene med HTTP starter ...

Internett har vokst raskere enn mulighetene til HTTP

HTTP har eksistert veldig lenge. Da det ble tenkt ut og opprettet, var internett et helt annet sted.

Båndbredden ble målt i biter, ikke titalls megabit. Derfor, for å være brukbare, ble nettsteder laget hovedsakelig av tekst og hyperkoblinger. Bilder var få og langt imellom.

Raskt frem til moderne tid.

Nettsteder, temaer og alle slags funksjoner har gjort nettsteder tyngre og tyngre når det gjelder ressurser. Det gjennomsnittlige nettstedet ditt inneholder hundrevis av forskjellige filer og bilder.

Nettsteder som trenger å bruke hundrevis av ressurser er dagens orden.

Hvis du for eksempel planlegger å opprette et WordPress-medlemskapsside, bruker du denne guiden skrevet av CollectiveRay, trenger du medlemskapstemaer, plugins og mange andre ressurser, som alle trenger forskjellige ressurser for å kunne fungere riktig.

For å komplisere saken ber hvert nettsted informasjon fra flere forskjellige servere for alle slags tredjepartsskript (for eksempel Google Analytics-skript, Facebook-delingsknapper, Google Ads eller AdSense, e-postmarkedsføring og alle slags andre plattformer).

Mengden ganger en nettleser trenger å hente filer fra nettserverens behov, fortsetter å vokse og vokse. 

Dette er ikke et problem i seg selv, selv om det stadig økende antall filer betyr at størrelsen på data som lastes ned fortsetter å vokse og vokse.

Dette betyr at den store mengden data som skal lastes ned blir større og større. Dette gjør lasting av nettsteder generelt langsommere.

For å gjøre saken verre er det å opprette en forbindelse mellom nettleseren og serveren teknisk dyr drift og tar tid. Etter hvert som antallet forskjellige ressurser som kreves på et nettsted, vokser, øker også tiden det tar å laste inn et nettsted.

Dette er fordi bruk av HTTP versjon 1, hver gang en ny fil er nødvendig, må det opprettes en ny (dyr) forbindelse.

Dette betyr at nettsteder som hadde ønsket å laste raskt måtte gjennom en hel optimaliseringsøvelse.

Hvordan lage et nettsted raskere (pre-HTTP2-versjon)

Som det kan sees gjennom vårt enkle eksempel, hadde HTTP v1 en rekke begrensninger gitt den nåværende tilstanden til nettet, noe som resulterte i at nettsteder ble sakte. Nå har du sannsynligvis sett hundrevis av artikler som viser deg hvordan du lager WordPress-nettstedet raskere.

Vi har en slik artikkel selv også fordi som WordPress-utviklere, vi jakter alltid behovet for fart - og vi er bare glade når vi oppnår en A-hastighetsvurdering.

Forresten, vi har mange forskjellige artikler for de som ønsker å lære om WordPress, sjekk opplæringsdelen på Collectiveray.

Det de fleste av disse artiklene som søker å øke hastigheten på WordPress, er å finne en måte å omgå begrensningene til HTTP1. De utfører løsninger for å sikre at nettstedene ikke blir bremset av alle disse tilkoblingene.

Dette var grunnen til at det var et så presserende behov for HTTP2, ikke bare for WordPress, men for alle andre nettsteder der ute. Noe måtte gjøres for å håndtere de iboende problemene med HTTP1 (både i nettleseren og på webservernivå).

Så hva var løsningene / løsningene for å lage et nettsted med HTTP v1 raskere? Vi refererte vanligvis til dem som Reduser, gjenbruk, Resirkulere. For mer forklaring på det, foreslår vi at du leser artikkelen vår om å lage nettsteder raskere ovenfor.

  1. Lag et lett nettsted som bruker en minimal mengde JS, CSS og bildefiler
  2. Reduser antall forespørsler for forskjellige CSS-filer og JS-filer ved å kombinere så mange av disse filene sammen som mulig (redusere forespørsler gjennom kombinasjon av filer)
  3. Redusere antall forespørsler om bilder med skape ett bilde som kombinerer dem alle i en og bruker CSS sprites
  4. Fjern eventuelle ekstra plugins (for å redusere antall bilder, CSS-filer og JS-filer de legger til nettstedet)
  5. Komprimerer de nødvendige dataene slik at den er mindre i størrelse (og dermed raskere å transportere) (f.eks aktiver WordPress GZIP-komprimering for å gjøre størrelsen på dataene som må overføres, mindre)
  6. Utnytt caching i nettleseren i WordPress ved hjelp av et plugin, slik at hvis en bruker besøker nettstedet ditt igjen innen en kort tidsramme, vil de ikke ha nedlasting av de samme filene igjen
  7. Andre handlinger...

I hovedsak ønsket vi å redusere antall separate forespørsler mellom serveren og nettleseren. Vi ønsket også å redusere størrelsen på disse forespørslene.

Optimaliser nettstedet http1 ved å minimere http-forespørsler

Så hvordan forbedrer HTTP / 2 alt dette?

Skriv inn HTTP / 2

HTTP / 2 ble skrevet med den hensikt å fikse disse iboende problemene. Et av hovedmålene for HTTP2 er å

Reduser ventetiden for å forbedre sideinnlastningshastigheten i nettlesere. (Kilde: WikiPedia)

og introduserer følgende forbedringer

  • er binær, i stedet for tekstlig
  • er fullt multiplekset, i stedet for bestilt og blokkert
  • kan derfor bruke en forbindelse for parallellitet
  • bruker toppkomprimering for å redusere overhead
  • lar servere "skyve" svar proaktivt inn i klientbuffere

Vent, hva? Ikke bekymre deg - la oss prøve å forklare dette litt enklere.

  1. Binær i stedet for tekstlig: dette er noe som gjør overføring og analyse av dataene mye mer effektive. Binær dataoverføring er også mye less utsatt for feil. Tekstdata er ment for konsum. Binære data er designet for maskinforbruk, å bruke binær for overføring av data er iboende raskere.

  2. Fullt sammensatt: igjen, rett og slett, med HTTP var problemet at hver tilkobling var tilbøyelig til å blokkere tilkoblingene som måtte skje etter den. Se for deg selv i køen for å komme inn på din favoritt sportskamp, ​​men i stedet for å ha flere inngangspunkter, hadde du bare 1 turnstile. Du kan forestille deg at ting kan bli veldig sakte. Multiplexing gjør at flere filer og forespørsler kan overføres samtidig. I eksempelet på fotballkampen, i stedet for at en person går inn om gangen, har vi 10 porter, med 10 vendepinner som går inn sammen.

  3. Bruk en forbindelse for parallellitet: Som vi nevnte før, når en forbindelse er dyr å opprette hvis du fortsetter å opprette og lukke den for alle ressurser du trenger, kommer du til å lage et alvorlig overheadproblem. Multiplexing gjør at samme tilkobling kan brukes om og om igjen. Tenk deg tilkoblingen som et rør som data fortsetter å strømme til du ikke har flere data. Vær også oppmerksom på at for ethvert nettsted vil du vanligvis ha nettleseren til å snakke med flere webservere for forskjellige tredjepartsskript og ressurser (Facebook-delingsskript, Twitter, Google Analytics, Annonsenettverk, etc.) Har en tilkobling for hver av disse er mer effektiv.

  4. Toppkomprimering er også en annen effektiv måte å fjerne flere av omkostningene forbundet med å måtte hente flere forskjellige ressurser fra samme eller flere webservere. Nok en gang, vanligvis i stedet for å måtte utføre flere turer, er en tur vanligvis nok.

  5. Lar servere presse ressurser proaktivt: dette er en måte som serveren, i stedet for å vente på at klientleseren skal be om de forskjellige ressursene i henhold til vårt første eksempel, proaktivt vil sende ressurser som nettleseren til slutt vil trenge eller be om. Dette kalles HTTP / 2 Server push.

Hvis vi måtte gå tilbake til analogien til servitøren som hadde med en drink om gangen, er den største fordelen at servitøren nå bruker et drikkebrett til å ta alle drikkene sammen. Og de tar også drinker fra baren som de sannsynligvis trenger når de er på restauranten.

http mot http2

Hva er SPDY? (aka Speedy)

Før HTTP2 faktisk ble født, hadde noen andre faktisk prøvd å løse problemene med HTTP. Dette var et forskningsprosjekt av et par Google-ingeniører, som hadde forsøkt å fikse noen av problemene med HTTP1.1.

SPDY-mål var å

  • Tillat multiplexing for å tillate samtidige forespørsler - og løs deretter problemene med ventetid opprettet ved å ha flere tilkoblinger
  • Prioriter ressurser som de viktigste ressursene til et nettsted som sendes først
  • Komprimer HTTP-overskrifter for å forbedre effektiviteten som diskutert ovenfor
  • Implementere server push som diskutert ovenfor også

I en første blogg som ble gitt ut av ingeniørene som skrev protokollen, ble det hevdet at den ville gjort det gjør nettet to ganger raskere. Selv om både store nettlesere og store webservere støttet SPDY, var det lite ekte adopsjon.

Forskningen var imidlertid avgjørende for den endelige utgivelsen av HTTP2, siden det første utkastet til HTTP2 brukte SPDY som arbeidsbase.

Hva må jeg gjøre for å aktivere HTTP / 2?

Før du aktiverer HTTP2, må du vite hvilke implikasjoner det har på nettstedet ditt.

Hvilke nettlesere støtter HTTP / 2?

I skrivende stund støtter de mest populære klientleserne fullt ut HTTP/2. FireFox, Chrome og nettlesere basert på Blink (dvs. Opera og Yandex) støtter HTTP2. Microsoft Edge støtter også HTTP2 Apple støtter det også på Safari. Statistikk fra slike nettsteder som Kan jeg bruke? viser at dagens støtte global distribusjon er på mer enn 95%. 

Hvis nettleseren ikke støtter HTTP2, og nettstedet støtter HTTP2, vil det være et grasiøst tilbakefall til HTTP1, så det er absolutt ikke noe problem for noen besøkende hvis du aktiverer HTTP / 2. Det kan bare være fordeler.

kan jeg bruke http2

Hvilke servere som støtter HTTP / 2

Apache, Nginx, LiteSpeed, IIS og mest populære serverimplementeringer støtter HTTP / 2 - du kan sjekke om din favoritt webserver eller webserveren du bruker har støtte for http2 her.

Om du kan bruke HTTP2, avhenger imidlertid av om vertsfirmaet ditt har aktivert dette. Så du må bekrefte den faktiske tilgjengeligheten av HTTP / 2 med vertsfirmaet ditt. Bildet nedenfor er en liste over servere som støtter http / 2. 

http2 serverstøtte

Enkelt sagt, om nettstedet ditt for øyeblikket støtter HTTP / 2, avhenger helt av vertsfirmaet ditt eller serveren der du er vert for nettstedet ditt. Vi bruker InMotion hosting (og her er vår InMotion hosting gjennomgang og egentlig hvordan vår VPS fares), som har støttet HTTP2 fullt ut i en årrekke nå.

Imidlertid bruker vi også StackPath for å betjene ressursene våre, som også støtter HTTP / 2.

De fleste vertsselskaper støtter i dag HTTP2 på serverne sine, så dette burde ikke være noen bekymring.

Du kan bruke dette verktøyet fra KeyCDN for å avgjøre om nettstedet ditt for øyeblikket har støtte for HTTP / 2. Denne HTTP / 2-testen kan fortelle deg om du trenger å utføre flere handlinger eller ikke.

Nettstedet ditt må være sikkert for å aktivere HTTP2

Foreløpig støtter alle nettlesere der ute bare kryptert HTTP2.

Dette betyr at for at nettstedet ditt skal kunne støtte HTTP / 2, må du ha nettstedet ditt servert over en sikker (TLS / SSL) tilkobling. Vi har gått ganske grundig over dette i vår artikkel om sette opp et sikkert WordPress-sertifikat på serveren din.

Å rekapitulere skjønt

  1. Sikre nettsteder får en SEO-rangering av signaløkning
  2. De beskytter dataene som overføres til og fra nettstedet (spesielt viktig for passord, kredittkortdata og andre sensitive data)
  3. Det er en sterk bevegelse mot fullsikre nettsteder, og hvis du ikke implementerer sikkerhet på nettstedet ditt, vil nettstedet ditt være igjen

Du må skaffe deg et sikkert sertifikat via hostingtjenesteselskapet ditt. Hosting selskaper som I bevegelse tillate deg å bruke et delt sertifikat, men hvis du vil bruke det med domenet ditt, anbefales det sterkt at du kjøper et eget sertifikat. 

Trenger du hjelp med nettstedet ditt?

Ansett en ekspert på nettstedet for så lite som $ 65. Registrer deg i dag for å begynne å chatte gratis.

Chat med en ekspert

Andre nettsteder som WordPress.com (i motsetning til WordPress.org) - les om forskjellen her - gi sikre sertifikater allerede.

Installasjon av sertifikatet er noe som vanligvis gjøres av hosting-serveren din. Det er en engangs ting, så du trenger ikke å bekymre deg.

Når det er gjort, trenger du bare å utføre en 301 permanent viderekobling via .htaccess-filen.

Nok en gang kan verter som InMotion hosting kan takle alt dette for deg, hvis du ikke er tilbøyelig til å gjøre denne typen tekniske finjusteringer selv (som har litt risiko for nedetid hvis du ikke gjør det riktig).

Er det et plugin jeg kan bruke til HTTP2?

Vi nevnte en av fordelene ved å bruke HTTP2 for å være muligheten til å utføre en server push av elementer som vil være nødvendige av nettleseren. Dette er selvfølgelig noe som må gjøres på CMS-nivå, så dette trenger støtte fra WordPress eller din favoritt CMS.

Selv om dette ennå ikke støttes på kjernenivå, kan du tilpasse temaene eller pluginene dine slik at de implementerer muligheten til å sende en 

Link:<...> rel="prefetch"

topptekst for hvert innskrevet skript og stil når WordPress sender dem ut til sidekilden.

Hvis du ønsker å gjøre nettstedet ditt raskere generelt, slik at forhåndshenting og andre kommandoer kan gjøre nettstedet ditt raskt, vil vi anbefale på det sterkeste WP Rocket - et premium plugin som betydelig øker hastigheten på nettstedet ditt. Hvis du vil ha et gratis plugin, kan du bruke det dette

Ta en titt på WP Rocket for å gjøre nettstedet ditt raskere

Dette tar faktisk ytterligere fordeler av funksjonene som er aktivert av HTTP / 2.

Endelig anbefaling

Så du er her fordi du ønsket å gjøre nettstedet ditt raskere ved å sette HTTP2 på plass, ikke sant? 

Dette er bare en av mange måter å gjøre nettstedet ditt raskere. Foruten denne teknologien, må du gjøre en rekke andre optimaliseringer hvis du vil gjøre nettstedet ditt raskere, for eksempel

  • Implementere et sidecache-plugin
  • Aktiver hurtigbufring av PHP, for eksempel OpCache
  • Optimaliser bilder for ytelse
  • Aktiver et CDN (gratis eller på annen måte)
  • Aktiver caching i nettleseren og gzip-komprimering
  • Optimaliser Google Fonts
  • Aktiver DNS-forhånds henting
  • Aktiver lazy loading av bilder
  • Aktiver minifisering og sammenkobling
  • etc etc

Høres ut som en mengde arbeid, ikke sant? Det er!

At CollectiveRay, bruker vi noen ganger flere dager jobber med å presse nettstedet vårt bare noen få brøkdeler av et sekund raskere. Dette er fordi nettstedet vårt kjører på Joomla, så vi har ikke mange av programtilleggene som er tilgjengelige for andre populære CMS-alternativer som WordPress.

For eksempel for våre kunder installerer vi alltid WP Rocket. På nettstedene der det installeres, får vi dem alltid til å lastes inn på under 3 sekunder, med typiske resultater at nettstedet lastes inn på under 1 sekund.

Hastighetstest før etter

Skjønnheten i det skjønt, det at vi ikke trenger å utføre noe av det manuelle arbeidet vi pleide å gjøre før, så vi spare timer av tid og frustrasjon, og vi får gode resultater å starte opp.

Ta en titt på WP Rocket for å gjøre nettstedet ditt raskt 

Ofte Stilte Spørsmål

Bør jeg bruke HTTP2?

Ja, du bør aktivere og bruke HTTP2 på nettstedet ditt hvis du kan. HTTP2 vil gjøre nettstedet ditt raskere, og det er absolutt ingen ulemper sammenlignet med HTTP-versjon 1. Selv om en klient bruker en gammel nettleser som ikke støtter HTTP2, er det en grasiøs tilbakefall til HTTP.

Hva er forskjellen mellom HTTP og HTTP2?

Det er en rekke forskjeller og forbedringer mellom HTTP og HTTP2. HTTP2 er binært, i stedet for tekstlig å gjøre det iboende raskere. Det er fullt multiplekset, i stedet for bestilt og blokkert, slik at flere tilkoblinger kan brukes samtidig. Den bruker komprimering av hodet for å redusere overhead og lar servere "skyve" svar proaktivt inn i klientbuffere. Alle disse forbedringene gjør HTTP2 mye raskere enn HTTP.

Krever HTTP2 SSL?

Ja, HTTP2 støttes bare i kryptert modus, så nettstedet ditt må også implementere sikre SSL / TLS-sertifikater for å kunne bruke HTTP2.

Støtter nettlesere HTTP2?

Over 95% av nettleserne som brukes i dag, støtter HTTP2. Selv om nettleseren ikke støtter HTTP2, vil det være et grasiøst tilbakefall til HTTP.

 

 

Konklusjon: La oss gjøre nettet raskere med HTTP2 

At CollectiveRay, har vi alltid vært fiksert på å gjøre nettstedene våre raske. HTTP2 er en evolusjon og en revolusjon på samme tid, og vi håper virkelig at denne artikkelen hjelper deg videre i oppsettet av WordPress HTTP2.

Legg igjen en kommentar nedenfor og fortell oss hva mer du vil vite.

 

Trenger du hjelp med å få gjort ting? Prøv disse topprangerte rimelige konsertene på Fiverr!

fiverr -logo

Klikk her for å finne eksperter på WordPress-hastighetsoptimalisering.

Klikk her for å opprette et komplett WordPress-nettsted.

 

om forfatteren
David Attard
Forfatter: David Attardnettside: https://www.linkedin.com/in/dattard/
David har jobbet i eller rundt den elektroniske / digitale industrien de siste 18 årene. Han har lang erfaring innen programvare- og webdesignindustrien ved å bruke WordPress, Joomla og nisjer rundt dem. Som digital konsulent er hans fokus på å hjelpe bedrifter med å få et konkurransefortrinn ved å bruke en kombinasjon av deres nettside og digitale plattformer som er tilgjengelige i dag.

En ting til... Visste du at folk som deler nyttige ting som dette innlegget også ser FANTASTISK ut? ;-)
Vær så snill forlate en nyttig kommenter med tankene dine, så del dette på Facebook-gruppen din (e) som synes dette er nyttig, og la oss høste fordelene sammen. Takk for at du delte og var hyggelig!

Avsløring: Denne siden kan inneholde lenker til eksterne nettsteder for produkter som vi elsker og anbefaler helhjertet. Hvis du kjøper produkter vi foreslår, kan vi tjene et henvisningsgebyr. Slike avgifter påvirker ikke våre anbefalinger, og vi godtar ikke betaling for positive anmeldelser.

Forfatter (e) Fremvist på:  Inc Magazine-logoen   Sitepoint-logo   CSS Tricks-logo    webdesignerdepot-logo   WPMU DEV-logo   og mange flere ...