A roundup of all the key announcements from the 2021 Chrome Dev Summit, with the links you need to find out more.
This post rounds up all the key announcements from the 2021 Chrome Dev Summit, with the links you need to find out more.
Make the web more interoperable
Web compatibility is one of the biggest challenges for web developers,
and so Google has been working with other browser vendors to fix the top five compatibility pain points:
flexbox,
grid,
position: sticky
,
aspect-ratio
,
and transforms.
The work has already led to improvements in these key areas. You can read about those in the Compat 2021 mid-year update.
Allow new classes of applications to run on the web
Project Fugu is an effort that aims to allow new classes of applications to the web. You can keep up to date with progress on the Fugu APIs at fugu-tracker.web.app.
Adobe recently announced that they are bringing Photoshop to the web, a feat made possible by collaboration between Adobe, Google, and web standards organizations. Find out more in the post Photoshop's journey to the web.
Ensure privacy
Many common web functions rely on third-party cookies and other cross-site tracking mechanisms that weren’t designed with privacy in mind, making it difficult for developers to meet the growing need for privacy.
We are working with the web community and industry stakeholders to develop new privacy-preserving technologies to support the ecosystem, with the aim to phase out third-party cookies and reduce covert tracking and browser fingerprinting.
Find out about this work on the Privacy Sandbox site. We also have information and guides to the proposals for developers, a monthly update or changes and progress, and information on the timeline and testing details for changes to the user-agent string.
Improve Core Web Vitals
We've been working with the developers of popular JavaScript frameworks to improve Core Web Vitals, and as part of that work have identified two new metrics that we'd love your feedback on. Read about overall responsiveness and smoothness, then let us know what you think.
Also announced is an updated version of PageSpeed Insights, a new Recorder Panel for Chrome DevTools, currently available in Canary, and a new user flow API for Lighthouse.
Enable new web platform features
RenderingNG is an ambitious refactoring of Chromium's rendering engine, a project that is fixing long standing bugs in Chrome, and also unlocking new features. This includes one feature that has been the top request from web developers for many years—container queries.
Container queries look familiar to anyone who has ever used a media query to create a responsive design.
However, inside of querying the viewport size, they allow you to query the size of the container your component is in.
Google has been working on a trial implementation of the emerging specification, behind the #enable-container-queries
flag in Chrome.
Read a blog post covering RenderingNG in detail, or watch this video to get all the key details of how this work unlocks implementation of features that were once thought impossible to land.
Help you to create beautiful and responsive sites
The new responsive design is so much more than just screen—or container—size. You can learn how to create modern responsive sites in our course Learn Design. The first five modules launch today, the rest will be posted over the coming weeks.
New CSS properties have landed in Chrome and other browsers this year to make creating beautiful experiences easier.
Find out more about accent-color
and size-adjust
.
To help you quickly take advantage of new CSS, we have launched a set of layout patterns. These will give you a robust starting point for many common interface patterns.
Provide courses to help you learn web technology
In addition to Learn Design, we are launching new modules for Learn CSS, our comprehensive CSS course launched earlier this year.
We have also developed a complete course helping you to design functional and accessible forms—Learn Forms. Along with these courses, you can find the first few modules of Learn PWA.