HTTP / 2 I maj 2015 blev det annonceret, at specifikationen for HTTP2 var blevet færdiggjort og udgivet. HTTP2 tilbyder betydelige fordele ved ydeevnen til ethvert websted, så da størstedelen af ​​websteder drives af WordPress, var det kun et spørgsmål om tid, før vi skulle vide, hvordan vi satte det op, og hvad HTTP2 er.

Så her er vi med en komplet guide og/eller vejledning til, hvad HTTP2 er, hvorfor du bør aktivere HTTP2 på din hjemmeside, hvad fordelene er, og endelig - hvordan man rent faktisk gør det.

{autotoc}

 

Så lad os starte med de første par ting.

Hvad er HTTP2?

HTTP2 er den seneste version af HTTP (HyperText Transfer Protocol), som er optimeret på en måde, der gør, at dit websted indlæses meget hurtigere uden ekstra indsats fra din side. Når du har konfigureret HTTP2, er der ikke behov for optimeringer som minificering, kombinationer og andre hacks, som vi plejede at udføre før - disse er indbygget i selve protokollen.

(På CollectiveRay, vi kan godt lide at lave vores hjemmesider smuk og hurtigt!) 

Før vi rent faktisk går i dybden med HTTP2, lad os tage et kig tilbage på HTTP og hvorfor en ny version af HTTP var nødvendig.

Hvad er HTTP?

HyperText Transfer Protocol (også kendt som HTTP) er simpelthen en måde, hvorpå din browser kommunikerer med webserveren på det websted, du besøger.

Der er mange måder, hvorpå to (eller flere) maskiner kommunikerer over internettet. HTTP er den måde, der bruges til at browse på websteder. Med fremkomsten af ​​websteder som YouTube og Twitch der bærer meget trafik over HTTP, er denne protokol fortsat den, der bærer mest trafik. Det er helt sikkert den, der er mest "synlig", da den er involveret i al browsing på websteder.

Hvor mange gange skriver du egentlig https:// hver eneste dag?

http

Uden at gå for meget i detaljer, bruges HTTP-protokollen af ​​den besøgendes browser til at anmode om alt indholdet på et websted.

Samtalen går nogenlunde sådan her:

browserHej server på www.collectiveray.com - kan du give mig indholdet af denne hjemmeside?

ServerHej browser, dette er HTML-indholdet af www.collectiveray.com

<html xmlns:og="https://ogp.me/ns#" xmlns:fb="https://www.facebook.com/2008/fbml" Lang="en-gb" dir="ltr" klasse='com_indhold vis-artikel itemid-388 j35 mm-hover'>

...

browserFantastisk, nu ser jeg, at jeg også har brug for indholdet af disse js-filer: collectiveray. Js, jquery.min.js, jquery-ui.min.js ... og også indholdet af disse filer: styles.css, jquery.min.css, ... Send mig også venligst følgende billeder: favicon.ico, Logo.jpg, blog-header.jpg, annonce1.jpg...

Server:

  1. Her er indholdet af filen collectiveray. Js
  2. Og her er indholdet af filen jquery.min.js
  3. Og her er jquery-ui.min.js
  4. ...
  1. og her er billedet footer-ikon.jpg ...

I sandhed spiller serveren og browseren digital tennis med dataene fra den hjemmeside, du besøger.

Hver frem og tilbage-besked fra serveren sender en lille del af hjemmesiden. Dette fortsætter, indtil alt indholdet er sendt fra sidens server til browseren.

En anden rigtig god analogi, der er blevet brugt til at beskrive HTTP1, er den med en tjener, der henter drinks fra baren og kun får én drink hver gang, de besøger baren.

http11

Selvfølgelig er denne metode til at få én "ting" ad gangen ikke voldsomt effektiv, og det er her, problemerne med HTTP starter...

Internettet er vokset hurtigere end HTTP's muligheder

HTTP har eksisteret i meget lang tid. Da det blev udtænkt og skabt, var internettet et helt andet sted.

Båndbredde blev målt i bits, ikke i ti megabits. Derfor blev hjemmesider primært lavet af tekst og hyperlinks for at være brugbare. Billeder var sjældne.

Spol frem til moderne tid.

Hjemmesider, temaer og alle mulige former for funktionalitet har gjort hjemmesider mere og mere ressourcekrævende. En gennemsnitlig hjemmeside indeholder hundredvis af forskellige filer og billeder.

Hjemmesider, der skal bruge hundredvis af ressourcer, er dagens orden.

