Spade shape with cobalt blue background

Performance Newsletter

Archives
Calibre Monitoring
Free Speed Tools
Log in
Subscribe
13 June 2024

⚡ 153: Analysing JavaScript performance in Chrome DevTools

͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏
 
Performance Newsletter
[issue 153 ]()
 
#### Editor’s note
 
There’s been a steady supply of articles describing the failures of the modern web in anything but very favourable conditions, but trying to effectively use the internet on the South Pole wasn’t on my bingo card. While that’s a more extreme case study, to, let’s say, riding a rural bus to work, it still highlights the same issues.
 
We’re not only lacking in performance optimisations, assuming everyone has the bandwidth for ginormous downloads, but also don’t cater to failure scenarios that don’t apply to us. Surely, we can do better?
 
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  
 
Performance trace recording in Developer tools showing dropped frames
 
### [Comprehensive guide to JavaScript performance analysis using Chrome DevTools](https://blog.jiayihu.net/comprenhensive-guide-chrome-performance/)
 
[Jiayi Hu](https://blog.jiayihu.net/)
Learn how to debug and improve performance in Chrome DevTools with this in-depth analysis carried out on a real-world canvas library. The result was a whooping reduction of task duration from  ~20ms to 77ms.
 
Expensive style recalculation affecting almost every element on the page.
 
### [How deep is your DOM?](https://frontendatscale.com/blog/how-deep-is-your-dom/)
 
[Maxi Ferreira](https://frontendatscale.com/)
Do you know the Avoid excessive DOM size Lighthouse audit? While modern browsers are extremely capable rendering sites and apps, there becomes a point when style recalculations caused by DOM depth negatively affect performance.
 
The macOS updater. No pause button! Was I expected to leave my laptop on, connected to the Internet,                   and untouched, for 15 days??
 
### [Engineering for slow Internet](https://brr.fyi/posts/engineering-for-slow-internet)
 
[Brr](https://brr.fyi/)
I didn’t know I wanted to read a performance case study of using the web from Antarctica until I read one. An excellent article pinpoint the importance of designing and building for resilience.
 
Chart for opening the hotel overlay optimisations
 
### [Optimizing INP for a React App & performance learnings](https://www.iamtk.co/optimizing-inp-for-a-react-app-and-performance-learnings)
 
[TK Kinoshita](https://www.iamtk.co/)
Another in-depth study of analysing and bettering Interaction to Next Paint, this time with 69% improvement results, specifically focusing on React-related strategies.
 
 
 
# Case Studies  
 
Downward trend for page render times by TV OS (Samsung-Tizen and WebOS-LG).
 
### [How Disney+ Hotstar increased weekly card views by 100% on living room devices by reducing INP by 61%](https://web.dev/case-studies/hotstar-inp?hl=en)
 

[Bhuvaneswaran Mohan](https://www.linkedin.com/in/bhuvaneswaran-mohan/) & [Saurabh Rajpal](https://www.linkedin.com/in/imsaurabhrajpal/)

Find out how Disney+ Hotstar achieved a 61% improvement by bringing INP values down to 272 milliseconds** **on their tvOS application.
 
 
 
# Browsers  
 
### [An even faster Microsoft Edge](https://blogs.windows.com/msedgedev/2024/05/28/an-even-faster-microsoft-edge/)
 
The Microsoft Edge Team has been hard at work making the browser UI faster—it’s now **42% faster** for Edge users and a whopping **76% faster** for those of you on a device without an SSD or with less than 8 GB of RAM. Well done!
 
 
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:
Older → ⚡ 152: How to achieve near-instant loading
perf.email
Bluesky
LinkedIn