5 způsobů, jak zlepšit PageSpeed ​​vašeho webu pomocí protokolu HTTP / 2

  • Harry James
  • 0
  • 4251
  • 1038
reklama

Protokol HyperText Transfer Protocol verze 2 nebo HTTP / 2 je nejnovějším standardem HTTP. Aktualizace protokolu zlepší rychlost, efektivitu a zabezpečení webového provozu. Přechod však není automatický.

Cílem tohoto článku je poskytnout vám nahlédnutí, co pro vás znamená HTTP / 2 a jak nakonfigurovat váš web nebo server tak, aby využíval nové funkce.

Co pro vás znamená HTTP / 2

Pro běžné uživatele budou změny z HTTP / 1.1 na HTTP / 2 zcela neviditelné.

Všechny prohlížeče budou vyžadovat platný certifikát Transport Layer Security (TLS), který bude sloužit webům přes HTTP / 2. Takže kromě rychlejšího načítání stránky dojde také ke zvýšení zabezpečení webových stránek.

Pro webové designéry a vlastníky může HTTP / 2 zlepšit rychlost načítání vašeho webu na všech zařízeních.

Každý moderní prohlížeč již podporuje nový standard protokolu (ačkoli tyto mobilní prohlížeče nepodporují HTTP / 2). Avšak v případech, kdy prohlížeč nebo server nepodporuje HTTP / 2, bude standard HTTP / 1.1 použit automaticky.

Jak HTTP / 2 ovlivní návrh webových stránek?

Změny zavedené v HTTP / 2 ovlivní to, jak optimalizujeme webové stránky a servery z hlediska efektivity a rychlosti.

Nové funkce zavedené v HTTP / 2 nám umožní ignorovat mnoho řešení HTTP / 1 a optimalizačních technik. To zahrnuje již ne vkládání skriptů do HTML nebo kombinování souborů pro snížení požadavků na server. Sharding domén již také není užitečný.

V některých případech tato zástupná řešení dokonce negativně ovlivní rychlost vaší stránky, pokud je poskytována HTTP / 2.

Většina internetového provozu je založena na mobilních zařízeních, proto zvažte rychlost mobilního internetu a udržujte své mediální soubory malé a optimalizované pro tato zařízení. Měli byste i nadále minimalizovat JavaScript (JS), HTML a CSS.

Pokud si nejste jisti, proč byste měli své soubory minifikovat, dobrým začátkem by byl náš článek o tom, jak a proč minifikovat váš JavaScript. Kompresory JavaScriptu: Jak a proč minifikovat JS Kompresory JavaScript: Jak a proč Minifikovat JS Miniatura javascriptu je jedním ze způsobů, jak urychlit dobu odezvy webových stránek, a naštěstí pro vás, je to snadný proces. Dnes vám ukážu vše, co potřebujete vědět.

Pojmy HTTP byste měli vědět

V případě, že nejste obeznámeni s podmínkami uvedenými v tomto článku, zde je stručný úvod

Vkládací skript je přidat JavaScript přímo do HTML dokumentu se značkou. V HTML / 1.1 se tím zbaví malých souborů JavaScriptu a sníží se požadavky na server a rychleji se načítají skripty.

Snížení počtu souborů již není problémem rychlosti stránky v HTTP / 2 díky Multiplexování, Prioritizace toku, a Server Push.

Multiplexování je nová funkce v HTML / 2, která umožňuje více Datové toky prostřednictvím jediného připojení protokolu TCP (Transmission Control Protocol).

Datové toky je termín HTML / 2 používaný pro obousměrné toky dat. Každému proudu můžeme upřednostnit díky jeho jedinečnému identifikátoru, který nám pomůže optimalizovat doručování dat.

Prioritizace toku je další nová funkce v HTML / 2. To nám dává možnost říct serveru, aby přiděloval zdroje a šířku pásma prioritám Datové toky. Tím je zajištěno optimální doručování obsahu s vysokou prioritou klientům.

Sharding domén je akt rozdělení zdrojů webových stránek na více webů nebo domén, aby se obešlo omezení současného stahování v HTML / 1.1.

