A GTmetrix sebességmérő eszköz használata + Javítani kell a GTmetrix oldalsebességi pontszámát a WordPressen

A GTmetrix sebességmérő eszköz használata + Javítani kell a GTmetrix oldalsebességi pontszámát a WordPressen

A GTmetrix sebességmérő eszköz használata + Javítani kell a GTmetrix oldalsebességi pontszámát a WordPressen
СОДЕРЖАНИЕ
02 июня 2020

Ha javítani szeretné WordPress-webhelyének teljesítményét, akkor tudnia kell, hogy jelenleg hol tartózkodik. A GTmetrix sebességmérő eszköz ehhez segít.


A GTmetrix segítségével beillesztheti a webhely URL-jét, és a GTmetrix visszateszi a jelenlegi teljesítménymutatókat, pontszámokat, ajánlásokat és elemző eszközöket, amelyek segítenek optimalizálni a webhely teljesítményét.

De ezekben a jelentésekben sok információ található, így hogyan lehetne a legtöbbet kiaknázni webhelyének felgyorsítása érdekében?

Erre fogunk kitérni a GTmetrix sebesség-teszt bemutatójában. Ebben a bejegyzésben:

  • ✅ Vedd át mindent, amit a GTmetrix teljesítmény eszköz kínál
  • ✅ Mondja meg, hogyan lehetne javítani a GTmetrix pontszámait (és hogy mindenekelőtt milyen hangsúlyt kell fektetni ezekre a pontszámokra)
  • ✅ Mutassa meg néhány fejlett elemző eszköz, például a vízesés elemzését

A GTmetrix sebességmérő eszköz használata

Alapvető információk és a GTmetrix GYIK

Mielőtt belekeverednénk a szemtelen szembe, nézzünk át néhány alapvető információt és kérdést arról, hogy mit kínál a GTmetrix és hogyan működik.

Mit kínál a GTmetrix sebességteszt??

A GTmetrix sebességteszt többféle módon segít felmérni webhelyének teljesítményét.

Magas szinten lehetővé teszi, hogy megnézze, mennyi ideig tart a webhelye betöltése.

De ez aztán segít annak elemzésében is, hogy webhelye miért töltődik be ilyen módon, és hogyan lehetne javítani. E célból:

  • Osztályozza a webhelyet két különböző mutató alapján – Google PageSpeed ​​és YSlow.
  • Vízesési diagramot és időzítési elemzést nyújt hogy láthassa, hogy az egyes kérelmek hogyan töltődnek be és hol vannak a szűk keresztmetszetek.
  • Videofelvételeket készít így láthatja, hogy webhelye hogyan töltődik fel a látogatók számára.
  • Naplózza a korábbi teszt eredményeit az elmúlt 30 nap során, így elemezni tudja, hogyan változik webhelyének teljesítménye az idő múlásával.

Honnan származnak a GTmetrix pontszámok??

A GTmetrixnek nincs saját pontozási mechanizmusa. Ehelyett két harmadik féltől származó módszerrel hozza létre pontszámait:

  • Google PageSpeed – ezek 26 különböző szabályból állnak. Minden szabály megkapja a saját pontszámát, és eltérően súlyozzák. Az összesített pontszám az, ahonnan származik a teljes PageSpeed ​​pontszám.
  • YSlow – A YSlow egy nyílt forráskódú projekt a Yahoo-tól (emlékszel a Yahoo-ra?), Amely 19 különböző szabályok alapján osztályozza az Ön webhelyét. Csakúgy, mint a PageSpeed, az általános pontszáma az összes egyedi szabály súlyozott eredményéből származik.

Fontosak-e a GTmetrix eredmények??

igen és nem.

Itt van a "Igen" rész:

Figyelembe kell venni a GTmetrix pontszámait, mivel az alacsony pontszámok valószínűleg azt jelentik, hogy nem hajtott végre néhány, a front-end teljesítményére vonatkozó bevált gyakorlatot.

De itt van a "Nem" rész:

A látogatókat nem érdekli a GTmetrix pontszáma – törődnek azzal, meddig tart az Ön webhelyének betöltése és interaktívvá válása.

