HAR File Waterfall Analyzer

HAR-tiedosto (HTTP-arkisto) on JSON-vienti kaikesta, mitä selaimen DevTools Network -paneeli on tallentanut sivun latauksen aikana: jokainen pyyntö ja vastausotsikko, kunkin vastauksen rungon tarkka koko ja MIME-tyyppi sekä pyyntökohtainen ajoituserittely. Voit luoda sellaisen Chromesta, Firefoxista, Edgestä tai Safarista avaamalla DevToolsin, lataamalla sivun uudelleen Verkko-välilehdellä, napsauttamalla sitten hiiren kakkospainikkeella pyyntöluetteloa ja valitsemalla "Tallenna kaikki HAR-muodossa sisällön kanssa". Tämä työkalu lukee viedyn tiedoston suoraan – mitään ei haeta tai pyydetä uudelleen.

Vesiputouskaavio on rakennettu kokonaan tiedostossa jo olevista tiedoista: kunkin merkinnän oma ajoitusobjekti jakaa pyynnön estettyihin, DNS-haku-, yhteys-, SSL/TLS-neuvottelu-, lähetys-, odotus- (aika ensimmäiseen tavuun) ja vastaanottovaiheisiin, ja jokainen vaihe piirretään omaksi värilliseksi segmentiksi. HAR-spesifikaation mukaan SSL-aika sisältyy myös yhteyden sisään, joten se vähennetään ensin takaisin - muuten TLS-osuus laskettaisiin kahdesti ja palkkien leveydet eivät enää vastaa pyynnön todellista kestoa. Katkoviivaiset pystysuuntaiset merkit näyttävät DOMContentLoaded ja Load, luetaan suoraan tiedoston omien sivujen ajoituksista, joten näet tarkalleen, mitkä pyynnöt päättyivät ennen kuin sivu muuttui interaktiiviseksi.

Kaavion lisäksi työkalu suorittaa kolme hakusääntöä HAR-muodossa jo tallennettujen kenttien yli. Se merkitsee välimuistiin tallennettavat vastaukset (tila 200, 203 tai 206), joissa ei ole Cache-Control- tai Expires-otsikkoa, mikä tarkoittaa, että toistuvan käynnin on ladattava ne uudelleen tyhjästä. Se merkitsee yli 1 kt:n tekstivastaukset – HTML, CSS, JavaScript, JSON, SVG ja vastaavat –, jotka toimitettiin ilman sisältökoodausta. Tämä on helppo pakkausmahdollisuus, jonka useimmat palvelimet voivat ottaa käyttöön yhdellä asetusrivillä. Ja se merkitsee CSS- tai JavaScript-pyynnöt, jotka alkoivat ennen sivun omaa DOMContentLoaded-offsetia, joka on renderöinnin estävän sisällön klassinen allekirjoitus.

Kaikki tämä toimii tiedoilla, jotka ovat jo lataamassasi tiedostossa – verkkoon ei ole pääsyä, ulkoista hakupalvelua eikä alkuperäisen sivun uudelleenhakua. HAR-tiedosto luetaan, jäsennetään ja renderöidään kokonaan selaimesi välilehdessä, eikä sitä koskaan ladata minnekään.