Background

Labākie rīki mājaslapas ātruma pārbaudei

Majaslapas riki atruma parbaudei featured

Labākie rīki mājaslapas ātruma pārbaudei

Mājaslapas ātrums var būt kritisks faktors tās panākumiem. Ātrāka mājaslapas ielāde var iegūt augstākus SEO rangus, augstākus reklāmguvumu līmeņus, zemāku bounce rate, ilgāku apmeklētāju ilgumu uz vietni, labāku vispārējo lietotāju pieredzi un iesaistīšanos. Tāpēc ir svarīgi izmantot bezmaksas mājaslapas ātruma testa rīkus, lai sasniegtu optimālu veiktspēju.

 

“Google vēlas, lai jūsu vietne tiktu ielādēta mazāk nekā sekundē

Ko var mājaslapas ātruma tests palīdzēt analizēt?

Šeit ir daži no visbiežākajiem veidiem, kā tiek izmantoti mājaslapas ātruma pārbaudes rīki:

  • Skriptu, fontu un spraudņu noteikšana, kas izraisa ielādes laika problēmas (HTML, Javascript, CSS)
  • Pārbaudīt skriptu minimizāciju
  • Lielu attēlu atrašana, kas samazina ielādes ātrumu
  • Nosaka, vai jums ir renderēšanas bloķējošs JavaScript vai CSS
  • Testēšanas Laiks uz Pirmo Baitu (TTFB)
  • Kopējo ielādes laiku, lappušu lielumu un pieprasījumu skaita analīze
  • Pārbaudes rezultāti no dažādām ģeogrāfiskām atrašanās vietām
  • Renderēšanas ātruma pārbaude dažādās pārlūkprogrammās
  • HTTP Headers analīze
  • Satura piegādes tīkla (CDN) veiktspējas mērīšana
  • Pārbauda, vai saturs ir pareizi ielādēts no jūsu CDN

Mājaslapas ātruma jēdzieni

web jedzieni

Pirms veicat mājas lapas ātruma pārbaudi, ir svarīgi saprast dažus jēdzienus, kā šie rīki darbojas, lai varētu labāk analizēt datus un pēc tam atbilstoši optimizēt savu vietni. Var ne tikai pārbaudīt web hostinga ātrumu, bet arī izmērīt savu CDN veiktspēju.

Laiks uz pirmo baitu (TTFB)

Laiks līdz pirmajam baitam (TTFB) ir web servera atsaucības mērījums. Būtībā tas ir laiks, kad jūsu pārlūkprogramma sāk saņemt informāciju pēc tam, kad tā to ir pieprasījusi no servera. Izmantojot CDN, varat krasi samazināt slodzes ietekmi uz izcelsmes serveri, kas savukārt palīdzēs samazināt TTFB.

Renderēšanas bloķējošs Javascript un CSS

Renderēšanas bloķēšana attiecas uz Javascript un CSS, kas jūsu lapu neļauj ielādēt, cik ātri vien iespējams.

JavaScript

Google iesaka noņemt vai apturēt javascript, kas traucē ielādēt above the fold saturu jūsu mājaslapā. Šeit ir lieliska pamācība, kā pareizi apturēt javascript ielādi.

Piemērs, kā atlikt javascript, ievietojot to tieši pirms <body> taga.

function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "defer.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;

CSS

Pēc tam jūs arī vēlaties optimizēt savu CSS piegādi, lai tas neizraisītu lapas ielādes aizkavēšanos. Lūk, daži veidi, kā to novērst.

  1. Pareizi sauciet jūsu CSS failus
  2. Samaziniet CSS failu apjomu
  3. Izmantojat mazāk CSS kopumā

Lūk, lielisks raksts par renderēšanas-bloķēšanas CSS ar Iļju Grigoriku, web veiktspējas inženieri Google.

“CSS ir renderēšanas bloķēšanas resurss, iegūstiet to klientam pēc iespējas ātrāk un pēc iespējas ātrāk, lai optimizētu laiku pirmajai renderēšanai!”

Resursu samazināšana

Resursu samazināšana nozīmē nevajadzīgo rakstzīmju noņemšanu no HTML, Javascript un CSS, kas nav nepieciešamas, piemēram:

  • Neredzamas rakstzīmes
  •  Jaunas rindas rakstzīmes
  •  Komentāri
  •  Bloku norobežotāji

