Top 15 instrumente gratuite de testare a vitezei site-urilor web din 2018

Viteza unui site web poate fi un factor critic pentru succesul său. După cum am discutat în ghidul nostru privind rețelele de livrare de conținut, site-urile web cu încărcare mai rapidă pot beneficia de poziții SEO mai bune, rate de conversie mai mari, rate de respingere mai mici, o durată mai lungă de ședere a vizitatorilor pe site, o experiență generală mai bună pentru utilizator și implicare. Acesta este motivul pentru care este important să profitați de numeroasele instrumente gratuite de testare a vitezei site-urilor web disponibile, astfel încât să puteți obține o performanță optimă. Google dorește ca site-ul dvs. să se încarce în mai puțin de o secundă.

Ce vă poate ajuta un test de viteză a site-ului web să analizați?

Iată doar câteva dintre modurile obișnuite în care sunt utilizate instrumentele de testare a vitezei site-urilor web:

• Pinpointing scripts, fonts, and plugins causing load time issues (HTML, JavaScript, CSS)
• Checking minification of your scripts
• Finding large images resulting in bottlenecks
• Determining if you have render-blocking JavaScript or CSS
• Testing Time to First Byte (TTFB)
• Analyzing total load times, page sizes, and # of requests
• Checking performance from different geographical locations
• Checking rendering speed in different browsers
• Analyzing HTTP Headers
• Measuring performance of your content delivery network
• Verifying that assets are loading correctly from your CDN

Website speed concepts

Before running a website speed test it is important to understand a few concepts behind how these tools work so that you can better analyze the data and then optimize your site accordingly. Nu numai că puteți testa viteza gazdei dvs. web, dar puteți măsura, de asemenea, performanța CDN.

Time to first byte (TTFB)

Time to first byte (TTFB) este măsurarea capacității de reacție a unui server web. Practic, este timpul necesar pentru ca browserul dvs. să înceapă să primească informații după ce le-a solicitat de la server. Prin utilizarea unui CDN puteți reduce dramatic impactul sarcinii asupra serverului de origine, ceea ce, la rândul său, ar trebui să ajute la scăderea TTFB.

Citește mai multe despre timpul până la primul octet și timpul până la ultimul octet.

Render-blocking JavaScript și CSS

Render-blocking se referă la JavaScript și CSS care vă împiedică pagina să se încarce atât de repede pe cât ar putea.

JavaScript

Google recomandă eliminarea sau amânarea JavaScript care interferează cu încărcarea conținutului above the fold al paginilor dvs. web. Here is a great tutorial on how to properly defer JavaScript loading.

Example of deferring JavaScript by placing it just before your </body> tag.

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

You will then also want to optimize your CSS delivery to keep it from causing delays on page load. Here are a few ways to fix this:

1. Properly call your CSS files
2. Lessen the amount of CSS files
3. Use less CSS overall

Here is a great article on render-blocking CSS by Ilya Grigorik, a web performance engineer at Google.

CSS is a render blocking resource, get it down to the client as soon and as quickly as possible to optimize the time to first render!

Minification of resources

Minification of resources means removing unnecessary characters from your HTML, JavaScript, and CSS that are not required to load, such as:

• Caracterele de spațiu alb
• Caracterele de linie nouă
• Delimitatorii de blocuri

Acest lucru accelerează timpii de încărcare, deoarece reduce cantitatea de cod care trebuie să fie solicitată de la server. Puteți utiliza un instrument precum Dan’s CSS and JavaScript Minify pentru a elimina toate caracterele inutile. Sau, dacă folosiți WordPress, puteți utiliza un plugin precum Autoptimize, care va minifica pentru dvs. toate codurile HTML, JavaScript și CSS.

Solicitări HTTP

Când browserul dvs. preia date de pe un server, o face folosind HTTP (Hypertext Transfer Protocol). Acesta este o cerere/răspuns între un client și o gazdă. În general, cu cât pagina dvs. web face mai multe cereri HTTP, cu atât se va încărca mai lent.

Există mai multe modalități prin care puteți reduce numărul de cereri, cum ar fi:

