14 svetelných trikov na zrýchlenie vášho webu

Táto séria blogov o rýchlosti stránok bola veľmi zábavná.

Doteraz sme sa dozvedeli, že Amazon by stratil 1,6 miliardy dolárov (!), Ak by sa ich web spomalil.

Tiež som presne zistil, čo sa deje v zákulisí, aby som spomalil web.

Dostávame sa k nášmu prirodzenému záveru: ako presne môžete veci urýchliť? Pokrývame všetko od rýchlosti servera po optimalizáciu a niekoľko bonusov navyše.

Najprv si pripomeňme, čo spôsobuje nízku rýchlosť:

Keď sem nahráte moje stránky na server Bitcatcha, váš prehliadač (Firefox, Safari, Chrome atď.) Začne konverzáciu s mojím webovým serverom.

Prehliadač: „Ahoj webový server! Môžete mi priniesť všetky drobnosti na zobrazenie stránky Bitcatcha.com? „

Server: „Jasné, nájdem ich a pošlem“.

Webový server potom umiestni všetky komponenty webu do tunela a odošle ich do vášho prehľadávača na nahranie.

Znie to celkom jednoducho, ale tu sa dá spomaliť:

Lenivý server, ktorý vyžaduje vek, aby odpovedal na požiadavky.
Server, ktorý súčasne spravuje stopy pre mnoho ďalších webových stránok.
Veľa skvelých „kúskov“ webu, ktoré je potrebné nájsť a odoslať do tunela.
Preplnený tunel.

Tu sa môže pokaziť veľa vecí. Ako teda veci urýchlime?

Časť 1: Zrýchlite svoj server

1. Inovujte na lepšieho hostiteľa webu (tj. Lepší server)

Váš webový hostiteľ je spoločnosť, ktorá poskytuje server. Je to ako prenájom internetovej stránky, kde budete ukladať všetky časti tejto stránky.

Väčšina z nás má tendenciu kupovať najlacnejšiu pôdu, akú nájdu. To však nemusí byť nutne múdre riešenie.

Na lacných webových stránkach sa nachádzajú prenajaté servery, ktoré sú preplnené a malé. Pamätajte, že chcete, aby váš server rýchlo odpovedal na požiadavky a rýchlo odosielal vaše stránky v tuneli do vášho prehliadača.

Prezrite si náš najrýchlejší zoznam webhostingu na základe doby odozvy servera.

2. Prejdite zo zdieľaného hostingu na VPS

Lacní hostitelia webov umiestnia vaše webové stránky na server spolu s hromadou ďalších webových stránok. Volá sa to zdieľaný hosting a znamená to, že musíte bojovať o zdroje.

Ak webová stránka zrazu zaznamená veľkú premávku, spomalí vás a zvýši sa šírka pásma.

Prepnutím na VPS (virtuálny súkromný server) alebo (aspoň na kvalitný zdieľaný server, napríklad SiteGround) webový hostiteľ zatvorí roh zdieľaného servera iba pre vás. Znamená to, že sa nemusíte obávať toho, že vám iné stránky ukradnú zdroje.

3. Posuňte server bližšie k publiku.

Zakaždým, keď niekto klikne na vaše stránky, musí váš server fyzicky odoslať informácie z planéty na obrazovku vášho počítača.

Ak je server na druhej strane sveta, bude to trvať dlho. Ak viete, odkiaľ pochádza väčšina vášho prenosu, požiadajte svojho hostiteľa webu, aby umiestnil vaše stránky na server najbližšie k vášmu hlavnému publiku.

4. Použite sieť na doručovanie obsahu

Problém s presunutím servera bližšie k určitému publiku spočíva v tom, že niekto stratí. Ak presuniete server do Kalifornie, austrálski návštevníci dostanú pomalý čas načítania. Rovnako tak sú na tom aj vaši európski návštevníci.

Sieť na doručovanie obsahu alebo sieť CDN ukladá vaše údaje na servery po celom svete. Keď teda niekto klikne na vaše webové stránky, informácie odošle najbližší server.

Znamená to, že sa vaši návštevníci dostávajú super rýchlo, nech sú kdekoľvek na svete. (Pre vašu informáciu, tu v Bitcatcha používam Cloudflare.)

5. Povoľte nastavenie „udržať nažive“

Keď váš server pošle vaše súbory lokality do tunela, každá strana cestuje osobitne. Vaša šablóna štýlov CSS, vaše logo, každý váš obrázok atď.

Najúčinnejším spôsobom, ako to dosiahnuť, je samozrejme poslať ich všetkých do rovnakého veľkého tunela.

Tam prichádza na rad nastavenie „udržiavaj to nažive“. Po aktivácii zostane hlavný tunel zapnutý a všetko bude vypadávať rovnako (je to veľmi rýchle).

Ale keď je nastavenie zastavené, pre každý prvok sa musí vytvoriť nový tunel. (Je to veľmi pomalé).

Väčšina webových hostiteľov zachováva toto nastavenie (čo je dobré), ale niekedy zdieľaní hostitelia ukončujú pripojenie bez varovania.

Časť 2: Optimalizácia prvkov webových stránok

Teraz, keď sme váš server nastavili čo najrýchlejšie a najefektívnejšie, ako si sami optimalizujeme komponenty stránky?

6. Skráťte spiatočný čas (RTT)