Sokkal jobb, ha van egy olyan WordPress webhely, amely két másodperc alatt töltődik be, és a 70-es években rendelkezik GTmetrix pontszámmal, mint egy olyan WordPress webhely, amelynek betöltése négy másodpercig tart, de tökéletes 100-as pontszámot jelent.

Alapvetően figyeljen a pontszámokra, mert ezek gyors becslést adnak webhelyének optimalizálásáról, de ne aggódjon rájuk, mert a nap végén az egyetlen fontos, hogy milyen gyorsan töltődik be webhelye.

Még mindig gyorsan tölthető be egy alacsony GTmetrix pontszámú webhely?

Igen – teljesen.

Íme az egyik fő ok, amiért:

Mindkét GTmetrix pontszám (PageSpeed ​​és YSlow) elsősorban a front-end teljesítmény optimalizálásával foglalkozik, például azzal, hogy a képek hogyan optimalizáltak, és hogyan néz ki a kódod.

Ugyanakkor a teljesítmény optimalizálása a háttéren is ugyanolyan fontos, ha nem is több. Ez kiterjed olyan kérdésekre, mint például a host-szolgáltató és a szerver architektúrája (például az Nginx vs Apache használata).

Ha a háttérképesség szörnyű, akkor webhelye lassan tölthető be, még akkor is, ha tökéletes GTmetrix pontszáma van. Hasonlóképpen, ha kiváló WordPress-tárhelyt választ, akkor a webhely továbbra is elég gyorsan betöltődik, még akkor is, ha alacsony a GTmetrix pontszáma.

A legjobb eredmény elérése érdekében optimalizálnia kell mind a front-end, mind a back-end teljesítményét.

Futtathatok egy GTmetrix mobilsebesség-tesztet?

Igen! Nagyon ajánlott az asztali és a mobil teljesítményének tesztelése is, mivel manapság a legtöbb ember a mobil eszközökön böngészi az internetet.

Alapvetően annak a megértése, hogy webhelye hogyan töltődik fel az asztali látogatók számára, csak a fele a harcnak – azt is meg akarja próbálni, hogy milyen ez a mobil eszközökhöz..

A mobil eszközök eltérő mintázatúak lehetnek. Például egy alacsony fogyasztású mobiltelefon több időt vesz igénybe a JavaScript megjelenítéséhez, mint akár egy olcsó asztali számítógép is. Tehát ha webhelyének JavaScripte nehéz, lehet, hogy nagyobb hatása van a mobiloldalak betöltési idejére, mint az asztali betöltési idők.

Ezt nem fogja tudni, hacsak kifejezetten nem teszteli a mobil teljesítményét.

A GTmetrix mobilsebesség-tesztek futtatásához regisztrálnia kell egy ingyenes fiókot – erről egy másodperc alatt bővebben.

A GTmetrix sebesség-teszt futtatása

A GTmetrix tesztjének legegyszerűbb módja az igazságosság látogasson el a GTmetrix honlapjára, csatlakoztassa webhelyének URL-jét, és kattintson a gombra Tesztelje webhelyét:

A GTmetrix névtelen tesztje

Azt javaslom azonban, hogy ennek helyett regisztráljon a ingyenes A GTmetrix fiók egy teszt futtatása előtt.

A teszt nyilvános verziójával a sebességteszt mindig a következő konfigurációt fogja használni:

  • Teszt a kanadai Vancouverből
  • Chrome böngésző asztalon
  • Címke nélküli csatlakozás

De ha regisztrál a ingyenes fiókkal, megváltoztathatja ezeket a feltételeket, hogy megfeleljen az Ön igényeinek.

Például, ha a legtöbb látogató az USA délnyugati részéről származik, akkor a tesztelési helyet Dallasba, Texasba változtathatja, hogy jobb képet kapjon a célközönség teljesítményéről.

A teszthelyek megváltoztatásán túl itt választhat mobil tesztkészüléket is, vagy megváltoztathatja a kapcsolat sebességét (például lassabb 3G kapcsolat szimulációja a gyors vezetékes kapcsolattel).

Miután regisztrált ingyenes fiókjába, kibővítheti a Elemzési lehetőségek hogy többet konfiguráljon a teszt működéséről:

Speciális tesztkonfigurációs beállítások