• Combinarea fișierelor CSS și JavaScript
• Inline JavaScript-ul (numai dacă este foarte mic)
• Utilizarea de CSS Sprites
• Reducerea activelor, cum ar fi plugin-urile de la terți care fac un număr mare de solicitări externe

Listă de instrumente de testare a vitezei site-ului web

Acum că aveți o înțelegere de bază a conceptelor de performanță web de mai sus, verificați aceste 15 instrumente gratuite de mai jos pentru a testa viteza site-ului dvs. web. Fiecare dintre ele oferă propriile caracteristici unice, rapoarte și moduri diferite de a vă diseca rezultatele.

Este, de asemenea, important să vă dați seama, atunci când rulați astfel de instrumente, că o căutare DNS pentru prima dată va fi, de obicei, mai lentă. Dacă comparați timpii totali de încărcare, uneori este mai bine să executați testele de mai multe ori și să faceți o medie a rezultatelor.

KeyCDN Website Speed Test

KeyCDN a construit un instrument rapid și ușor Website Speed Test pe care îl puteți utiliza pentru a obține informații detaliate despre modul în care se comportă site-ul dvs. web. Dacă oferă 14 locații din care puteți alege din întreaga lume și aveți opțiunea de a vă face rezultatele testului private sau publice. Testul include o defalcare în cascadă și o previzualizare vizuală a site-ului web în partea de jos. Puteți vedea rapid câte solicitări HTTP au fost efectuate, dimensiunea completă a paginii solicitate și timpul de încărcare.

Este, de asemenea, unul dintre singurele instrumente, în afară de PageSpeed, care este receptiv și funcționează foarte bine pe dispozitivele mobile.

Google PageSpeed Insights

Google PageSpeed Insights este un instrument de testare a vitezei site-urilor web care notează site-ul dvs. pe o scară de la 1 la 100. Cu cât numărul este mai mare, cu atât site-ul dvs. este mai bine optimizat. Orice cifră peste 85 indică faptul că site-ul dvs. are performanțe bune. PageSpeed vă oferă rapoarte atât pentru versiunea desktop, cât și pentru cea mobilă a site-ului dumneavoastră. Puteți vizualiza recomandări pentru îmbunătățiri, cum ar fi că trebuie să minificați CSS sau să vă optimizați imaginile.

PageSpeed Insights măsoară modul în care pagina își poate îmbunătăți performanța la:

• Timpul de încărcare above-the-fold: Timpul scurs din momentul în care un utilizator solicită o pagină nouă și până în momentul în care conținutul above-the-fold este redat de către browser.
• Timpul până la încărcarea întregii pagini: Timpul scurs din momentul în care un utilizator solicită o pagină nouă și până în momentul în care pagina este redată complet de către browser.

Un raport pentru dispozitive mobile include o categorie suplimentară numită „Experiența utilizatorului”, care este inclusă în notarea site-ului dumneavoastră. Aceasta include verificarea configurației viewportului, dimensiunea țintelor de atingere (butoane și linkuri) și, de asemenea, dimensiunile eligibile ale fonturilor.

Echipa PageSpeed Insights a lansat recent și un nou instrument de testare a vitezei site-urilor web pe think with Google, pe care ați putea dori să îl verificați. O caracteristică plăcută este reprezentată de rapoartele frumoase pe care le generează. Poate fi grozav pentru a le trimite clienților.

Pingdom Speed Test

Pingdom este probabil unul dintre cele mai cunoscute instrumente de testare a vitezei site-urilor web. Rapoartele lor sunt împărțite în patru secțiuni diferite care includ o defalcare în cascadă, gradul de performanță, analiza paginilor și istoricul.

Analiza paginilor oferă o imagine de ansamblu excelentă cu informații suplimentare, cum ar fi o analiză a dimensiunii, dimensiunea pe domeniu (puteți compara cu ușurință dimensiunea activelor CDN față de domeniul dvs.), numărul de solicitări pe domeniu și ce tip de conținut a avut cele mai multe solicitări.