Hvis du for eksempel planlægger at oprette et WordPress-medlemswebsted, kan du bruge denne vejledning skrevet af CollectiveRay, skal du bruge medlemskabstemaer, plugins og masser af andre ressourcer, som alle kræver forskellige ressourcer for at kunne fungere korrekt.

For at komplicere tingene anmoder hvert websted om oplysninger fra flere forskellige servere til alle mulige tredjepartsscripts (for eksempel Google Analytics-scripts, Facebook-deleknapper, Google Ads eller AdSense, e-mailmarkedsføring og alle mulige andre platforme).

Antallet af gange en browser skal hente filer fra en hjemmesideserver, vokser og vokser. 

Dette er ikke et problem i sig selv, selvom det stadigt stigende antal filer betyder, at størrelsen af ​​data, der downloades, bliver ved med at vokse og vokse.

Det betyder, at den store mængde data, der skal downloades, bliver større og større. Dette gør indlæsningen af ​​websteder generelt langsommere.

For at gøre tingene værre er det en opbygning af en forbindelse mellem browseren og serveren. teknisk dyr drift og tager tid. Efterhånden som antallet af forskellige ressourcer, der kræves på et websted, vokser, øges også den tid, det tager at indlæse et websted.

Dette skyldes, at når man bruger HTTP version 1, skal der oprettes en ny (dyr) forbindelse, hver gang der er behov for en ny fil.

Det betyder, at websteder, der ønskede at indlæse hurtigt, måtte gennemgå en hel optimeringsøvelse.

Sådan gør du en hjemmeside hurtigere (version før HTTP2)

Som det kan ses i vores simple eksempel, havde HTTP v1 en række begrænsninger i betragtning af internettets nuværende tilstand, hvilket resulterede i, at websteder blev langsomme. Nu har du sikkert set hundredvis af artikler, der viser dig, hvordan du kan lave din WordPress hjemmeside hurtigere.

Vi har også selv sådan en artikel, fordi WordPress-udviklere, vi jagter altid behovet for fart - og vi er kun glade, når vi rammer en hastighedsklassificering A.

I øvrigt har vi masser af forskellige artikler til dem, der vil lære om WordPress. Se afsnittet med vejledninger på Collectiveray.

Det, de fleste af disse artikler, der søger at fremskynde WordPress, gør, er at finde en måde at omgå begrænsningerne i HTTP1. De udfører løsninger for at sikre, at webstederne ikke bliver langsommere af alle disse forbindelser.

Derfor var der et så presserende behov for HTTP2, ikke kun for WordPress, men for alle andre hjemmesider derude. Noget måtte gøres for at håndtere de iboende problemer med HTTP1 (både på browser- og webserverniveau).

Så hvad var løsningerne/omgåelserne til at gøre et websted hurtigere ved hjælp af HTTP v1? Vi omtalte dem typisk som Reducer, Genbruge, Genbruge. For en mere detaljeret forklaring på dette foreslår vi, at du læser vores artikel om at gøre hjemmesider hurtigere ovenfor.

  1. Opret en letvægtshjemmeside, der bruger en minimal mængde JS, CSS og billedfiler
  2. Reducer antallet af anmodninger for forskellige CSS-filer og JS-filer ved at kombinere så mange af disse filer som muligt (reducerer anmodninger gennem kombinationen af ​​filer)
  3. Reducering af antallet af anmodninger om billeder ved skaber ét billede, der kombinerer dem alle til én og bruge CSS-sprites
  4. Fjern eventuelle ekstra plugins (for at reducere antallet af billeder, CSS-filer og JS-filer, de tilføjer til webstedet)
  5. Komprimering af de nødvendige data så den er mindre i størrelse (og dermed hurtigere at transportere) (f.eks. ville du typisk Aktivér WordPress GZIP-komprimering for at gøre størrelsen på de data, der skal overføres, mindre)
  6. Udnyt browser caching i WordPress ved hjælp af et plugin, således at hvis en bruger besøger dit websted igen inden for kort tid, behøver de ikke at downloade de samme filer igen
  7. Andre handlinger...

I bund og grund ønskede vi at reducere antallet af separate anmodninger mellem serveren og browseren. Vi ønskede også at reducere størrelsen af ​​disse anmodninger.

Optimer hjemmesidens http1 ved at minimere http-anmodninger

Så hvordan forbedrer HTTP/2 alt dette?

Indtast HTTP/2

HTTP/2 blev skrevet med den hensigt at løse disse iboende problemer. Et af de primære mål med HTTP2 er at