Amint a GTmetrix elvégzi a tesztjét az Ön feltételei szerint, visszapattan egy eredményoldalt a következővel:

  • Rövid összefoglaló a tetején, amely tartalmazza a teljesítmény pontszámait és az alapvető oldalakat
  • Részletes eredmények, hat fülre osztva

Összefoglaló eredmények

Menjünk át a hat fülön …

1. PageSpeed ​​fül

Az Weboldalsebesség lap az alapértelmezett aktív lap, amikor egy GTmetrix tesztet futtat. Besorolja webhelyét a Google PageSpeed ​​szabályaival összhangban.

A 26 szabály mindegyikére webhelyének pontszáma 0-100. Ezután a GTmetrix összeadja ezeket a pontszámokat, hogy elkészítse a teljes PageSpeed ​​pontszámot.

A 26 szabály nem egyenletesen súlyozva, így egyesek nagyobb hatással lesznek a teljes pontszámodra, mint mások.

Ha rákattint a nyílra az egyik szabály kibővítéséhez, további részleteket lát a webhelyén a problémákat okozó elemekről:

GTmetrix sebesség teszt PageSpeed ​​fül

Íme néhány a leggyakoribb PageSpeed ​​probléma és hogyan javíthatja azt a pontszám javítása érdekében …

Optimalizálja a képeket

A képek tömörítése lehetővé teszi, hogy a fájlméreteket nullával vagy minimális minőségromlással csökkentsék, a tömörítési algoritmustól függően.

A WordPress webhelyén található összes kép automatikus optimalizálásához és tömörítéséhez használhatja az Optimole plugin:


Képoptimalizálás és lusta terhelés: Optimole Képoptimalizálás & Lazy Load – készítette Optimole

Szerzői): Optimole

Aktuális változat: 2.3.1

Utolsó frissítés: 2020. április 21

optimole-wp.zip


96% Értékelések


50.000 + telepítések


WP 4.7 + szükséges

Használja ki a böngésző gyorsítótárazását

A böngésző gyorsítótárazása felgyorsítja a betöltési időket, ha bizonyos statikus eszközöket tárol a látogatók helyi böngészőiben. Ez azt jelenti, hogy a későbbi látogatások során a látogatók böngészői kiszolgálhatják ezeket az eszközöket a látogatók helyi számítógépéből, ahelyett, hogy minden egyes látogatáskor letöltenék azokat..

Számos WordPress gyorsítótárazási bővítmény már kínál böngésző gyorsítótárazást, beleértve a WP Super Cache-t, a WP Rocket-et és a WP leggyorsabb gyorsítótárat..

Szolgáljon méretezett képeket

A méretezött kép olyan kép, amely tökéletes méretű ahhoz a mérethez, amelyhez használja – van egy teljes bejegyzés a skálázott képek koncepciójáról a ThemeIsle-n.

A méretezett képek kiszolgálásának egyszerû módja a WordPress-en is az Optimole plugin – automatikusan elvégzi a munkát az Ön számára, így a képei mindig tökéletesen méretezhetők, függetlenül attól, hogy milyen eszközt használ a látogató.

Adja meg a kép méretét

Ez magában foglalja a HTML-t – meg akarja határozni a kép tényleges szélességét és magasságát, amikor beágyazza.

Például…

Nem optimális:

optimális:

A WordPress ezt alapértelmezés szerint megteszi, amikor képeket illeszt be a szerkesztőbe, de érdemes feltétlenül megadnia a máshol (például egy pluginben) használt képeket..

Finomítsa a HTML, CSS és a JavaScriptet

Ez technikailag három különálló szabály, de összerakom őket, mert az alapkoncepció ugyanaz.

A minimalizálás során a szükségtelen karaktereket eltávolítják a webhely kódjából, annak funkcionalitása megváltoztatása nélkül. Például a fehér terek és a vonalszakadások eltávolítása.

Néhány WordPress teljesítmény-bővítmény, például WP rakéta, magában foglalja a finomítást. Vagy használhatja a ingyenes Autoptimize plugin a webhely kódjának finomításához.


Autoptimize Autoptimize

Szerzői): Frank Goossens (futtta)

Aktuális változat: 2.7.2

Utolsó frissítés: 2020. május 21

autoptimize.2.7.2.zip


94% Értékelések


