2021 Chrome Dev Summit で発表された主な内容をまとめました。詳細を確認する必要があるリンクも記載しています。
この投稿では、2021 年の Chrome Dev Summit で発表された主な内容をすべてまとめ、詳細を確認するためのリンクも記載しています。
ウェブの相互運用性を高める
ウェブ互換性はウェブ デベロッパーにとって最大の課題の一つです。そのため Google は、他のブラウザ ベンダーと協力して、互換性に関する 5 つの主要な問題（flexbox、grid、position: sticky、aspect-ratio、transforms）を解決してきました。
これらの取り組みにより、すでにこれらの主要分野で改善が進んでいます。詳しくは、Compat 2021 年半ばの更新をご覧ください。
新しいクラスのアプリケーションをウェブで実行できるようにする
Project Fugu は、新しいクラスのアプリケーションをウェブに許可することを目的とした取り組みです。Fugu API の進捗状況については、fugu-tracker.web.app で最新情報をご確認ください。
Adobe は最近、Photoshop をウェブに導入することを発表しました。これは、Adobe、Google、ウェブ標準組織のコラボレーションによって実現されたものです。詳しくは、Photoshop のウェブへの移行に関する投稿をご覧ください。
プライバシーを確保する
一般的なウェブ機能の多くは、プライバシーを念頭に置いて設計されていないサードパーティ Cookie やその他のクロスサイト トラッキング メカニズムに依存しているため、デベロッパーはプライバシーに対する高まるニーズに対応することが困難になっています。
Google は、ウェブ コミュニティや業界の関係者と連携して、サードパーティ Cookie の段階的な廃止と、隠れたトラッキングやブラウザ フィンガープリントの削減を目的とした、エコシステムを支える新しいプライバシー保護技術を開発しています。
この取り組みについて詳しくは、プライバシー サンドボックスのサイトをご覧ください。また、デベロッパー向けの提案に関する情報とガイド、月次更新または変更と進捗状況、ユーザー エージェント文字列の変更に関するタイムラインとテストの詳細もご利用いただけます。
Core Web Vitals を改善する
Google は、Core Web Vitals の改善に向けて、一般的な JavaScript フレームワークのデベロッパーと連携してきました。その一環として、2 つの新しい指標を特定しました。この指標について、皆様のご意見をお聞かせください。全体的な応答性とスムーズさについて確認して、ご意見をお聞かせください。
また、PageSpeed Insights の更新版、新しい Chrome DevTools の Recorder パネル（現在は Canary で利用可能）、新しい Lighthouse のユーザーフロー API も発表されました。
新しいウェブ プラットフォーム機能を有効にする
RenderingNG は、Chromium のレンダリング エンジンの大規模なリファクタリングです。このプロジェクトでは、Chrome の長年の不具合を修正し、新しい機能を実現しています。これには、長年にわたりウェブ デベロッパーから最もリクエストの多かった機能であるコンテナクエリも含まれます。
コンテナクエリは、メディアクエリを使用してレスポンシブ デザインを作成したことがある人なら誰でもすぐに使用できます。ただし、ビューポートのサイズをクエリする際に、コンポーネントが配置されているコンテナのサイズをクエリできます。Google は、Chrome の #enable-container-queries フラグを使用して、新しい仕様の試験運用版の実装に取り組んでいます。
RenderingNG の詳細に関するブログ投稿を読むか、こちらの動画を視聴して、この作業によって、かつては実現不可能と思われていた機能の実装を可能にする方法の詳細を確認してください。
美しくレスポンシブなサイトを作成できます
新しいレスポンシブ デザインは、画面サイズ（またはコンテナ サイズ）だけを重視するものではありません。最新のレスポンシブ サイトを作成する方法については、デザインを学ぶをご覧ください。最初の 5 つのモジュールは本日リリースされ、残りのモジュールは今後数週間かけて投稿されます。
今年、Chrome などのブラウザに新しい CSS プロパティが導入され、美しいエクスペリエンスの作成が容易になりました。詳しくは、accent-color と size-adjust をご覧ください。
新しい CSS をすぐに活用できるように、一連のレイアウト パターンをリリースしました。これらのパターンは、多くの一般的なインターフェース パターンの堅牢な出発点となります。
ウェブ技術を学ぶためのコースを提供します。
Learn Design に加えて、今年初めにリリースされた包括的な CSS コースである Learn CSS の新しいモジュールもリリースされます。
また、機能的でアクセスしやすいフォームを設計するための包括的なコース「フォームの学習」も用意されています。これらのコースに加えて、PWA の学習の最初のモジュールもご利用いただけます。