V HTML / 2, Multiplexování a Server Push bude provádět souběžné stahování rychleji a efektivněji než Sharding domén. Ve skutečnosti v současné době neexistuje podpora pro použití těchto funkcí ve více doménách.

Server Push umožní serveru odeslat více odpovědí na jeden požadavek klienta. Stručně řečeno, server může udělat předpoklady, jaké soubory prohlížeč potřebuje k načtení stránky, aniž by je prohlížeč výslovně požadoval..

Nyní se zaměříme na některé ze změn, které by vlastníci webových stránek měli udělat pro optimalizaci webových stránek pro HTTP / 2. Pro hlubší nahlédnutí do těchto konceptů si přečtěte náš předchozí článek: “Co je to HTTP / 2 a jak to ovlivňuje budoucnost internetu? Co je to HTTP / 2 a jak to ovlivňuje budoucnost internetu? Co je to HTTP / 2 a jak to ovlivňuje budoucnost internetu? Internet je nastaven na efektivnější díky příchodu HTTP / 2. Co je to a jak se vylepšuje na HTTP? “.

5 změn webových stránek pro optimalizaci HTTP / 2

Hlavní změny, které byste si měli uvědomit jako vlastníci webových stránek, souvisí s tím, jak nakládat se zdroji webových stránek. Konkrétně s ohledem na to, jak server vašeho webu bude mluvit s prohlížečem a jak jsou soubory doručovány.

Níže jsou uvedeny nejčastější změny, na které byste se měli zaměřit při optimalizaci svých webových stránek HTTP / 2.

1. Neskombinujte svůj CSS nebo JavaScript

Neměli byste již spojovat zdroje svých webových stránek. V protokolu HTTP / 1.1 se tím sníží počet požadavků HTTP a soubory, které je třeba stáhnout, aby se zobrazil váš web.

Každý požadavek HTTP přidá latenci, takže při HTTP / 1.1 je stahování jediného souboru často efektivnější než stahování více souborů. Méně souborů také pomáhá obejít hranici současného stahování v HTTP / 1.1.

Protože HTTP / 2 umožňuje vícenásobné stahování bez požadavků na více serverů, je počet souborů při optimalizaci rychlosti méně důležitý. V kombinaci s ukládáním do mezipaměti jsou konkrétní soubory v HTTP / 2 lepší.

Konkrétnější soubory vám ve skutečnosti umožňují obsluhovat většinu vašeho webu z vaší sítě pro doručování obsahu (CDN) a mezipaměti prohlížeče uživatele. Znamená to také, že prohlížeč nebude muset stahovat a analyzovat jeden velký soubor ze serveru, když na svůj web uděláte drobné vylepšení..

2. Nevkládejte skripty do HTML

Vložení souborů CSS a JS do dokumentu HTML zlepší rychlost načítání stránky v protokolu HTTP / 1.1. Stejně jako při kombinování souborů se sníží počet souborů a požadavky na server.

Vložení skriptů do HTML při použití protokolu HTTP / 2 sníží optimalizaci rychlosti stránky z ukládání do mezipaměti tím, že odstraní schopnost prohlížeče samostatně ukládat prostředky do mezipaměti.

Přeruší také jakékoli vylepšení z Prioritizace streamů, protože veškerý vložený skript a obsah získají stejnou úroveň priority jako váš obsah HTML.

Namísto vložení aktiv ke snížení požadavků HTTP využijte výhody multiplexování a push serveru. Prohlížečům to umožní stáhnout více zdrojů s menším požadavkem a zvýšit rychlost načítání stránky.

Stručně řečeno, udržujte své zdroje oddělené a pokud možno malé.

3. Přestaňte používat CSS Image Sprite

Obrázek Kredit: jurgenwesterhof / Wikimedia

Image Sprite jsou obrázky vytvořené z mnoha menších obrázků (jako je ten výše). CSS pak určuje, které části obrazu se mají zobrazit.

Stejně jako u většiny řešení HTTP / 1.1 používáme obrazové skřítky částečně ke snížení požadavků na server. V HTTP / 2 můžete bezpečně používat samostatné obrázky, aniž by to negativně ovlivnilo rychlost načítání vaší stránky.