1.000.000 + telepítések


WP 4.9 + szükséges

Kerülje a céloldal átirányítását

Az URL átirányítások hasznosak a forgalom irányításához. El kell kerülni azonban azok használatát, ha egyáltalán lehetséges, mert ezek lelassítják webhelyét.

Ennek kijavításához győződjön meg arról, hogy az összes belső link közvetlenül az aktuális URL-re irányul – ne támaszkodjon átirányításokra a dolgok javításához. Például, ha automatikusan átirányítja a http://yoursite.com webhelyet a https://yoursite.com webhelyre az SSL használatának kényszerítése érdekében, ügyeljen arra, hogy mindig kapcsolódjon a webhely HTTPS verziójához, hogy elkerülje a felesleges átirányításokat..

Halasztja a JavaScript elemzését

Amikor az oldal betöltési időiről beszél, az a webhely láthatóságának gyorsasága ugyanolyan, ha nem is nagyobb, mint a teljes webhely betöltésének időtartama..

A JavaScript lelassíthatja ezt, ha arra kényszeríti a látogatókat, hogy szüneteltessék az oldal megjelenítését a JavaScript letöltése és elemzése céljából. Ez az oka annak, amit gyakran render-blokkoló JavaScriptnek hívnak.

Ennek javításához meg kell próbálnia elhalasztani a JavaScript elemzését, hogy webhelye csak akkor kezdjen betölteni / elemezni ezt a JavaScriptet, miután a webhely látható része már betöltődött..

A WP Rocket tartalmaz egy beépített eszközt, amely segítséget nyújt ehhez. Vagy használhatja a ingyenes Async JavaScript plugin, amely az Autoptimize plugin ugyanazon fejlesztőjétől származik.


Async JavaScript

Szerzői): Frank Goossens (futtta)

Aktuális változat: 2.20.03.01

Utolsó frissítés: 2020. március 1

async-javascript.2.20.03.01.zip


92% Értékelések


100.000 + telepítések


WP 4.6 + szükséges

Kombinálja a képeket CSS-ívek segítségével

Ez egy fejlett technika, amely lehetővé teszi több képfájl egyesítését egyetlen fájlba a CSS használatával. Ez lehetővé teszi az oldal betöltéséhez szükséges HTTP-kérelmek számának csökkentését.

Az összes képhez ne használjon CSS-spriteket, mert ezek negatív SEO és akadálymentességre vonatkoznak (mert a képet már nem lehet hozzáadni). Ehelyett a CSS-spriteket kizárólag dekoratív képekhez – például az ügyfelek logóinak vagy a társadalmi megosztás ikonjainak – kell használni.

Sajnos nincs olyan plugin, amely automatikusan beállítaná a CSS-spriteket – ezt manuálisan kell elvégeznie. Itt van, hogyan.

A tömörítés engedélyezése

A képek tömörítéséről már korábban beszéltünk, de erről "összenyomás" arra utal, hogy a webhely összes fájlját tömöríti szerver szinten, a Gzip tömörítésnek nevezett valami segítségével.

A Gzip tömörítés átlagosan kb. 70% -kal csökkentheti webhelye fájljainak méretét.

Számos WordPress teljesítmény-bővítmény segíthet lehetővé tenni a Gzip tömörítését, beleértve a WP Rocket, a WP Super Cache és a WP leggyorsabb gyorsítótárat. Vagy használhatja az egyszerű és ingyenes szolgáltatást is Engedélyezze a Gzip Compression plugin-ot egy dedikált megoldásért.


Engedélyezze a Gzip-tömörítést

Szerzői): Moki-Moki Ios

Aktuális változat: 1.0.3

Utolsó frissítés: 2020. május 8

enable-gzip-compression.1.0.3.zip


86% Értékelések


20.000 + telepítések


3.0.1Requires

2. YSlow fül

Az YSlow pontszáma hasonló megközelítést követi a PageSpeed ​​pontszámával, csak egy másik szabálykészletet használ a teszteléshez. A lista egy kicsit kisebb – a GTmetrix YSlow lapja mindössze 19 szabályt tartalmaz.

Mint a PageSpeed ​​pontszáma, minden szabály megkapja a saját pontszámát, és az általános pontszáma ezen pontok súlyozott átlagán alapul.

