Chrome Dev Summit 2021: The key takeaways
Chrome Dev Summit 2021 was packed with updates across performance, privacy, and new web platform capabilities. Here's a summary of the most important announcements and where to find the details.
Closing the browser compatibility gap
Google continues to collaborate with other browser vendors to address the top five CSS compatibility pain points: flexbox, grid, position: sticky, aspect-ratio, and transforms. The progress made so far is documented in the Compat 2021 mid-year update.
Bigger apps, better privacy
Project Fugu, which aims to bring new classes of applications to the web, remains a central focus. You can track the status of these APIs at fugu-tracker.web.app. A notable success is Adobe's announcement that Photoshop is coming to the web, an effort made possible through collaboration with Google and web standards organizations. Learn more in the post Photoshop's journey to the web.
On the privacy front, the team is working with the community to phase out third-party cookies and reduce covert tracking and fingerprinting. The Privacy Sandbox site is the central hub for this work, while developers can find detailed proposals and guides at the Privacy Sandbox documentation. There is also a monthly update series and a dedicated timeline for the user-agent string reduction.
New metrics and tools for performance
Work with popular JavaScript frameworks to improve Core Web Vitals has led to two new proposed metrics that need community feedback: overall responsiveness and smoothness.
In addition, there is an updated version of PageSpeed Insights, a new Recorder Panel in Chrome DevTools (currently available in Canary), and a new user flow API for Lighthouse.
RenderingNG and container queries
RenderingNG, Chromium's ambitious rendering engine refactor, is fixing long-standing bugs and unlocking new features, most notably container queries. This long-requested feature allows you to query the size of a component's container rather than the viewport. It is currently available in a trial implementation behind the #enable-container-queries flag in Chrome. A detailed blog post on RenderingNG and a video cover how this work enables features previously thought impossible.
New CSS features and learning resources
The concept of "new responsive" design extends beyond screen and container size. To help developers build modern sites, the Learn Design course has launched its first five modules, with more to come. Additionally, details are available on the newly supported accent-color and size-adjust CSS properties, and a new set of layout patterns offers starting points for common interface patterns.
Other educational releases include new modules for the Learn CSS course, the full Learn Forms course, and the first few modules of Learn PWA.
