Introduction into SPA & Soft Navs tracking
If your site is built with React, Vue.js, Angular or maybe even NextJS, NuxtJS or Remix, chances are your site is either an Single Page Application (SPA), or starts behaving like an SPA after the first pagehit.
Different SPA navigation types
In both cases, analytics tracking might work a bit different already. Additionally, due to producing soft navigations instead of hard navigations, Core Web Vitals within SPA's works a bit different. As a result, the same used to apply to Real User Monitoring data as well.
Soft navigations
Luckily, Google has been working on this for a few years already, and it landed as a branch in Google's web-vitals library:
Non-soft navigations
Although technically still called soft navigations, an SPA might not be meet the heuristics set out by the working group. As a result, the soft-navs branch won't track page navigations in an expected way.
But even then, RUMvision will attempt to track soft navigations within your SPA in the same way, as we've built our own layer on top of our monitoring.
SPA's and RUMvision
As RUMvision is built on top of this web-vitals library, RUMvision supports soft navigations as well. But we also support SPA's that are not meeting the soft-navigations API heuristics. Which means your SPA website and monitoring via RUMvision should be a good match.
Additionally, our monitoring has been designed with minimal configuration in mind. The most important step is to change your domain's configuration and choose "yes" for "Is your site a Single Page Application".
You might want to customize beyond this though. Steps for further customization can be found in the next article.
Core Web Vitals and its metrics
As we inherit the support that web-vitals library is giving its users, RUMvision inherits the same characteristics. As part of soft navigations, you will get support for the following metrics:
When it comes to TTFB, 0ms will be reported. The Chrome docs are saying the following when it comes to measuring TTFB:
In the future, we may support more precise ways of knowing which request is the soft navigation's "navigation request" [..]. But that's not part of the current experiment.
developer.chrome.com
Other metrics
At time of writing, other metrics are not supported yet. However, the Web Incubator Community Group (WICG) is working on this, and the following might be added in the future:
TTFB support
So, TTFB is there, but will always be reported as 0ms. However, in real life and within many frameworks, this won't actually be 0ms. This could then give site owners an unrealistic idea of the performance of soft navigations.
It's not surprising though. ach platform and framework might be fetching contents in different ways. In other words, platforms aren't fetching the main resource in a uniform way. As a result, this can't be detected in a uniform way either.
Nevertheless, the RUMvision team has been working on support for TTFB. Continue reading here to learn more about our TTFB support and customizing tracking.