Reducer latenstid for at forbedre sideindlæsningshastigheden i webbrowsere. (Kilde: Wikipedia)

og introducerer følgende forbedringer

  • er binær i stedet for tekstuel
  • er fuldt multiplekset i stedet for ordnet og blokerende
  • kan derfor bruge én forbindelse til parallelisme
  • bruger headerkomprimering til at reducere overhead
  • tillader servere at "skubbe" svar proaktivt ind i klientcaches

Vent, hvad? Bare rolig – lad os prøve at forklare det lidt mere enkelt.

  1. Binær i stedet for tekstuelDette er noget, der gør overførslen og parsningen af ​​data meget mere effektiv. Binær dataoverførsel er også meget mindre tilbøjelig til fejl. Tekstdata er beregnet til menneskelig brug. Binære data er designet til maskinbrug, så det er i sagens natur hurtigere at bruge binær fil til overførsel af data.

  2. Fuldt multiplexetIgen, enkelt sagt, med HTTP var problemet, at hver forbindelse var tilbøjelig til at blokere de forbindelser, der skulle ske efter den. Forestil dig selv i køen for at komme ind i din yndlingssportskamp, ​​men i stedet for at have flere indgangspunkter havde du kun ét tællekors. Du kan forestille dig, at tingene kan blive meget, meget langsomme. Multiplexing tillader overførsel af flere filer og anmodninger på samme tid. I eksemplet med fodboldkampen har vi 1 porte med 10 tællekorser, der går ind samtidig, i stedet for at have én person, der går ind ad gangen.

  3. Brug én forbindelse til parallelismeSom vi nævnte før, når en forbindelse er dyr at oprette, og du bliver ved med at oprette og lukke den for hver ressource, du har brug for, vil du skabe et alvorligt overheadproblem. Multiplexing gør det muligt at genbruge den samme forbindelse igen og igen. Forestil dig forbindelsen som et rør, hvorigennem data flyder, indtil du ikke har flere data. Bemærk også, at for ethvert websted vil browseren typisk kommunikere med flere webservere for forskellige tredjepartsscripts og -ressourcer (Facebook-delingsscripts, Twitter, Google Analytics, annoncenetværk osv.). At have én forbindelse til hver af disse er mere effektivt.

  4. Header-komprimering er også en anden effektiv måde at fjerne adskillige af de omkostninger, der er forbundet med at skulle hente flere forskellige ressourcer fra den samme eller flere webservere. Igen er én tur typisk nok i stedet for at skulle udføre flere frem og tilbage-ture.

  5. Giver servere mulighed for proaktivt at pushe ressourcerDette er en måde, hvorpå serveren, i stedet for at vente på, at klientbrowseren anmoder om de forskellige ressourcer, som i vores første eksempel, proaktivt sender ressourcer, som browseren i sidste ende har brug for eller anmoder om. Dette kaldes HTTP/2 Server push.

Hvis vi skulle gå tilbage til analogien med tjeneren, der bragte én drink ad gangen, er den største fordel, at tjeneren nu bruger en drikkebakke til at tage alle drikkevarerne samlet. Og de tager også drikkevarer fra baren, som de sandsynligvis får brug for, når de er på restauranten.

http vs. http2

Hvad er SPDY? (også kendt som Speedy)

Før HTTP2 rent faktisk blev født, havde en anden faktisk forsøgt at løse problemerne med HTTP. Dette var et forskningsprojekt udført af et par Google-ingeniører, som havde forsøgt at løse nogle af problemerne med HTTP 1.1.

SPDYs mål var at

  • Tillad multipleksing for at tillade samtidige anmodninger - og dermed løse problemerne med latenstid, der opstår ved at have flere forbindelser
  • Prioriter ressourcer, såsom at de vigtigste ressourcer på et websted sendes først
  • Komprimer HTTP-headere for at forbedre effektiviteten som beskrevet ovenfor
  • Implementer også server push som beskrevet ovenfor

I en indledende blog udgivet af ingeniørerne, der skrev protokollen, blev det hævdet, at det ville gør internettet dobbelt så hurtigtSelvom både større browsere og større webservere understøttede SPDY, var der ringe reel adoption.

Dens forskning var dog afgørende for den endelige frigivelse af HTTP2, da det første udkast til HTTP2 brugte SPDY som arbejdsgrundlag.

Hvad skal jeg gøre for at aktivere HTTP/2?

Før du aktiverer HTTP2, skal du vide, hvilke konsekvenser det har for dit websted.

Hvilke browsere understøtter HTTP/2?