Tas paātrina ielādes laikus, jo tas samazina koda apjomu, kas jāpieprasa no servera. Lai noņemtu visas nevajadzīgās rakstzīmes, varat izmantot tādu rīku kā Dan’s CSS un Javascript Minify. Vai, ja darbojaties WordPress, varat izmantot spraudni kā Autoptimize, kas jums palīdzēs samazināt visus HTML, Javascript un CSS resursus.

HTTP pieprasījumi

Kad pārlūkprogramma iegūst datus no servera, tā dara to izmantojot HTTP (Hypertext Transfer Protocol). Tas ir pieprasījums/atbilde starp klientu un hostu. Jo vairāk HTTP pieprasījumu  tiks sūtīti jūsu mājaslapai, tas padarīs  to lēnāku.

Ir daudz veidu, kā var samazināt pieprasījumu skaitu, piemēram:

  • CSS un Javascript failu apvienošana
  • Inlineot savu Javascript (tikai tad, ja tas ir ļoti mazs)
  • Izmantojot CSS Sprites
  • Samazināt aktīvus, piemēram, trešo pušu spraudņus, kas veido lielu skaitu ārējo pieprasījumu

Tīmekļa vietnes ātruma testa rīku saraksts

Tagad, kad jums ir pamata izpratne par tīmekļa veiktspējas jēdzieniem, šeit esam apkopojuši šos 15 bezmaksas rīkus, lai pārbaudītu jūsu mājaslapas ātrumu. Katrs no viņiem piedāvā savus unikālos līdzekļus, pārskatus un dažādus veidus, kā analizēt rezultātus.

Piezīme: Ir svarīgi arī saprast, kad darbojas rīki, piemēram, 1. DNS uzmeklēšana parasti būs lēnāka. Ja salīdzināt kopējo slodzes laiku, dažkārt ieteicams veikt testus vairākas reizes un ņemt vērā rezultātu vidējo.

1.KeyCDN mājaslapu ātruma tests

Keycdn ir izveidojis ātru un vieglu mājaslapas ātruma testa rīku, ko var izmantot, lai iegūtu detalizētu informāciju par jūsu mājaslapas veiktspēju. Tas piedāvā 14 atrašanās vietas, apkārt visai pasaulē, un jums ir iespēja veikt testa rezultātus privāti vai publiski. Tests ietver ūdenskrituma veida diagrammu un vizuālo mājaslapas priekšskatījumu apakšā. Var ātri redzēt, cik ir veikti HTTP pieprasījumi, pieprasītās lapas pilnais lielums un ielādes laiks.

Tas ir arī viens no vienīgajiem rīkiem izņemot PageSpeed, kas ir atsaucīgs un darbojas lieliski mobilajās ierīcēs.

KEYCDN PerfTest

2.Google PageSpeed Insights

Google PageSpeed Insights ir mājaslapas ātruma testa rīks, kas jūsu mājaslapu novērtēs 1 – 100 mērogā. Jo lielāks cipars, jo jūsu vietne ir  labāk optimizēta. Jebkas virs 85 norāda, ka jūsu mājaslapa darbojas labi. PageSpeed sniedz pārskatus gan par jūsu vietnes darbvirsmu, gan mobilajām versijām.

PageSpeed Insights nosaka kā var uzlabot lapas ātrumu izmantojot:

  • Laiku Above-the-Fold ielādei: pagājušais laiks no brīža, kad lietotājs pieprasa jaunu lappusi un līdz brīdim, kad pārlūkprogrammā tiek renderēts above-the-fold saturs.
  • Laiku pilnai lapas ielādei: pagājušais laiks no brīža, kad lietotājs pieprasa jaunu lappusi uz brīdi, kad pārlūkprogramma ir pilnībā renderējusi lapu.

Mobilajā atskaitē iekļauta papildu kategorija ar nosaukumu “Lietotāja pieredze”, kas iekļauta jūsu vietnes vērtējumā. Tas ietver skatpunkta konfigurācijas pārbaudi, pieskāriena mērķu izmērus (pogas un saites) un arī atbilstošos fontu izmērus.

pagespeedinsights performance test

3.Pingdom ātruma tests

Pingdom drošvien ir viens no labāk zināmajiem mājaslapas ātruma testa rīkiem. Viņu pārskati ir sadalīti četrās dažādās sadaļās, kas ietver ūdenskrituma diagrammu, veiktspējas novērtējumu, lapu analīzi un vēsturi.

Lapas analīze piedāvā lielisku pārskatu ar papildu informāciju, piemēram, lieluma analīzi, lielumu uz domēnu (var viegli salīdzināt jūsu CDN satura lielumu salīdzinājumā ar jūsu domēnu), pieprasījumu skaitu vienā domēnā un kāda veida saturam bija visvairāk pieprasījumu.

