Spade shape with cobalt blue background

Performance Newsletter

Archives
Calibre Monitoring
Free Speed Tools
Log in
Subscribe
3 October 2018

Issue 19—Native Lazy Load, Perceived performance, measuring layout and more!

Calibre Performance Newsletter #### PerformanceNewsletter
#### Issue 19
#### Editor’s Note

It's been a while since the last performance newsletter — we’ve been hard at work growing [Calibre](https://calibreapp.com/). I'm excited to announce that we're looking to hire for two roles: Customer Success Engineer & Platform Developer. Given that you’re reading this newsletter, you're the perfect audience for these roles. [See more details and apply here.](https://calibreapp.com/careers)

This issue is a doozy! Be sure to share it around.  ✌🏻

— [Ben](https://twitter.com/benschwarz)
#### FUTURE LOOK ## A native lazy load for the Web platform A new Chrome feature dubbed “Blink LazyLoad” is designed to dramatically improve performance by deferring the load of below-the-fold images and third party iFrames. The goals of this bold experiment are to improve the overall render speed of content that appears within the users viewport (also known as above-the-fold), as well as, reduce network data and memory usage. ✨ [GET LAZY →](https://calibreapp.com/blog/2018-08-16-native-lazy-load/)
#### TALK ## Perceived performance

[Eli Fitch](https://twitter.com/elifitch) shares his insights of how to improve perceived performance by studying how people switch from active to passive modes as they use the web. 

[The slide deck](http://assets.eli.wtf/talks/perceived-perf-perfmatters-2018/) is great, but I'd recommend watching the [40 minute talk in full](https://www.ustream.tv/recorded/114915879) during some down time. 

[ViEW TALK →](https://www.ustream.tv/recorded/114915879)
#### DEEP DIVE ## Accurately measuring layout on the web Browser layout is one pocket of performance that very few people have a firm grasp on. This post by Nolan Lawson explains how to instrument style recalculation, layout and render accurately. It's a great, focused deep dive that even seasoned performance engineers will benefit from.  [MEASURE LAYOUT →](https://nolanlawson.com/2018/09/25/accurately-measuring-layout-on-the-web/)
#### WEB PLATFORM ## Inside look at modern web browser This ultra-cute 4-part illustrated series by [Mariko Kosaka](https://twitter.com/kosamari) explains how Chrome (and modern browsers in general) fetch and render content using processes and threads. If you've ever wondered how a browser fits together this is a great overview to get you started. I came for the content but stayed for the illustrations. Cute!  [PEEK INSIDE CHROME →](https://developers.google.com/web/updates/2018/09/inside-browser-part1)
#### JAVASCRIPT ## Idle Until Urgent In this deep dive article, [Philip Walton](https://twitter.com/philwalton) describes how write JavaScript in such a way that it's execution is deferred until the browser is idle, but runs as soon as it is required. Phil runs through how to achieve this using a small package that he authored, called [idlize](https://github.com/GoogleChromeLabs/idlize). The approach is nothing short of incredible. Very clever. Make some time for this. ☕️ [DEFER, RUN →](https://philipwalton.com/articles/idle-until-urgent/)
#### RETROSPECTIVE ## Ten years of speed in Chrome [Addy Osmani](https://twitter.com/addyosmani) takes a few moments to celebrate Chrome's dedication to performance since the inception of the browser ten years ago. What a monumental impact the Chrome team has made on the world of browser tooling, performance and web platform knowledge. Thanks folks! [READ →](https://blog.chromium.org/2018/09/10-years-of-speed-in-chrome_11.html)
#### TOOLING ## Speedscope

If you've ever discovered a slow method in your application and haven't been able to put your finger on exactly why, then maybe you should give Speedscope a shot. 

Speedscope is a flamegraph visualiser created by [Jamie Wong](https://twitter.com/jlfwong) from Figma. It can be used to visualise traces from Chrome Devtools, Node.js, Ruby, Go, Instruments.app and more. 

[PROFILE YOUR APPS →](https://www.speedscope.app)
#### Spread the word about perf.email We’d love to see more people reading [perf.email](https://perf.email/); if you’d like to help—forward this email to a friend, tweet, or shout from a rooftop. It goes a long way. ✌🏻

#### Brought to you by ♠ [Calibre](https://calibreapp.com/). Make the web fast for everyone. [Update your profile]() [Unsubscribe]() [View in a browser]()
Don't miss what's next. Subscribe to Performance Newsletter:
← Newer All about Time to Interactive, WASM, How HTTPs Ruined everything, and more! Older → Issue 18—The cost of third-party scripts, performance auditing, variable fonts and more!
perf.email
Bluesky
LinkedIn