API časování navigace zahrnuje typ aktuální navigace

Paul Calvano napsal vynikající článek, v němž se ponořil do mezipamětí zpět/vpřed, ve kterém se zabývá metrikami RUM shromážděnými pomocí mPulse.

Zjistil jsem, že v JavaScriptu je možné získat přístup k informacím o chování uživatele při navigaci. Můžete zjistit, zda vaši uživatelé procházeli, znovu načítali nebo procházeli historii prohlížeče. Specifikace časování navigace a přiložený typ navigace obsahují tyto informace v performance.navigation.type . performance.navigation.type vrátí hodnotu výčtu.

Událost navigace Hodnota výčtu Informace
navigate 0 kliknutí kliknutím, zadání adresy URL, odeslání formuláře, ...
reload 1 kliknutí znovu načíst nebo location.reload()
back_forward 2 kliknutí zpět/vpřed nebo volání history.back()/history.forward()
prerender 3 navigace zahájená nápovědou k předběžnému vykreslení

Použijte performance.navigation.type analyzovat, jak se váš web a jeho zdroje načítají v závislosti na různém chování uživatelů. Pokud se například chcete dozvědět, kolik lidí na vašich stránkách stisklo tlačítko pro opětovné načtení, a chcete provést nějakou analýzu, zde vám může pomoci několik řádků JavaScriptu:

if (performance.navigation.type === 1) {
  // gather metrics after a reload and
  // tell your monitoring service about it!
}

Pokud chcete vidět Navigation Timing API v akci, zveřejnil jsem CodeSandbox, abych si s ním pohrál.

Bavte se! 👋