Pingdom ātruma testa rīks ļauj pārbaudīt jūsu mājaslapas ātrumu no četrām galvenajām atrašanās vietām:

  • Dalasa, Teksasa, ASV,
  • Melburna, Austrālija
  • Sanhosē, Kalifornija, ASV
  • Stokholma, Zviedrija

Pingdom ātruma testa rezultāti nodrošina ar veiktspēju saistītus ieskatus, līdzīgus Google PagesSpeed Insights, tas norāda, kur var veikt uzlabojumus. Rezultāti arī nosaka lappuses lielumu pēc satura tipa, lappuses lieluma pēc domēna, pieprasījumiem pēc satura tipa un domēna pieprasījumiem.

pingdom performance test

4.Gtmetrix

Gtmetrix vērtē jūsu lapu sīkāk, jo tas pārbauda gan lapas PageSpeed, gan YSlow metriku, piešķirot jūsu vietnei atzīmi no F līdz A. Tā pārskati tiek sadalīti piecās dažādās sadaļās, ieskaitot PageSpeed, YSlow, ūdenskrituma diagrammu, video un vēsturi.

Ar bezmaksas reģistrāciju var pārbaudīt no septiņām dažādām atrašanās vietām. Viņi arī ļauj izvēlēties pārlūku, Chrome vai Firefox. Varat pārbaudīt un salīdzināt mājaslapas veiktspēju ar dažādiem savienojuma veidiem (piemēram, Optiku un DSL), lai redzētu, kā tas ietekmē jūsu lapas ielādi. Citi papildu līdzekļi ietver video atskaņošanu, lai analizētu, kur ir jūsu vājā vieta, kā arī spēju palaist AdBlock plus. Kad reklāmas ir atspējotas, varat redzēt, kā tās ietekmē jūsu vietnes ielādi.

Piezīme. Lai iegūtu papildu iespējas, piemēram, iepriekš minētās iespējas, ieteicams izveidot bezmaksas kontu.

5.WebPageTest

WebPageTest ir ļoti līdzīgs dažiem iepriekšējiem minētajiem rīkiem, bet tam ir vairāk nekā 40 atrašanās vietu, lai izvēle no 25 pārlūkprogrammām (ieskaitot mobilās ierīces). Tā piešķir atzīmi no F līdz A, pamatojoties uz dažādiem veiktspējas testiem, piemēram, FTTB, saspiešanu, caching, CDN efektīvu izmantošanu utt. Pārskats ir sadalīts sešās sadaļās, kas ietver kopsavilkumu, informāciju, veiktspējas pārskatīšanu, satura sadalījumu un ekrānuzņēmumus.

Tā piedāvā arī unikālu pieeju testam. Tā izpilda to, ko viņi sauc par pirmo skatu un atkārtotu skatu. Tas palīdz diagnosticēt, kas, iespējams, ir 1. reizes DNS uzmeklēšanas aizture, kā minēts iepriekš. Webpagetest ir papildu funkcijas, kā arī video uztveršana, Javascript atspējošana, SSL sertifikātu ignorēšana un lietotāju aģentu virknes spoofings (spoofing user agent strings).

webpagetest perftest

6.Varvy Pagespeed Optimization

Varvy Pagespeed Optimization ir instruments, ko izstrādājis un uztur Patriks Sextons, kurš arī izveidojis GetListed.org, kas tagad pazīstams kā Moz Local.

Pārskati tiek sadalīti 5 dažādās sadaļās, ieskaitot resursu diagrammu, css piegādi, javascript lietojumu, atrastās problēmas lapā un izmantotos pakalpojumus. Šis rīks grafiski parāda problēmas jūsu mājaslapā kuras varētu salabot, piemēram, renderēšanas bloķēšanu

Patrikam ir lieliska dokumentācija par to, kā uzlabot jūsu vietni ar apmācībām par kritisko renderēšanas ceļu, izmantojot pārlūkprogrammas caching, atlikt javascript kas jau lādējas un daudz ko citu.

varvy test

7.Uptrends

Uptrends ir vienkāršs rīks, bet, veicot ātruma testu, viņi piedāvā vairāk nekā 35 atrašanās vietas. Viņu pārskats ir sadalīts divās sadaļās, ūdenskrituma diagrammā un domēnu grupās. Domēnu grupas piedāvā unikālu perspektīvu, jo tā iedala resursus dažādos avotos: 1st party, statistikā, CDN, sociālajā, reklāmā, 1st party kopumā un third party kopumā.