Strument de testare a vitezei de la Pingdom vă permite, de asemenea, să testați viteza site-ului dvs. din patru locații principale, inclusiv:

• Dallas, Texas, SUA,
• Melbourne, Australia
• San Jose, California, SUA
• Stockholm, Suedia

Rezultatele unui test de viteză Pingdom vă oferă informații despre performanță, similare cu Google PagesSpeed Insights, care subliniază unde puteți face îmbunătățiri. Rezultatele defalcă, de asemenea, dimensiunea paginii în funcție de tipul de conținut, dimensiunea paginii în funcție de domeniu, solicitările în funcție de tipul de conținut și solicitările în funcție de domeniu.

GTmetrix

GTmetrix intră în mare detaliu, deoarece verifică atât metricile PageSpeed, cât și YSlow, atribuind site-ului dvs. o notă de la F la A. Rapoartele sale sunt împărțite în cinci secțiuni diferite, inclusiv PageSpeed, YSlow, defalcare în cascadă, video și istoric.

Cu o înregistrare gratuită, puteți testa din șapte locații diferite. De asemenea, vă permit să alegeți browserul, Chrome vs. Firefox. Puteți testa și compara performanța site-ului web în funcție de diferite tipuri de conexiuni (cum ar fi cablu vs dial-up) pentru a vedea cum afectează încărcarea paginilor. Alte caracteristici avansate includ o redare video pentru a analiza unde se produce gâtul de gâtuială și, de asemenea, posibilitatea de a rula Adblock plus. Cu reclamele dezactivate, puteți vedea cum afectează acestea încărcarea site-ului dumneavoastră. Este recomandat să vă faceți un cont gratuit, deoarece veți obține opțiuni suplimentare, cum ar fi cele menționate mai sus.

WebPageTest

WebPageTest este foarte asemănător cu unele dintre instrumentele menționate anterior, dar are peste 40 de locații din care puteți alege și peste 25 de browsere (inclusiv mobile). Îți atribuie o notă de la F la A pe baza diferitelor teste de performanță, cum ar fi FTTB, compresie, caching, utilizarea eficientă a unui CDN etc. Raportul său este împărțit în șase secțiuni care includ un rezumat, detalii, analiza performanțelor, defalcarea conținutului și capturi de ecran.

Acesta oferă, de asemenea, o abordare unică asupra testului. Rulează ceea ce ei numesc o primă vizualizare și o vizualizare repetată. Acest lucru ajută la diagnosticarea a ceea ce poate fi o întârziere la prima căutare DNS, așa cum am menționat mai devreme. WebPageTest are și funcții mai avansate, cum ar fi captura video, dezactivarea JavaScript, ignorarea certificatelor SSL și falsificarea șirurilor de agenți utilizator.

Varvy PageSpeed Optimization

Varvy PageSpeed Optimization este un instrument dezvoltat și întreținut de Patrick Sexton, care a creat, de asemenea, GetListed.org, care acum este cunoscut sub numele de Moz Local.

Rapoartele sunt împărțite în 5 secțiuni diferite, inclusiv o diagramă a resurselor, livrarea CSS, utilizarea JavaScript, problemele de viteză a paginii găsite și serviciile utilizate. Acest instrument folosește mai mult o reprezentare grafică a ceea ce ar putea fi reparat pe site-ul dvs., cum ar fi blocarea randării.

Patrick face o treabă excelentă incluzând, de asemenea, documentație despre cum să vă optimizați în continuare site-ul, cu tutoriale despre calea critică de randare, valorificarea memoriei cache a browserului, amânarea încărcării JavaScript și multe altele.

Uptrends

Uptrends este destul de simplu, dar oferă peste 35 de locații din care puteți alege atunci când efectuați testul de viteză. Raportul lor este împărțit în două secțiuni, o defalcare în cascadă și grupuri de domenii. Grupurile de domenii oferă o perspectivă unică, deoarece clasifică resursele în diferite surse: 1st party, statistici, CDN, CDN, social, reclame, first party în general și third party în general.

dotcom-monitor