GTmetrix sebességteszt YSlow fül

Íme néhány a leggyakoribb ajánlások, amelyekkel szembesülni fog …

Használjon tartalomszolgáltató hálózatot (CDN)

A CDN felgyorsítja webhelyének betöltési idejét azáltal, hogy webhelyének statikus tartalmát a világ minden tájáról származó kiszolgálók hálózatából szállítja.. Tudjon meg többet ebben a bejegyzésben.

A képeket CDN-n keresztül szolgálhatja ki az ingyenes Optimole plugin. CDN használata az összes webhely statikus fájljához, CloudFlare szintén jó lehetőség.

A legnépszerűbb CDN szolgáltatások összehasonlítása ��

Csökkentse a JavaScript-et és a CSS-t

Ezt már a PageSpeed ​​szakaszban ismertettem. Kiszűkítheti CSS-jét és JavaScript-ét egy külön beépülő modullal, például az Automatikus optimalizálás. Vagy sok WordPress teljesítmény-bővítmény magában foglalja a saját kicsinyítési funkcióit.

Tömörítse az alkatrészeket

Ez ugyanaz, mint a "A tömörítés engedélyezése" ajánlást a PageSpeed ​​lapon. Javíthatja úgy, hogy engedélyezi a Gzip tömörítést.

Számos WordPress gyorsítótárazási plugin tartalmaz Gzip tömörítési szolgáltatást. Vagy használhatja a dedikált készüléket Engedélyezze a Gzip Compression plugin-ot.

Kerülje az URL-átirányításokat

Ez ugyanaz, mint a "Kerülje a céloldal átirányítását" a PageSpeedben.

Próbáljon mindig hivatkozni egy oldal jelenlegi URL-jére, és ne az átirányításokra támaszkodva támogassa az embereket a megfelelő célállomásra.

Csökkentse a DNS-kereséseket

A látogatók böngészőinek DNS-keresést kell végrehajtaniuk minden olyan domain számára, amelyből az Ön webhelyén van tartalom.

Mindig legalább egy DNS-kereséssel rendelkezik a saját webhelyén. De ha külső szolgáltatásokat használ a webhelyén (például a Google Fonts vagy a Google Analytics követő szkript), ezek további DNS-kereséseket eredményeznek.

Két megoldás a következő:

  • Távolítsa el a külső szolgáltatást, ha szükségtelen
  • Próbálkozzon a tartalom önálló gazdálkodásával, például a Google Fonts tárolásával a saját szerveren, ahelyett, hogy támaszkodna a Google Fonts CDN-re. Ez a plugin segíthet.

Kevesebb HTTP-kérést tegyen

A HTTP kéréseket részletesebben a Vízesés fül szakasz (ez a következő).

3. Vízesés fül

Az Vízesés lap egy kicsit haladó, de nagyon hasznos eszköz annak megértéséhez, hogy webhelyének különböző részei hogyan töltődnek be, és hol lehetnek kis szűk keresztmetszetek, amelyek lelassítják az egész webhelyet.

Amikor kinyitja a Vízesés lapon megjelenik az ezen az oldalon található összes HTTP-kérés listája (ezek a "kéri" a GTmetrix eredmények összefoglalójából).

Az oldalon minden objektum külön HTTP kérés. Például:

  • Mindegyik kép egy HTTP kérés (kivéve, ha CSS sprites-t használ!)
  • Minden CSS vagy JavaScript fájl egy HTTP kérés
  • Az Ön által betöltött külső szkriptek (például a Google Analytics) szintén legalább egy HTTP kérés lesznek
  • Stb.

Minden egyenlő, a kevesebb HTTP-kérés általában gyorsabban betöltődő webhelyet jelent.

Ezenkívül, amint látni fogja a lista áttekintését, minden HTTP kérés eltérő időt vesz igénybe a betöltéshez, és más sorrendben töltődik be (egyesek még másokat is blokkolnak) – tehát, ha megtalálhatja és eltávolíthatja a lassú töltést A HTTP kérések nagymértékben megváltoztathatják webhelyének betöltési idejét.

Láthatja az egyes HTTP-kérelmek részleteit, amikor az egérmutatót fölé húzza. Például ez a marokkói csicseriborsó-kép 102,4 ms-ot töltött be a betöltésbe:

