Spade shape with cobalt blue background

Performance Newsletter

Archives
Calibre Monitoring
Free Speed Tools
Log in
Subscribe
30 January 2024

⚡ 144: Measure soft navigations in SPAs

͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏
 
Performance Newsletter
[issue 144 ]()
 
#### Editor’s note
 
We hear people mention that real user web performance metrics collected for single page apps are not entirely accurate. It’s true—the way SPAs handle navigations between pages (which also differs by framework), which is fundamentally different to the traditional architecture of webpages, is currently not well-supported by Core Web Vitals. This is hopefully going to change with the effort to measure SPA-specific soft navigations.
 
In this issue, we feature two articles covering the soft navigations experiment. I encourage you to test it out and provide feedback, which will then shape the future implementations of measuring performance of SPAs.
 
Karolina
 
 
 
 
#### What’s Performance newsletter?
 

Performance Newsletter is a fortnightly mailing by [Calibre](https://calibreapp.com), featuring web performance tools, talks and resources.

Don’t worry—we don’t spam. If you’d like to leave, [unsubscribe]() at any time. Suggest content [here. ](mailto:[email protected])

 
 
 
# Articles  
 
Code example for recording soft navigations and Core Web Vitals
 
### [Experimenting with measuring soft navigations](https://developer.chrome.com/docs/web-platform/soft-navigations-experiment)
 
[Barry Pollard](https://www.tunetheweb.com/) & [Yoav Weiss](https://blog.yoav.ws/)
Measuring web performance in SPAs isn’t easy. Learn how the soft navigation experiment can help get better Core Web Vitals data and provide feedback!
 
Chart of LCP by navigation type
 
### [LCP & FCP on Single Page Application on Soft Navigations](https://tamethebots.com/blog-n-bits/lcp-fcp-soft-navigations)
 
[Dave Smart](https://tamethebots.com/)
Take a look at this experiment on collecting data for Largest Contentful Paint and First Contentful Paint soft navigations.
 
INP bar chart showing split between good, p75 and poor INP
 
### [INP meets Puppeteer](https://calendar.perfplanet.com/2023/inp-meets-puppeteer/)
 
[Tsvetan Stoychev](https://www.linkedin.com/in/tsvetanstoychev/)
Find out how to use Puppeteer to automate debugging and fix Interaction to Next Paint (INP) issues. There’s also a boilerplate Puppeteer project for you to use!
 
The Core Web Vitals page of Google Search Console.
 
### [How Core Web Vitals affect SEO](https://vercel.com/blog/how-core-web-vitals-affect-seo)
 
[Malte Ubl](https://www.industrialempathy.com/)
A quick primer on Core Web Vitals data used for ranking purposes, including several not widely known caveats.
 
### [setTimeout(0) vs requestAnimationFrame](https://phuoc.ng/collection/this-vs-that/set-timeout-zero-vs-request-animation-frame/)
 
[Phuoc Nguyen](https://phuoc.ng/)

Learn the difference between setTimeout(0) and requestAnimationFrame, and how to use them to your web performance advantage.

 
 
 
# Tools  
 
Logos for 8 live chat tools including Intercom, Helpscout, Messenger, Drift, Chatwoot, Userlike, Front and Hubspot
 
### [React Live Chat Loader now supports HubSpot and Front](https://calibreapp.com/changelog#01-rlcl-hubspot-front-support)
 
[Rob Morieson](https://electricanimals.com/)
Want to mitigate web performance issues caused by live chat tools? Now, this open source library supports 8 chat providers!
 
 
Calibre
 
This email is brought to you by the team at [Calibre](https://calibreapp.com). We automate web performance testing, reporting and alerting, so you don’t have to.
 
 

Performance Newsletter is sent from the traditional lands of the Wurundjeri people of the Kulin nation. We acknowledge that sovereignty was never ceded and pay respects to the Elders past and present.

Send your suggestions, links and feedback to [[email protected]](mailto:[email protected]).

[View or share this email →]()
[Quickly unsubscribe →]()
[Browse older issues →]()

**Sent by**
Calibre Analytics

V119 / 425 Smith Street
Ngár-go
Fitzroy VIC 3065
Australia

 
Don't miss what's next. Subscribe to Performance Newsletter:
← Newer ⚡ 145: 2024 Performance inequality gap Older → ⚡ 143: Long Animation Frames API and INP
perf.email
Bluesky
LinkedIn