Get NitroPack with up to 37% OFF
Once you start with NitroPack, you can freely choose your integration platform.
Everything you need to know about
NitroPack features and compatibilities.
Whether you run a blog or
an agency, we have a
partnership opportunity for you!
The place to learn how to
improve your web performance,
how to get the most out of
NitroPack, and what is coming
next to our product.
Chrome Dev Summit is an annual event where engineers, industry leaders, and developers share the latest tools and updates coming to the Google Chrome browser and discuss the future of the web.
A few days after this year’s conference, we’re here to do a quick recap on the most exciting announcements in terms of web performance, including:
We’ll wrap this up by sharing our thoughts on the upcoming updates and our plans on NitroPack’s development based on the latest announcements.
Let’s dive right into it!
Probably the biggest announcement of the event (for us at NitroPack) was that two new Core Web Vitals metrics are in the pipeline. Here’s what Rachel Andrew from the web.dev team shared:
The two new metrics which are currently in development are Smoothness and Responsiveness.
Source: Chrome Dev Summit 2021 | Keynote: What's new in Chrome
Smoothness is meant to measure the scrolling and animation smoothness of a page.
This new metric aims to better understand how often users experience pages that “stutter” and “freeze” due to dropped animation frames, how severe it is, and what is the overall impact.
However, the metric won’t focus entirely on counting frames:
To achieve that, a proposed Percent Dropped Frames metric would calculate the number of dropped frames and present an average score which is supposed to reflect how smooth the animation is from the user’s perspective:
Responsiveness is the second upcoming metric, and it is meant to capture the end-to-end latency of individual events and the overall responsiveness of a page throughout its lifetime.
While the First Input Delay (FID) metric captures the delay portion of input latency, Responsiveness will capture the full event duration and interactions:
The Chrome dev team is still exploring different approaches to measure the total interaction latency from a group of individual event durations and then defining an aggregate score for a page visit:
The upcoming Core Web Vitals metrics weren’t the only stars of this year’s conference.
Chrome’s team shared some exciting news about improving their performance tools.
There is no doubt that PageSpeed Insights (PSI) is the place to go when you want to find out more about your site’s performance.
However, the PSI code base is ten years old, and the time for a complete revamp has finally come.
Before proceeding with the PSI’s redesign, let’s take a look at how Google’s tool looked:
Source: web.dev
With the PSI UI redesign, all of the above-mentioned concerns are addressed.
Here’s what’s new:
Clear separation between lab and field data
Several major changes were made to the way lab, and field data are displayed in PSI:
Source: web.dev
Source: web.dev
Labels for mobile and desktop performance
Source: web.dev
New position for the Origin Summary
The Origin Summary, which provides the aggregated CrUX score for all pages from the origin, previously appeared on click of a checkbox:
In the new design, the Origin Summary appears in a separate tab, under the “Field Data” section:
Source: web.dev
Additional Information
Additional helpful information is now displayed under the field data metrics to help users better understand the difference between lab and field data:
Source: web.dev
Expand view
A “Expand view” feature was added to the new PSI that will allow website owners to view granular details for the Core Web Vitals metrics:
Source: web.dev
The new Lighthouse API allows lab testing at any point within a page's lifespan. This means that you will be able to analyze the user flow by simulating scrolling, clicks, and loading of other pages instead of your pages being assessed only during loading.
Furthermore, the User Flow API will make it easier to diagnose performance issues within the user journey and get suggestions for improvement.
Source: web.dev
The support for analyzing user flows has been added to DevTools as well.
With the newly added Recorder Panel in DevTools, you will be able to record the entire user journey on your website. Furthermore, you can easily view and analyze all visitors’ actions like navigations, key presses, and link clicks directly in the panel.
Additionally, the newest DevTools feature can be replayed, downloaded, and measured in the Performance panel.
Source: web.dev
There isn’t a better way to summarize what we think about this year’s Dev Summit than quoting our Chief Engineer:
The upcoming Core Web Vitals metrics, measuring the animation/scrolling smoothness and the overall responsiveness of a page throughout its lifetime, are aspects that we’ve been working on for the last couple of months and testing with our Speed Insiders.
Bringing the Smoothness and Responsiveness metrics to life will only show the real-world impact of our work.
We’re excited about PageSpeed Insights' UI redesign and the new User Flow API as well.
The revamped PSI is a really big step forward in terms of helping users better understand the difference between Lab data and Field data, how they are calculated, and why Field data is the one worth focusing on. It's definitely an upgrade that we love to see as we're strongly advocating for the importance of real-world data.
As far as the User Flow API is concerned, It will make the process of identifying and debugging issues easier. Until now, we had to run tests manually, but with the release of this API, we’ll be able to automate the process, save time, and relocate our resources to developing and upgrading NitroPack’s features.
Overall, Chrome’s Dev Summit ‘21 gave proof that we’re moving in the right direction, and we’re thrilled about the future.
In the following months, we’ll share behind-the-scenes data of how NitroPack performs against the upcoming Core Web Vitals metrics.
Keep an eye on our blog or subscribe to our newsletter (available to existing NitroPack customers only for now) to be sure you’re not going to miss anything!
Niko has 5+ years of experience turning those “it’s too technical for me” topics into “I can’t believe I get it” content pieces. He specializes in dissecting nuanced topics like Core Web Vitals, web performance metrics, and site speed optimization techniques. When he’s taking a breather from researching his next content piece, you’ll find him deep into the latest performance news.