uptrends test

8.dotCOM-monitor

dotcommonitor_logo

dotCOM-monitor piedāvā 23 dažādas atrašanās vietas un septiņas dažādas pārlūkprogrammas, kurās var veikt mājaslapas ātruma pārbaudi. To unikālais līdzeklis ir tas, ka vienlaicīgi var izpildīt visus ģeogrāfiskos testus. Tas var ietaupīt daudz laika, jo katram citam rīkam tas ir jādara atsevišķi katrā atrašanās vietā. Pēc tam var noklikšķināt uz katra atsevišķā pārskata un vai ūdenskrituma diagrammas.

Viņu pārskati ir sadalīti piecās dažādās sadaļās, kas ietver kopsavilkumu, veiktspēju, ūdenskritumu diagrammu, hostu un kļūdas.

dotcomtools perf test

9.PageScoring

PageScoring viss ir par vienkāršu un viegli saprotamu veiktspējas ziņojumu ar minimālisma dizainu. Šis rīks parāda kopējo slodzes laiku un pēc tam šādu informāciju:

  • Domēnu uzmeklēšanu
  • Savienojuma laiks
  • Pārvirzīšanas laiks
  • Lapas izmērus
  • Lejupielādes laiks

Pēc tam varat redzēt savu saturu un cik ilgi tas ielādējas. Ja meklējat ātru un vienkāršu mājaslapas ātruma testa rīku, tad šis darbojas diezgan labi.

10.Yellow Lab Tools

Yellow Lab Tools ir jaunāks tīmekļa veiktspējas un front-end kvalitātes testēšanas rīks, ko izstrādājis Gaël Métais. Šis rīks sniedz daudz informācijas un dažus unikālus līdzekļus, kas nav redzami citos rīkos, piemēram, skatā, kad lapas ielādes laikā un citu kodu validācijas jautājumos JavaScript mijiedarbība ar DOM. Iegūstiet globālu rezultātu, pamatojoties uz šādiem kritērijiem:

  • Lapas svars
  • Pieprasījumi
  • DOM
  • Slikts Javascript
  • Slikts CSS
  • Servera konfigurācija

JavaScript laika skalā ir redzams, kā DOM mijiedarbojas lapas ielādes laikā.

yellowlabtools

11.Google Chrome DevTools

google chrome logo

Un, protams, mēs nevaram aizmirst Google Chrome DevTools. Ir ļoti viegli izmantot šo rīku (tam ir advancēta funkcionalitāte), un to var ātri palaist jebkurā brīdī Google Chrome, izmantojot šādas īsinājumtaustiņus.

  • Windows: F12 vai arī Ctrl + Shift + I
  • Mac: Cmd + Opt + I

Ar jaunāko izstrādātāju rīku atjauninājumu, tie ir pievienojuši apkopotu detaļu paneli ūdenskrituma laika skalai. Tas ļauj vieglāk redzēt, kas jums aizņem visvairāk laika, un pēc tam to var sadalīt pa domēniem, apakšdomēniem utt. Lai palaistu šo klikšķiniet panelī “Timeline” un nospiediet taustiņu kombināciju Ctrl + R (Cmd + R), lai atsvaidzinātu lapu. Pēc tam varat noklikšķināt uz paneli “Summary” un “Aggregated”.

googledevtools

12.Sucuri LoadTimeTesterSucuri logo

 

Sucuri Load Time Tester nodrošina ātru un vienkāršu veidu, kā pārbaudīt savu vietņu veiktspēju visā pasaulē. Tas sniegs globālo veiktspējas atzīmi no A līdz F. Pārbaudes izmēra, cik ilgi tas notiek, lai izveidotu savienojumu ar jūsu vietni un vienu lappusi pilnībā ielādētu. Ļoti svarīga vērtība, kam pievērst uzmanību, ir “time to first byte”, kas sniedz informāciju par to, cik ilgi saturs tika nosūtīts atpakaļ uz pārlūkprogrammu, lai sāktu lapas apstrādi.

https://blackmedia.lv/

13.Pagelocity

pagelocity logo

Pagelocity piedāvā vēl vienu unikālu pieeju, kad runa ir par mājaslapas ātruma testu. Tas dod kopējo rezultātu no 100, kas sastāv no tādiem faktoriem kā sociālais, SEO, resursi un kods. Rīks piedāvā arī spēju izsekot konkurentiem. Lai iegūtu papildu līdzekļus, varat izmantot bezmaksas kontu. Koda skats ir īpaši unikāls, jo tas parādīs vai jūsu vietnē darbojas HTTPS, kāds ir jūsu TTFB, un jūsu DOM elementu grafiskais interfeiss ar joslu diagrammu.

