A Three-Day Check-In on the Web Platform

web.dev LIVE wrapped up its three-day online series, bringing together the web community for a set of updates focused on keeping the platform stable, powerful, and accessible. Sessions were kicked off across different regional timezones each day, and recordings of all the talks are available on YouTube for those who missed the live streams. The content also serves as a lead-in to a series of regional community events organized by Google Developer Groups, which will offer deeper dives into the topics covered.

The Evolution of Site Speed Metrics

Building on the Chrome team’s Web Vitals initiative, Google Search has confirmed it will factor page experience into its ranking criteria, using Core Web Vitals as the foundation. For 2020, the framework centers on three primary pillars of user experience: loading performance, interactivity, and visual stability.

An illustration of the Core Web Vitals.
  • Largest Contentful Paint (LCP) tracks perceived load speed, marking the moment the main page content is likely visible.
  • First Input Delay (FID) measures the responsiveness of a page when a user first attempts to interact with it.
  • Cumulative Layout Shift (CLS) quantifies unexpected movement of content during the page load process.

During the event, dedicated sessions covered optimization strategies for these metrics and techniques for inspecting core vital values directly within Chrome DevTools.

Benchmarking Your Build Tooling

For developers wrestling with complex build configurations, the new tooling.report resource offers a data-driven approach to selecting the right tools for a project. The site evaluates whether build tools enable users to follow web development best practices, helping with decisions ranging from choosing a starter tool to assessing the risks of a migration.

The team designed a suite of tests for this purpose, working closely with build tool authors to ensure usage was accurate and fair to each project. The inaugural release covers webpack v4, Rollup v2, Parcel v2, and a Browserify-with-Gulp setup, with the architecture left open for community contributions.

A screenshot of the tooling.report UI.

Developers can propose new best practices to test via GitHub issues, or contribute tests for tools not included in the initial launch. The rationale behind the platform was detailed in a dedicated session during the event.

The landscape of web cookies is changing. Chrome’s proposal to restrict cookies to first-party contexts by default—forcing explicit marking for third-party use—has seen adoption momentum across Firefox and Edge. This change serves primarily as a mitigation against Cross-Site Request Forgery attacks.

Although a temporary rollback was implemented in response to the pressures of the COVID-19 pandemic, Chrome will resume rolling out these SameSite cookie changes with its version 84 Stable release, affecting all versions from 80 upwards. These adjustments are part of the wider Privacy Sandbox initiative, which continues to solicit feedback on standards proposals through W3C forums. A session on Cross-Origin Opener and Embedder Policies (COOP and COEP) also covered additional security mitigations, specifically how specific headers can isolate sites to defend against vulnerabilities like Spectre.

Closing the Gap with Native Applications

Work continues to bridge the divide between the web and platform-specific applications under the Project Fugu capabilities banner. Recent developments focus on three key fronts to enhance the quality and reach of Progressive Web Apps (PWAs).

First, control over installation is being redefined with tools like Bubblewrap. This library and CLI simplifies the process of packaging a PWA for distribution via the Play Store; it now powers PWABuilder.com, bringing app store publication to just a few clicks for qualifying applications.

Second, deeper operating system integration is arriving through new APIs. This includes system-level interfaces for sharing and receiving content, app icon badging for notifications, and App Shortcuts for rapid task initiation, expected with Chrome 84.

Finally, new scenarios are opening up to the web platform. Developers can now enable direct read and write access to the user’s local file system for editor-style apps, and query lists of locally installed fonts for integration into design interfaces.

DevTools: Issues, Vision Deficiencies, and Core Web Vitals

Chrome DevTools introduced an Issues tab to move critical problems out of the Console and reduce notification fatigue. Initially, it focuses on three categories: cookie problems, mixed content, and issues related to Cross-Origin-Embedder-Policy (COEP). These are specifically relevant as the web moves towards a more privacy-first model.

A screenshot of the Issues tab.

To help developers align with Google's recommended thresholds, the three Core Web Vitals metrics are now displayed directly in the DevTools Performance panel. This allows for immediate tracking of how a page performs against LCP, FID, and CLS targets.

For accessibility work, a color vision deficiencies emulator has been added. It allows developers to preview a page with settings that emulate blurred vision and various other types of vision deficiencies.

A screenshot of the vision deficiencies emulator.

Lighthouse 6.0: New Measurements and Scoring Updates

The latest version of Lighthouse shifts the focus of its analysis to more consistent and relevant metrics for measuring the quality of user experience. It now supports the Core Web Vitals. Since Lighthouse operates in a lab environment, it uses Total Blocking Time (TBT) as a proxy for First Input Delay (FID), which can only be accurately measured in the field. It also measures Largest Contentful Paint (LCP) and Cumulative Layout Shift (CLS).

To validate the relevance of its suggestions, the Lighthouse team removed three older metrics: First Meaningful Paint, First CPU Idle, and Max Potential FID. These were dropped due to issues like metric variability and a belief that the newer metrics better represent the experiences they were intended to measure. Feedback from users has also led to adjustments in how much weight each metric carries in the overall Performance score.

The new version includes a scoring calculator that lets developers explore the changes. It offers a direct comparison between version 5 and version 6 scores. When you run an audit, the report includes a link to the calculator with your results pre-populated.

The 6.0 update also adds several new audits, particularly around JavaScript analysis and accessibility.

A list of the new audits.

Going Further

Beyond these highlights, all event sessions are available for review, and regional events are listed on the web.dev site. The web.dev newsletter remains a way to receive similar content directly via email.