Menší soubory se budou stahovat rychleji a efektivněji díky multiplexování a push serveru.

4. Nepoužívejte Sharding domén

Sharding domén se používá k obcházení omezení současného stahování v HTTP / 1. Toto omezení se obvykle pohybuje mezi čtyřmi a osmi doménami a je nastaveno v prohlížečích částečně proto, aby omezilo útoky DDOS.

Například sdílení vašeho webu napříč čtyřmi doménami může teoreticky sloužit prostředkům ve čtvrtině času v HTTP / 1.1.

Díky multiplexování HTTP / 2 již není nutné sharding domén.

Prohlížeče nemohou využívat výhod multiplexování a paralelního stahování napříč více doménami v HTTP / 2. Sharding také poruší prioritu toku HTTP / 2 a dále sníží výhody používání HTTP / 2.

5. Využijte výhody serveru Push

Nejvýznamnějším vylepšením HTTP / 2 je serverový push.

V HTTP / 1.1, když požádáte o zobrazení stránky, server pošle dokument HTML jako první. Váš prohlížeč to poté začne analyzovat a samostatně si vyžádá soubory CSS, JS a mediální soubory uvedené v dokumentu.

V HTTP / 2 server push umožňuje serveru tlačit požadované prostředky do prohlížeče bez samostatné žádosti o ně. To zahrnuje soubory CSS a JavaScript, jakož i média, a sníží to požadavky HTTP a urychlí načítání stránky.

Smashing Magazine má skvělého komplexního průvodce serverem HTTP / 2, který poskytuje informace o tom, jak to funguje a jak jej povolit.

Jak nakonfigurovat server pro HTTP / 2

Většina serverových implementací již podporuje HTTP / 2. Pokud však používáte sdíleného hostitele, musíte se u svého správce serveru zkontrolovat, zda aktivoval HTTP / 2. Pokud jste zvědaví, GitHub obsahuje seznam serverových implementací, které podporují HTTP / 2.

Servery Nginx mají nativní podporu pro HTTP / 2, zatímco pro povolení podpory HTTP / 2 budete možná muset nakonfigurovat servery Apache.

Pokud je váš web povolen pomocí protokolu HTTPS (požadavek HTTP / 2), můžete zkontrolovat, zda je váš web dodáván s protokolem HTTP / 2 na adrese http2.pro. Pokud však jako své CDN používáte Cloudflare, veškerý obsah z jejich serverů se bude zobrazovat přes HTTP / 2, aniž byste museli provádět žádné změny..

Specifičtí hostitelé WordPress někdy omezí změny konfigurace, které můžete provést, zejména ve službách nižší úrovně. To znamená, že pro vaše weby WordPress doporučujeme Bluehost. Bluehost nabízí bezplatné SSL a CDN a bude sloužit vašim webům přes HTTP / 2.

HTTP / 2 je jen první krok

HTTP / 2 je obrovským zlepšením oproti předchozímu standardu a nyní byste se měli seznámit s výhodami, které získáte jeho implementací..

Povolené weby se načítají rychleji a bezpečněji, což také posílí vaše hodnocení ve vyhledávání. HTTP / 3 je již na cestě a konfigurace vašeho webu pro HTTP / 2 způsobí, že váš konečný skok na HTTP / 3 bude mnohem plynulejší.

Kromě nastavení vašeho webu pro HTTP / 2 byste také měli zvážit tyto způsoby, jak zrychlit načítání vašeho webu. 7 způsobů, jak zrychlit načítání vašeho webu nebo blogu pro návštěvníky 7 způsobů, jak zrychlit načítání svého webu nebo blogu pro návštěvníky Zde je několik nejlepší tipy, jak urychlit váš web a zajistit, aby se návštěvníci drželi. .




Bisher hat noch niemand einen Kommentar zu diesem Artikel abgegeben.

O moderní technologii, jednoduché a cenově dostupné.
Váš průvodce ve světě moderních technologií. Naučte se, jak používat technologie a pomůcky, které nás každý den obklopují, a naučte se, jak objevovat na internetu zajímavé věci.