dotcom-monitor oferă 23 de locații diferite și șapte browsere diferite în care puteți efectua testul de viteză al site-ului dvs. web. Caracteristica lor unică este că puteți rula toate testele geografice simultan. Acest lucru vă poate economisi mult timp, deoarece orice alt instrument trebuie să le executați individual pentru fiecare locație. Puteți apoi să faceți clic în fiecare raport individual și sau defalcare în cascadă.

Raporturile lor sunt împărțite în cinci secțiuni diferite care includ un rezumat, performanță, graficul în cascadă (defalcare), gazdă și erori.

PageScoring

PageScoring is all about offering a simple and easy to understand performance report with a minimalist design. They show your overall load time and then the following pieces of information:

• Domain lookups
• Connection Time
• Redirection Time
• Page Size
• Download Time

You can then see your assets and how long it took for each to load. If you are looking for a quick and easy website speed test tool, this works pretty good.

Yellow Lab Tools

Yellow Lab Tools is a newer web performance and frontend quality testing tool developed by Gaël Métais. This tool gives you a lot of information and some unique features not seen in other tools such as a view of when JavaScript interactions with the DOM during the loading of the page and other code validation issues. Get a global score based on the following qualifiers.

• Page weight
• Requests
• DOM
• Bad JavaScript
• Bad CSS
• Server Config

The JavaScript timeline shows you exactly how the DOM interacts during the loading of the page.

Google Chrome DevTools

And of course we can’t forget Google Chrome DevTools. It is a very easy to use tool (with advanced features) and you can quickly launch it at anytime in your Chrome broswer using the following shortcut keys.

• Windows: F12 or also Ctrl + Shift + I
• Mac: Cmd + Opt + I

Cu cea mai recentă actualizare a instrumentelor pentru dezvoltatori, aceștia au adăugat un panou de detalii agregate în cronologia cascadă. Acest lucru vă permite să vedeți mai ușor ce vă costă cel mai mult timp, iar apoi îl puteți împărți pe domenii, subdomenii etc. Pentru a rula acest lucru, faceți clic în panoul „Timeline” și apăsați Ctrl + RCmd + R) pentru a reîmprospăta pagina. Puteți apoi să faceți clic în panoul „Rezumat” și în panoul de detalii „Agregate”.

Avem, de asemenea, o postare grozavă despre ce blochează DOM-ul și cum se poate rezolva. În instrumentele pentru dezvoltatori, puteți vedea exact timpul DOMContentLoaded și timpul total de încărcare. Pentru a executa acest lucru, faceți clic în panoul „Network” (Rețea), faceți clic pe opțiunea „Show Overview” (Afișare prezentare generală) și apăsați Ctrl + RCmd + R) pentru a reîmprospăta pagina. Se va afișa o linie albastră pentru DOMContentLoaded și o linie roșie pentru timpul total de încărcare. În mod normal, tot ceea ce se află în stânga liniei albastre sau atinge linia albastră sunt resurse care blochează DOM sau, de asemenea, sunt denumite resurse care blochează redarea.

Sucuri Load Time Tester

Sucuri Load Time Tester oferă o modalitate rapidă și ușoară de a testa performanța site-urilor dvs. din întreaga lume. Acesta vă va oferi o notă de performanță globală, de la A la F. Testul măsoară cât durează conectarea la site-ul dvs. și încărcarea completă a unei pagini. O valoare foarte importantă la care trebuie să acordați atenție este „time to first byte” (timpul până la primul octet), care vă oferă cât timp a durat până când conținutul a fost trimis înapoi la browser pentru a începe procesarea paginii.

Pagelocity

Strumentului Pagelocity oferă o altă abordare unică atunci când vine vorba de un test de viteză a unui site web. Acesta vă oferă un scor total din 100, format din factori precum social, SEO, resurse și cod. Instrumentul oferă, de asemenea, posibilitatea de a vă urmări concurenții. Vă puteți înscrie pentru un cont gratuit pentru a beneficia de funcțiile suplimentare. Vizualizarea codului este deosebit de unică, deoarece vă va arăta dacă site-ul dvs. rulează pe HTTPS, care este TTFB-ul dvs. și o interfață grafică a elementelor dvs. DOM cu un grafic cu bare.