I skrivende stund understøtter de fleste populære klientbrowsere HTTP/2 fuldt ud. FireFox, Chrome og browsere baseret på Blink (dvs. Opera og Yandex) understøtter HTTP2. Microsoft Edge understøtter også HTTP2, mens Apple understøtter det også på Safari. Statistik fra websteder som Kan jeg brugeviser, at den nuværende globale støttefordeling er på mere end 95 %. 

Hvis browseren ikke understøtter HTTP2, og hjemmesiden understøtter HTTP2, vil der være et elegant fallback til HTTP1, så der er absolut intet problem for nogen besøgende, hvis du aktiverer HTTP/2. Der kan kun være fordele.

kan jeg bruge http2

Hvilke servere understøtter HTTP/2

Apache, Nginx, LiteSpeed, IIS og de fleste populære serverimplementeringer understøtter HTTP/2 - du kan tjekke, om din foretrukne webserver eller Den webserver, du bruger, understøtter http2 her.

Om du kan bruge HTTP2 afhænger dog af, om dit hostingfirma har aktiveret dette. Så du skal bekræfte den faktiske tilgængelighed af HTTP/2 hos dit hostingfirma. Billedet nedenfor er en liste over servere, der understøtter http/2. 

http2-serverunderstøttelse

Kort sagt, om dit websted i øjeblikket understøtter HTTP/2, afhænger fuldstændigt af dit hostingfirma eller den server, hvor du hoster dit websted. Vi bruger InMotion-hosting (og her er vores Anmeldelse af InMotion-hosting og i bund og grund hvordan vores VPS fares), som har understøttet HTTP2 fuldt ud i en årrække nu.

Vi bruger dog også StackPath til at betjene vores ressourcer, som også understøtter HTTP/2.

De fleste hostingfirmaer understøtter i dag HTTP2 på deres servere, så dette burde ikke være en bekymring.

Du kan bruge dette værktøj fra KeyCDN for at afgøre, om dit websted i øjeblikket understøtter HTTP/2. Denne HTTP/2-test kan fortælle dig, om du skal udføre yderligere handlinger eller ej.

Dit websted skal være sikkert for at aktivere HTTP2

I øjeblikket understøtter alle browsere derude kun krypteret HTTP2.

Det betyder, at for at dit websted kan understøtte HTTP/2, skal dit websted serveres over en sikker (TLS/SSL) forbindelse. Vi har gennemgået dette ret grundigt i vores artikel om Opsætning af et WordPress-sikkerhedscertifikat på din server.

For dog at opsummere

  1. Sikre websteder får et boost i SEO-rangeringssignalet
  2. De beskytter de data, der overføres til og fra webstedet (især vigtigt for adgangskoder, kreditkortoplysninger og andre følsomme data)
  3. Der er en stærk bevægelse mod fuldt sikre hjemmesider, og hvis du ikke implementerer sikkerhed på din hjemmeside, er det uundgåeligt, at din hjemmeside vil blive ladt bagud.

Du skal anskaffe et sikkert certifikat via dit hostingfirma. Hostingfirmaer som f.eks. I bevægelse tillader dig at bruge et delt certifikat, men hvis du vil bruge det med dit domæne, anbefales det kraftigt, at du køber dit eget certifikat. 

Brug for hjælp med din hjemmeside?

Hyr en godkendt hjemmesideekspert for så lidt som $65. Tilmeld dig i dag for at begynde at chatte gratis.

Chat med en ekspert

Andre sider som WordPress.com (i modsætning til WordPress.org) - læs om forskellen her - leverer allerede sikre certifikater.

Installation af certifikatet er typisk noget, der udføres af din hostingserver. Det er en engangsforeteelse, så du behøver ikke bekymre dig.

Når det er gjort, skal du blot udføre en permanent 301-omdirigering via din .htaccess-fil.

Endnu engang værter som f.eks. InMotion-hosting kan håndtere alt dette for dig, hvis du ikke er tilbøjelig til at udføre denne form for tekniske justeringer selv (hvilket indebærer en smule risiko for nedetid, hvis det ikke gøres korrekt).

Er der et plugin jeg kan bruge til HTTP2?

Vi nævnte en af ​​fordelene ved at bruge HTTP2, nemlig muligheden for at udføre en server-push af elementer, som browseren vil have brug for. Dette er selvfølgelig noget, der skal gøres på CMS-niveau, så dette kræver support fra WordPress eller dit foretrukne CMS.

Selvom dette endnu ikke understøttes på kerneniveau, kan du justere dine temaer eller plugins, så de implementerer muligheden for at sende en 

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