Resursu skats ir arī diezgan interesants, jo varat ātri redzēt, kurš saturs veido kopējo lapas svaru.

14.Yslow

Y-Slow logo

Yslow ir atvērta avota projekts un rīks, kas analizē mājaslapu un palīdz izprast, kāpēc tā ir lēna, pamatojoties uz Yahoo! noteikumiem priekš augstas veiktspējas mājaslapas. Pašlaik to uztur Marsels Durāns, kurš ir iesaistīts arī WebPageTest projektā. Yslow darbojas trijos posmos, lai iegūtu savus veiktspējas testa rezultātus:

  1. Yslow crawlo DOM, lai atrastu visus komponentus (attēlu, skriptus utt.).
  2. Yslow iegūst informāciju par katru komponenta lielumu (gzip, expire galvenes utt.)
  3. Yslow ņem datus un katram noteikumam ģenerē atzīmi, kas dos jums vispārēju atzīmi.

Yslow ir 23 dažādi noteikumi, ka tā darbojas jūsu mājaslapā, lai to novērtētu, kā redzams šajā piemērā.  Diemžēl YSlow spraudnis vairāk netiek atjaunināts YSlow rezultātus varat iegūt no GTMetrix.

15.Perftool

perf-tool-logo-full

Perftool ir atvērta avota client-side veiktspējas rīku projekts, kas tiek hostots Github. Tā apkopo dažādu informāciju par jūsu mājaslapu un parāda to vienkārši pārskatāmā veidā pārskatu lapā. Tajā apvienoti trīs datu avoti vienā, lapas ātrumā, devperf un W3CJS. Kopumā tas dod vairāk nekā 200 dažādus veiktspējas rādītājus.

Viena liela priekšrocība ar PerfTool ir tā, ka vienlaikus tas var veikt vairākas lapu pārbaudes. Pēc tam salīdziniet mājaslapas veiktspējas rezultātus no iepriekšējiem testiem, iestatiet rezultātu slieksni un iegūstiet detalizētu pārskatu par testiem. Tas faktiski var ietaupīt daudz laika, ja salīdzināt visas vietnes veiktspēju, jo jums nav jātestē savas lapas pa vienam.

 

Mājaslapas ātruma tests ar Chrome paplašinājumiem

Ir daži bezmaksas Chrome paplašinājumi, kuros var analizēt mājaslapas ātrumu. Te ir pāris. Tos var viegli palaist pārlūkprogrammā.

Mobilais mājaslapas ātruma tests

Ja ir nepieciešams palaist mobilo mājaslapas ātruma testu, tad pāris no iepriekš minētajiem rīkiem derēs:

  • WebPageRest
  • GTMetrix
  • dotCOM-monitor

Vēl viens veids, kā simulēt ātruma testu mobilajā ierīcē, ir izmantot Chrome izstrādātāja rīkus ierīces režīmā. Lai ievadītu ierīces režīmu, noklikšķiniet uz mazās tālruņa ikonas Chrome DevTools vai varat nospiest taustiņu kombināciju Ctrl + Shift + M (Cmd + Shift + M). Pēc tam varat izvēlēties, kādu ierīci vēlaties pielāgot, orientāciju un pat izšķirtspēju. Varat arī mainīt tīkla throttling, lai redzētu, kā jūsu mājaslapa renderēsies uz parastā 2G vai 4G savienojuma.

Pēc tam varat izmantot cilni “Network” un ūdenskritumu diagrammu, lai veiktu ātruma testus.

Kopsavilkums

Kā redzams, ir vairāki mājaslapas ātruma testa rīki, no kuriem varat izvēlēties. Katram no viņiem ir savi unikālie līdzekļi, kā uzsvērts iepriekš. Ieteicams regulāri pārbaudīt jūsu vietni un izveidot kritēriju, lai varētu veikt uzlabojumus.

Kad jūs zināt, kur ir problēmas, varat sākt tās novērst. Daži no biežāk sastopamajiem labojumiem ir šādi:

  • Attēlu un failu saspiešana
  • Ātra web-host izvēle
  • Koda un skriptu optimizēšana
  • CDN izmantošana
  • Caching
  • HTTP pieprasījumu skaita samazināšana