A GTmetrix sebesség teszt vízesés elemzése

A tetején található szűrő- és keresési lehetőségeket is használhatja, hogy konkrét HTTP-kéréseket találjon. Például, ha wp-content / plugins keres, megtalálja azokat a HTTP kéréseket, amelyeket a WordPress webhely pluginjai adtak hozzá..

Még tovább áshat is, hogy konkrét bővítményekről kéréseket találjon. Például a wp-content / plugins / elementor keresésével megjelenik az összes kérés az Elementor oldalkészítő plugin:

A vízesés elemzésének keresése

Ha úgy találja, hogy egy plugin sok lassan betöltő HTTP kérést ad, és ez nem jár sok előnnyel, érdemes lehet fontolóra vennie annak eltávolítását és egy jobb alternatíva megtalálását..

4. Időzítés, Videó és Előzmények lapok

A GTmetrix sebességteszt utolsó három lapját csoportosítom, mert valószínűleg nem fogja ezeket gyakran használni, és nem hiszem, hogy mély lebontást igényelnek.

időzítések

Az időzítések lapon részletesebb információt nyújt arról, hogy mennyi ideig tart a különböző betöltési idő mutatók elérése. Ez az információ megtalálható a Vízesés diagramban is – időzítések fül csak megkönnyíti a megjelenítést.

Ha az egyik mutató fölé mutat, a GTmetrix az alábbiakban bemutat egy leírást, amely megmondja, mit jelent:

Időzítés fül

Videó

Ha engedélyezte az oldalak betöltését a teszt elindításakor, akkor ezeket a videókat a Videó lap.

Ezenkívül lecsökkentheti azokat az eredeti sebesség 1/4-ig is, hogy részletesebben láthassa a dolgokat.

A videók akkor hasznosak, mert lehetővé teszik, hogy ne csak a webhely betöltésekor, hanem a webhely betöltésének módjáról is láthassa. Például a webhely mely részei láthatók először? Vannak furcsa hibák a betöltés közben, mint a "a stílustalan tartalom villogása"? Ezek hasznos tudnivalók a webhely teljesítményének optimalizálásakor.

Történelem

Végül, ha egy oldalt többször tesztel, akkor a Történelem lapon megtekintheti a korábbi tesztek eredményeit, így elemezheti, hogyan változtak a dolgok az idő múlásával.

Az oldal összes tesztet tárolja az elmúlt 30 napban. Ezt követően a korábbi teszteredményeket törlik.

Például, ha néhány javítást végez a GTmetrix sebesség-teszt pontszámainak javítása érdekében, láthatja, hogy ezek a változások hogyan válnak valódi oldalbetöltési idő-javulásokká:

A GTmetrix sebességteszt korábbi eredményei

Hozz többet a GTmetrix sebességtesztből

Ha a legtöbbet szeretné kihozni a GTmetrix sebességmérő eszközből, akkor lépjen túl az összefoglaló mezőből, és alaposan beleolvassa az alábbi részleteket..

Nem akarod, hogy túlságosan bekapcsolódjanak a GTmetrix teljesítményére, de a pontszámokat tartalmazó javaslatok hasznos útmutatást nyújtanak azokon a területeken, ahol esetleg hiányzik a webhely front-end teljesítményének optimalizálása..

Ezen felül a Vízesés a lap egy nagyszerű eszköz a webhely teljesítményének bizonyos aspektusainak átgondolására, például olyan képek, szkriptek vagy bővítmények keresésére, amelyeknek rendkívüli hatása van a webhely oldalának betöltési idejére.

Ha részletesebben szeretne belemerülni a WordPress teljesítményébe, akkor nézze meg a 11 módszerből álló gyűjteményünket a WordPress felgyorsításához.

Van még mindig kérdése, hogyan tesztelheti webhelyét a GTmetrix segítségével? Hagyj egy megjegyzést, és megpróbálunk segíteni.

Ne felejtsd el csatlakozni a WordPress-webhely felgyorsításának összeomlási tanfolyamához. Néhány egyszerű javítással akár 50-80% -kal csökkentheti a betöltési időt:

Elrendezés és előadás: K Karol.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Это интересно
    Adblock
    detector