header for hvert script og hver stil i kø, når WordPress sender dem ud i kildekoden.

Hvis du generelt ønsker at gøre dit websted hurtigere, og aktivere prefetch og andre kommandoer for at gøre det hurtigt, vil vi varmt anbefale WP Rocket - et premium-plugin, der øger hastigheden på dit websted betydeligt. Hvis du ønsker et gratis plugin, kan du bruge det. denne

Tjek WP Rocket for at gøre din hjemmeside hurtigere

Dette udnytter faktisk de funktioner, der er aktiveret af HTTP/2, yderligere.

Endelig anbefaling

Så du er her, fordi du ville gøre dit websted hurtigere ved at implementere HTTP2, ikke? 

Dette er kun en af ​​mange måder at gøre dit websted hurtigere på. Udover denne teknologi skal du foretage en række andre optimeringer, hvis du vil gøre dit websted hurtigere, f.eks.

  • Implementer et sidecache-plugin
  • Aktivér PHP-niveau caching, f.eks. OpCache
  • Optimer billeder for at opnå bedre ydeevne
  • Aktivér et CDN (gratis eller ej)
  • Aktivér browsercaching og gzip-komprimering
  • Optimer Google-skrifttyper
  • Aktivér DNS-forhåndshentning
  • Aktivér lazy loading af billeder
  • Aktivér minificering og sammenkædning
  • osv osv

Lyder det som en masse arbejde, ikke? Det er det!

At CollectiveRay, vi bruger nogle gange adskillige dage arbejder på at gøre vores hjemmeside bare et par brøkdele af et sekund hurtigere. Dette skyldes, at vores hjemmeside kører på Joomla, så vi har ikke mange af de plugins, der er tilgængelige til andre populære CMS-muligheder som f.eks. WordPress.

For eksempel installerer vi altid for vores kunder WP RocketPå de hjemmesider, hvor vi installerer det, får vi dem altid til at indlæse på under 3 sekunder, med typiske resultater, at hjemmesiden indlæses på under 1 sekund.

Hastighedstest Før Efter

Det smukke ved det er dog, at vi ikke behøver at udføre noget af det manuelle arbejde, vi plejede at skulle udføre før, så vi spar timer af tid og frustration, og vi får ovenikøbet fremragende resultater.

Tjek WP Rocket for at gøre din hjemmeside hurtig 

Ofte stillede spørgsmål

Skal jeg bruge HTTP2?

Ja, du bør aktivere og bruge HTTP2 på din hjemmeside, hvis du kan. HTTP2 vil gøre din hjemmeside hurtigere, og der er absolut ingen ulemper sammenlignet med HTTP version 1. Selv hvis en klient bruger en gammel browser, der ikke understøtter HTTP2, er der et elegant fallback til HTTP.

Hvad er forskellen mellem HTTP og HTTP2?

Der er en række forskelle og forbedringer mellem HTTP og HTTP2. HTTP2 er binært i stedet for tekstligt, hvilket gør det i sagens natur hurtigere. Det er fuldt multiplekset i stedet for ordnet og blokerende, så flere forbindelser kan bruges samtidigt. Det bruger header-komprimering til at reducere overhead og giver servere mulighed for proaktivt at "skubbe" svar ind i klientcacher. Alle disse forbedringer gør HTTP2 meget hurtigere end HTTP.

Kræver HTTP2 SSL?

Ja, HTTP2 understøttes kun i krypteret tilstand, så dit websted skal også implementere sikre SSL/TLS-certifikater for at kunne bruge HTTP2.

Understøtter browsere HTTP2?

Over 95% af de webbrowsere, der bruges i dag, understøtter HTTP2. Selv hvis browseren ikke understøtter HTTP2, vil der være et elegant fallback til HTTP.

 

 

Konklusion: Lad os gøre internettet hurtigere med HTTP2 

At CollectiveRayVi har altid været fokuserede på at gøre vores hjemmesider hurtige. HTTP2 er både en evolution og en revolution, og vi håber virkelig, at denne artikel hjælper dig med at komme videre med din opsætning af WordPress HTTP2.

Skriv venligst en kommentar nedenfor og fortæl os, hvad du ellers gerne vil vide.

 

Brug for hjælp til at få tingene gjort? Prøv disse topbedømte, overkommelige jobs på Fiverr!

fiverr-logo

Klik her for at finde eksperter i WordPress hastighedsoptimering.

Klik her for at oprette en komplet WordPress-hjemmeside.