Prehliadač momentálne vyžaduje každú položku, jednu po druhej. Vaše logo, potom každý z obrázkov a potom šablóna štýlov CSS.

Čas potrebný na jeho získanie je spiatočný.

Čím viac spiatočných letov musíte urobiť, tým viac času trvá načítaniu celého webu. Je to ako zabaliť auto do škatúľ a presunúť ich do nového domu.

Čím viac políčok máte, tým viac spiatočných letov musíte urobiť. Riešenie? Znížte počet škatúľ, ktoré vezmete.

Znížte počet položiek, ktoré musí server odosielať do tunela. Menej obrázkov, menej kódu, menej doplnkov.

7. Povoľte kompresiu na svojom webe

Bohužiaľ to nie je iba počet krabíc. Je to také ťažké. Ak sú všetky vaše prvky veľké a ťažké, zaberie vám to v tuneli veľa miesta. Rovnako sa budú pohybovať pomalšie. Je to ako stavať nákladné autá. Každá plná ťažkých krabíc.

Našťastie môžete svoju webovú stránku a všetko na nej skomprimovať. Pomocou nástroja ako Gzip. (Rozpoznáva ho 90% prehľadávačov. - Je to takmer každý, s výnimkou niekoľkých cudzincov, ktorí stále používajú program Internet Explorer 4.)

Najpodivnejšie časti vášho webu sú obrázky, HTML, CSS a Javascript. Ich kompresiou môžete znížiť priemernú „váhu“ vášho webu počas prenosu.

Priemerná veľkosť webovej stránky je 2 MB, ale každý rok rastie.

8. Optimalizujte svoje obrázky

Obrázky sú zvyčajne najťažšou časťou akejkoľvek webovej stránky. Som najväčší, najtučnejší a najpomalší nakladač.

Začnite ich rezaním na presnú veľkosť, ktorú potrebujete. Nenahrávajte veľké obrázky ani ich zväčšujte v HTML. Stačí ich naložiť do správnej veľkosti.

Pred nahraním tiež komprimujte obrázky. Ak používate WordPress, doplnky ako WP Smush môžu znížiť veľkosť obrázka o 80%!

9.… Alebo si pripravte liehoviny

Sprite je jeden obrázok, ktorý obsahuje veľa malých obrázkov. Je to skvelé na zdieľanie tlačidiel alebo iných obrazových prvkov.

Váš web musí teraz urobiť iba jednu žiadosť, a nie desať. Potom môžete pomocou CSS zvoliť, kde a kde sa budú časti obrázka zobrazovať.

10. Vystrihnite svoj kód

HTML je hustý a ťažký. Je to tiež neuveriteľné opakujúce sa. CSS je o niečo efektívnejší, ale veľa z nich je nadbytočných.

Je čas prejsť si kódom pomocou jemného hrebeňa na zuby a zbaviť sa všetkých nepotrebných kúskov.

Ak používate šablónu z WordPress, Tumblr atď., Potom je pravdepodobne veľa kódov, ktoré nepoužívate. Tieto šablóny sú nakonfigurované tak, aby vám poskytli veľa možností funkčnosti. Väčšina z nás však nepotrebuje všetko.

11. Odinštalujte nepotrebné doplnky (WordPress)

Postupom času som experimentoval s mnohými tonami doplnkov. Mnohokrát ich však zabudneme odinštalovať.

Každý doplnok predstavuje inú požiadavku na server. Je to ďalší dôležitý balík, ktorý blokuje váš vysokorýchlostný tunel.

Ak ho nepoužívate, vypnite ho.

12. Znížte presmerovania

Pri každom presmerovaní pôjdu vaše pakety dvakrát tunelom hore a dole. Ak to nepotrebujete, nepoužívajte na svojich webových stránkach presmerovania.

3. časť: Bonusové doplnky

13. Znížte počet vyhľadávaní DNS

Stále neexistuje žiadna časť procesu, o ktorej sme nehovorili. Stáva sa to hneď od začiatku.

Predtým, ako prehliadač začne konverzáciu so serverom, musí zistiť umiestnenie servera (Nájdenie jeho adresy IP). Je to ako hľadať číslo servera v telefónnom zozname. Trvá to trochu času. (Zvyčajne 20 - 120 milisekúnd).

Trvá to ešte dlhšie, ak je k vášmu webu priradených viac názvov domén. Bežné príklady zahŕňajú: blog.yourwebsite.com alebo ďalšie domény pre obrázky, šablóny štýlov a objekty flash.

Ak to váš prehliadač musí urobiť päťkrát, môžete stratiť pol sekundy. Udržujte ho v čo najmenšom počte oblastí.

14. Ukladanie prehliadača do medzipamäte

Predstavte si, aké rýchle by to bolo, keby si váš prehliadač uchoval kópiu všetkých súborov na webe. Takto nebudete musieť zakaždým kontaktovať server. Mohlo ich načítať iba z pamäte.

To je to, čo je cache. Znamená to, že váš prehliadač si web „pamätá“. Keď ho nahráte druhýkrát, je to veľmi rýchle.

Uf! Toto bol dlhší príspevok ako obvykle, ale myslím si, že to stálo za to.

Teraz viete všetko, čo potrebujete vedieť o tom, ako urobiť váš web rýchlym bleskom. Tieto triky vám môžu ušetriť sekundu rýchlosti načítania.

To znamená šťastných návštevníkov. A znamená to viac predaja.