Követendő irányelvek a weboldal felgyorsítása terén
Miután tesztelte webhelye sebességét, elkezdheti optimalizálni azt. Rengeteg különböző módja van annak, hogy weboldalad gyorsabban működjön, és mi összeállítottuk a leghatékonyabbak listáját.
1. Használjon tartalomszolgáltató hálózatot (CDN)
A tartalomkiszállítási hálózat különböző földrajzi helyeken elosztott webkiszolgálók összessége, amelyek a végfelhasználók számára a webes tartalmat a tartózkodási helyükre való tekintettel biztosítják. Ha a webhelyet egyetlen szerveren helyezi el, akkor az összes felhasználói kérés ugyanarra a hardverre érkezik. Emiatt megnő az egyes kérések feldolgozásához szükséges idő. Ráadásul a betöltési idő megnő, ha a felhasználók fizikailag távol vannak a szervertől. A CDN segítségével a felhasználói kéréseket a legközelebbi szerverre irányítjuk át. Ennek eredményeképpen a tartalom gyorsabban jut el a felhasználóhoz, és a webhely gyorsabban működik. Ez egy meglehetősen költséges, de meglehetősen hatékony módja a betöltési idő optimalizálásának.
2. Helyezze át weboldalát egy jobb tárhelyszolgáltatóhoz
Három lehetséges tárhelytípus létezik:
Megosztott tárhely
Virtuális privát szerver (VPS) tárhely
Dedikált szerver
A legnépszerűbb tárhelytípus, amelyet az egész világon használnak, a megosztott tárhely. Ez a legolcsóbb módja annak, hogy webhelye rövid idő alatt és alacsony díjért online legyen. Lényeges, hogy a jobb optimalizálás érdekében gyors webtárhelyet válasszon. A megosztott tárhely esetében megosztja a CPU-t, a lemezterületet és a RAM-ot más webhelyekkel, amelyek szintén ezt a szervert használják. Ez a fő oka annak, hogy a megosztott tárhely nem olyan gyors, mint a VPS vagy a dedikált szerver.
A virtuális privát szerverek és a dedikált szerverek sokkal gyorsabbak. A VPS több szervert használ a tartalom elosztásához. A VPS használatával megosztja a szervert a többi felhasználóval, és a virtuális szerver saját részével rendelkezik, ahol a konfigurációi nem befolyásolják a többi ügyfelet. Ha webhelye átlagos forgalmat bonyolít, vagy olyan e-kereskedelmi webhelye van, amelynek forgalma bizonyos időszakokban megugrik, a VPS lesz az optimális megoldás az Ön számára.
A legdrágább hosting lehetőség a dedikált szerver használata, amely lehet a saját fizikai szervere. Ebben az esetben szerverbérleti díjat fizet, és felbérel egy rendszergazdát a karbantartására.
Egy másik megközelítés a dedikált felhőerőforrás bérlése az AWS, a Microsoft Azure, a Google vagy más nyilvános felhőszolgáltatótól. Mindkét megközelítés kombinálható hibrid felhőben is, amelyet nemrég tárgyaltunk. A dedikált szerverek esetében minden erőforrás csak Önt illeti meg, és Ön kapja meg a teljes irányítást. A felhőinfrastruktúrák számos csomag keretében korlátlan és igény szerinti skálázhatóságot is biztosíthatnak.
A szervermentes architektúra egy újabb lehetőség, amely teljesen kiküszöböli a karbantartási és szerverbeállítási eljárásokat. Fontolja meg a szervermentes architektúra sajátosságait és előnyeit tárgyaló külön cikkünk elolvasását.
3. Optimalizálja a képek méretét a weboldalán
Mindenki szereti a szemet gyönyörködtető képeket. A sikeres e-kereskedelmi webhelyek esetében a képek létfontosságúak. A sok fotó, kép, grafika a termékoldalakon javítja az elkötelezettséget. A képek használatának negatívuma, hogy általában nagyméretű fájlok, amelyek lelassítják a webhelyet.
A képméret csökkentésének legjobb módja a képminőség romlása nélkül a képek tömörítése olyan eszközökkel, mint az ImageOptim, a JPEGmini vagy a Kraken. Az eljárás egy kis időt vehet igénybe, de megéri. A képméret csökkentésének másik módja a HTML reszponzív képek <secret> és <size> attribútumok használata, amelyek a képméretet a felhasználó megjelenítési tulajdonságai alapján állítják be.
4. Csökkentse a bővítmények számát
A pluginok minden weboldal közös összetevői. Harmadik felek által javasolt speciális funkciókat adnak hozzá. Sajnos minél több bővítményt telepítenek, annál több erőforrásra van szükség a futtatásukhoz. Ennek eredményeképpen a webhely lassabban működik, és biztonsági problémák is jelentkezhetnek. Az idő múlásával a bővítmények száma növekszik, míg néhányat közülük már nem feltétlenül használnak. Javasoljuk, hogy ellenőrizze az összes telepített bővítményt, és törölje a feleslegeseket. Először futtassa le a teljesítményteszteket az oldalán, hogy megtudja, mely bővítmények lassítják a webhelyét. A weboldal sebessége nem csak a telepített bővítmények számától, hanem azok minőségétől is függ. Próbáld meg elkerülni azokat a bővítményeket, amelyek sok szkriptet és stílust töltenek be, vagy sok adatbázis-lekérdezést generálnak. A legjobb megoldás, ha csak a szükségeseket tartja meg, és gondoskodik azok naprakészen tartásáról.
5. A JavaScript és CSS fájlok számának és méretének minimalizálása
Ha webhelye sok JavaScript- és CSS-fájlt tartalmaz, az nagyszámú HTTP-kérést eredményez, amikor a webhely látogatói el akarnak érni bizonyos fájlokat. Ezeket a kéréseket a látogató böngészője egyenként kezeli, és lelassítja a webhely működését. Ha csökkenti a JavaScript- és CSS-fájlok számát, az kétségtelenül felgyorsítja a webhelyét. Próbáljon meg minden JavaScriptet egy csoportba gyűjteni, és tegyen így az összes CSS-fájl esetében is. Ez csökkenteni fogja a HTTP-kérések teljes számát. Rengeteg eszköz létezik a HTML-, CSS- és JavaScript-fájlok gyors kicsinyítésére. Használhatja például a WillPeavy, a Script Minifier vagy a Grunt eszközöket.
6. Használja a webhely gyorsítótárazását
Abban az esetben, ha egyszerre sok felhasználó éri el az oldalt, a szerverek lassan dolgoznak, és több időre van szükségük ahhoz, hogy minden egyes felhasználónak eljuttassák a weboldalt. A gyorsítótárazással a weboldal aktuális verzióját tárolja a tárhelyen, és ezt a verziót mutatja be, amíg a weboldal frissül. Ez azt jelenti, hogy a weboldal nem renderelődik újra és újra minden egyes felhasználó számára. a gyorsítótárazott weboldalnak nem kell minden alkalommal adatbázis-kéréseket küldenie.
A weboldalak gyorsítótárazásának megközelítései attól függnek, hogy milyen platformon fejlesztették a weboldalát. A WordPress esetében például a következő bővítményeket használhatja: W3 Total Cache vagy W3 Super Cache. Ha VPS-t vagy dedikált szervert használ, akkor az általános beállítások között is beállíthatja a gyorsítótárazást. Megosztott szerver esetén a webhely gyorsítótárazása általában nem áll rendelkezésre.
7. Gzip tömörítés bevezetése
A Gzip tömörítés hatékony módja a fájlok méretének csökkentésének. Minimalizálja a HTTP-kérelmeket és csökkenti a kiszolgáló válaszidejét. A Gzip tömöríti a fájlokat, mielőtt elküldi őket a böngészőnek. A felhasználói oldalon a böngésző kicsomagolja a fájlokat, és megjeleníti a tartalmukat. Ez a módszer a webhelyén található összes fájl esetében működhet. A Gzip-et néhány sornyi kód hozzáadásával vagy a gzip nevű segédprogramon keresztül engedélyezheti weboldalán.
8. Adatbázis-optimalizálás a CMS-ben
Az adatbázis-optimalizálás a teljesítmény növelésének hatékony módja. Ha összetett bővítményekkel teletömött tartalomkezelő rendszert (CMS) használ, az adatbázis mérete megnő, és a webhelye lassabban működik. A WordPress CMS például kommenteket, blogbejegyzéseket és egyéb információkat tárol, amelyek sok adattárolót igényelnek. Minden CMS saját optimalizálási intézkedéseket igényel, és számos speciális bővítményt is tartalmaz. A WordPress esetében például érdemes megfontolni a WP-Optimize-t.
9. Csökkentse a webes betűtípusok használatát
A webes betűtípusok nagyon népszerűvé váltak a weboldalak tervezésében. Sajnos a webes betűtípusok használata negatív hatással van az oldal megjelenítési sebességére. A webes betűtípusok extra HTTP-kéréseket adnak a külső erőforrásokhoz. A következő intézkedésekkel csökkentheti a webes betűtípusok forgalmát:
Használjon modern formátumokat WOFF2 a modern böngészőkhöz;
Csak azokat a karakterkészleteket tartalmazza, amelyeket az oldalon használnak;
Csak a szükséges stílusokat válassza ki.
10. Ismerje fel a 404-es hibákat
A 404-es hiba azt jelenti, hogy „Az oldal nem található”. Ezt az üzenetet a tárhely szolgáltatja a böngészőknek vagy a keresőmotoroknak, amikor egy oldal elért tartalma már nem létezik. A 404-es hiba észleléséhez és kijavításához hibaérzékelő eszközöket és bővítményeket használhat. Mint említettük, a további bővítmények negatívan befolyásolhatják a webhely sebességét, ezért javasoljuk, hogy az erőforrást külső eszközökkel futtassa a hiba észleléséhez. Ilyen például a Xenu’s Link Sleuth, a Google Webmaster Tools (GWT) és a 404 Redirected Plugin For WordPress.
Miután észlelte az összes 404-es hibát, fel kell mérnie az általuk generált forgalmat. Ha ezek a holt linkek már nem hoznak látogatásokat, és így nem fogyasztják a szerver erőforrását, akkor nyugodtan hagyhatja őket úgy, ahogy vannak. Ha ezekre az oldalakra még mindig érkezik némi forgalom, fontolja meg a külső linkek átirányításának beállítását, és a belső linkek linkcímének javítását.
11. Csökkentse az átirányításokat
A webhely átirányításai további HTTP-kérelmeket generálnak, amelyek negatívan befolyásolják a teljesítményt. Javasoljuk, hogy ezeket a lehető legkevesebbre csökkentsük, vagy teljesen megszüntessük. Először is, egy webhelyellenőrzés lefuttatásával azonosítsa az oldalán található összes átirányítást. A Screaming Frog segítségével gyorsan azonosíthatja az átirányításokat. Ezután ellenőrizni kell, hogy szükséges célt szolgálnak-e, és csak a kritikusakat kell meghagyni.
12. Használjon prefetching technikákat
Az előhívás az utasítások beolvasását és végrehajtását jelenti, mielőtt a felhasználó kezdeményezné azokat. A technika meglehetősen elterjedt. Akkor működik jól, ha előre látja a felhasználói műveleteket, és például előre betölthet bizonyos tartalmakat vagy linkeket. A modern böngészők általában alapértelmezésben lehetővé teszik az előhívást, mivel feltételezik a felhasználói viselkedési mintákat. A UX szakemberek és mérnökök azonban inkább megértik a felhasználói viselkedést, és „tippeket” adnak a böngészők számára az előhívás munkájához.
Az előretöltésnek három fő típusa van:
DNS-előretöltés. Ez a gyakorlat a domainek IP-címekké történő előzetes feloldását jelenti.
Link-előhívás. Ha biztosak vagyunk abban, hogy a felhasználó egy adott linkre kattintva el fog navigálni valamilyen oldalra, akkor alkalmazhatjuk az előretöltésnek ezt a típusát. A módszer hasznos a stabil felhasználói utazási műveletekhez, például a kosár oldalára való átmenethez, miután egy vagy több elemet hozzáadtak.
Előhívás. Ez a megközelítés egy teljes oldal vagy annak néhány elemének előzetes renderelését jelenti.
Bár az előhívás hatékony, a pontos feltételezésekhez mélyreható felhasználói viselkedéselemzésre van szükség.
Következtetés
Jelenleg egy tipikus felhasználó elvárja, hogy a weboldalak kevesebb mint 3 másodperc múlva töltődjenek be. Ha nem felel meg ennek az elvárási korlátnak, akkor rengeteg webhelyforgalmat és ennek következtében bevételt veszít.
Ezért javasoljuk, hogy alkalmazzon egy egyszerű, de hatékony weboldal sebesség optimalizálási megközelítést:
Ellenőrizze és értékelje a weboldal sikerének kulcstényezőit, figyelembe véve a konverziót, a láthatóságot és a használhatóságot.
Tesztelje jelenlegi weboldalának sebességét, és rangsorolja azokat az oldalakat és funkciókat, amelyek e három tényező tekintetében a legnagyobb figyelmet igénylik.
Kezdje az optimalizálást a sebességet leginkább csökkentő szempontokkal, és összpontosítson azokra az oldalakra, amelyek a leginkább meghatározzák a konverziós sikert.