Vizualizarea resurselor este, de asemenea, destul de interesantă, deoarece puteți vedea rapid care sunt activele care alcătuiesc greutatea totală a paginii dvs. După cum puteți vedea în testul nostru, imaginile sunt de peste 4 ori mai mari decât scripturile noastre externe.

YSlow

YSlow este un proiect open source și un instrument care analizează paginile web și vă ajută să vă dați seama de ce sunt lente, pe baza regulilor Yahoo! pentru site-uri web de înaltă performanță. În prezent este întreținut de Marcel Duran, care este implicat și în proiectul WebPageTest. YSlow operează în trei pași pentru a obține rezultatele testelor sale de performanță:

1. YSlow parcurge DOM-ul pentru a găsi toate componentele (imagine, scripturi, etc.).
2. YSlow obține informații despre dimensiunea fiecărei componente (Gzip, expiră anteturile, etc.).)
3. YSlow ia datele și generează o notă pentru fiecare regulă, care, la rândul său, vă oferă o notă generală.

YSlow are 23 de reguli diferite pe care le rulează pe site-ul dvs. pentru a le evalua, cum ar fi utilizarea unui CDN și reducerea căutărilor DNS. GTmetrix oferă un instrument de analiză online pentru a vă verifica scorul YSlow. Nu uitați să consultați tutorialul nostru aprofundat despre cum să vă îmbunătățiți scorul YSlow.

PerfTool

PerfTool este un proiect open source de instrumente de performanță pe partea clientului, găzduit pe GitHub. Acesta colectează diverse informații despre site-ul dvs. web și le afișează într-o manieră ușor de digerat pe o pagină de rapoarte. Acesta combină trei surse de date într-una singură, PageSpeed Insights, devperf și W3CJS. În total, vă oferă peste 200 de indicatori de performanță diferiți.

Un mare avantaj cu PerfTool este că puteți rula mai multe teste de pagini în același timp pentru raportul Google PageSpeed Insights. Apoi, comparați rezultatele de performanță ale site-ului web de la testele anterioare, setați pragul de punctaj și obțineți un raport detaliat despre testele dvs. This can actually save you a lot of time if you are benchmarking your entire site’s web performance, as you don’t have to test your pages one by one.

Website speed test with Chrome extensions

There are quite a few free Chrome extensions in which you can analyze website speed. Here are a couple of them. You can easily launch them from right within your browser.

• Page Load Time
• app.telemetry Page Speed Monitor
• Performance-Analyser
• LoadFocus Load Testing

Mobile website speed test

If you are needing to run a mobile website speed test a couple of the tools we mentioned above do include this:

• WebPageTest
• GTmetrix
• dotcom-monitor

Another way to simulate a speed test on a mobile device is to use Chrome developer tools in device mode. Pentru a intra în modul dispozitiv, faceți clic pe pictograma mică de telefon din Chrome DevTools sau puteți apăsa Ctrl + Shift + MCmd + Shift + M). Puteți alege apoi ce dispozitiv doriți să emulați, orientarea și chiar rezoluția. Puteți, de asemenea, să modificați limitarea rețelei pentru a vedea cum ar reda de fapt site-ul dvs. pe o conexiune obișnuită de 2G sau 4G, să zicem.

Puteți folosi apoi fila „Rețea” și defalcarea în cascadă pentru a rula teste de viteză.

Summary

După cum puteți vedea, există o serie de instrumente de testare a vitezei site-urilor web din care puteți alege. Fiecare dintre ele are propriile caracteristici unice, așa cum am subliniat mai sus. Este o idee bună să vă testați în mod regulat site-ul și să stabiliți un punct de referință, astfel încât, în timp, să puteți face îmbunătățiri.

După ce știți unde sunt blocajele, puteți începe să le remediați. Aproape toate instrumentele de mai sus enumeră recomandări. Some of the most common fixes include:

• Compressing your images and files
• Picking a fast web host
• Optimizing your code and scripts
• Using a content delivery network
• Caching
• Reducing the number of HTTP requests