この記事は Ben Galbraith、Dion Almaer による Chromium Blog の記事 "Google I/O 2019: What's new with Chrome and the Web" を元に翻訳・加筆したものです。詳しくは元記事をご覧ください。
今年、ウェブは生誕 30 周年を迎えました。なんとすばらしい 30 年だったことでしょうか。ウェブ プラットフォームは、シンプルなハイパーテキスト ドキュメントを支えるものから、デザインの最先端で臨場感あふれるダイナミックな体験を実現するものへと発展しています。
この先も世界のニーズは進化を続けるでしょう。私たちが世界のウェブ コミュニティに参加し続け、将来のニーズを満たすようにこのプラットフォームを適応させ、改善する動機は、その点にあります。私たちが集中的に取り組んでいるのは、ユーザーの信頼と安全を中心に据えつつ、ウェブを高速かつ強力なものにすることです。
ウェブの即時性というビジョン
ウェブでは、スピードが重要です。ユーザーは読み込み速度に非常に敏感で、これがビジネスに直接的な影響を与えることがわかっています。
そこで、ブラウザを高速かつ軽量にしつつ、デベロッパーの経験を活かして多くのことを実現するために、私たちは懸命に努力を続けています。起動時のボトルネックに注目することで、ローエンド端末での Chrome の起動時の読み込み速度を 50% 短縮することができました。すべての端末の平均では、10% の短縮になっています。さらに、スクロールのパフォーマンスが 18% 向上し、V8 によって、実際のアプリで JavaScript のメモリ使用量が最大 20% 減少しています。
ブラウザの効率化に加えて、デベロッパーの重荷を取り除くための機能追加も行っています。その中からいくつかご紹介します。
ナビゲーションについて言えば、ユーザーがウェブを横断する方法を根本的に変革する新しいテクノロジー、Portals があります。Portals は、iframe と同じように、コンテンツをページ内に直接埋め込むものです。しかし、標準の iframe とは違い、「アクティベート」してトップレベルのページになることができます。これにより、ウェブのあらゆる場所で瞬間的な遷移が可能になります。オリジナル ページの UI のパーツを安全な方法で個別に保持できる高度な体験なので、当初のモデルの理想を維持したまま、シームレスなオーバーレイを提供できます。
I/O では、デベロッパーが Portals や関連 API を使ってプリフェッチ、画面遷移の拡張、サイト間のコンテキスト情報の交換などをサポートする方法をお知らせしました。現在、Canary 版の Chrome でフラグを使うと、Portals API を利用できます。この新しいプリミティブを使ってデベロッパーの皆さんがどんなものを構築するのか、楽しみにしています。
特に期待を寄せているもう 1 つのテクノロジーが、Web Packagingです。これは、ウェブ デベロッパーとウェブサーバーとの間の新しい取り決めです。Web Packaging を使うと、ページ読み込みのモデルが変わり、ブラウザがオリジン サーバーからページをリクエストするモデルから、ピア端末を含めてどこからでも読み込めるモデルになります。
![]()
これにより、コンテンツをプリロードしてページを即座に読み込むという柔軟性がブラウザに生まれます。さらに、この処理はプライバシーが保護された状態で行われます。このビジョンの第 1 フェーズである Signed Exchangeは、Chrome でデベロッパーが利用できるようになりました。
ここで説明したのは、ウェブの即時性を上げる機能の一部です。しかし、それが成功するかどうかは、デベロッパーがウェブを高速にし、パフォーマンスを維持できるかどうかにかかっています。そこで、その助けとなるさまざまなツールを追加しました。
2017 年に導入した Chrome UX レポートは、実際の指標を提供することにより、ユーザーが体験しているウェブページについて理解を深めてもらうためのものです。現在、このレポートには 600 万近くのオリジンのデータセットが含まれており、Google Search Consoleの最新のスピード レポートなど、多くのツールで活用されています。このレポートは現在ベータ版で、こちらからプログラムへの登録やフィードバックの送信ができます。
デベロッパーの皆さんにさらに幅広く実際の指標を提供するため、Firebaseチームは Performance Monitoringツールを強化し、ウェブアプリをカバーするようになりました。
また、パフォーマンスというレールから外れないように、多くのトップサイトがビルド環境で「パフォーマンス予算」を実装しています。そこで、Lighthouse にパフォーマンス予算を直接組み込み、本番サイトがパフォーマンス リグレッションの影響を受ける前に通知するようにしています。
特に差し迫った重要なニーズに対処するために、コミュニティと密接に連携し、たくさんの機能を非常に速いペースで完成させています。中でもすばらしい機能に、ファイル システム アクセス、ストレージの無制限割り当て、SMS ベース認証などの機能があります。認証プロセスで「ワンタイム パスワード」が重要な部分を占めているマーケットで開発しているデベロッパーには、SMS ベース認証が特に重要になります。
この分野には引き続き力を注ぎたいと考えていますが、あなたのアプリをネイティブのシステム共有機能と連携させることができる Web Share Target APIは既にリリースしており、本日の I/O でリリースした Web Perception ツールキットなどの体験を実現する Shape Detection APIも開放しています。このツールキットを使うと、モバイルカメラを組み込んだり、ウェブサイトの利用効率をアップしたりできます。
モバイルでのこのような強力な機能の提供に加えて、質の高いウェブ エクスペリエンスを構築するデベロッパーのリーチを広げたいとも考えています。そこで、デベロッパーがウェブ コンテンツを Android アプリに組み込めるようにする Trusted Web Activityをリリースしました。インド最大の手頃な価格のホテル ネットワークである OYO Roomsなどの企業は、既に Trusted Web Activity を使って軽量版エクスペリエンスを構築しています。これは、一部のマーケットのパートナーでよく見られるパターンです。
しかし、私たちにとって一番うれしいのは、デスクトップ機能の進展です。Web Assembly などのテクノロジーや個々のメディア、そして生産性を向上する API 群によって、新しいユースケースを数多く実現できています。Huluや Google の Duoは、現在のウェブで実現できるすばらしい事例を表しています。また、Slack が、オフライン対応したデスクトップ アプリのウェブ版を今年中にリリースするために力を尽くしていることをうれしく思います。
昨年、フルウィンドウのサポートや一般的なデスクトップ アプリ機能を必要とするウェブアプリを実現するため、デスクトップ PWA が ChromeOS に対応しました。そして、このサポートは Windows、Mac、Linux に広がっています。
デスクトップ PWA には目覚ましい勢いがあり、ユーザーが高品質な PWA を見つけて簡単にインストールできるように、私たちの役割を果たしてゆきたいと考えています。そこで、Chrome の UI のアドレスバー内に直接 [インストール] ボタンを作って見つけやすさを向上させました。これは、デベロッパーが忠実なユーザーに対するエンゲージメントを向上させ、すばらしい体験を構築できるようにするための 1 歩です。この点については、さらに改善してゆきます。
来年中に、ウェブで次世代のゲーム、生産性、メディア、ソーシャル アプリを実現するさらなる可能性を実現したいと考えています。もちろん、ユーザーの安全性や信頼性といった中核原則はすべて維持します。
私たちは、以上の変更によって、ウェブにおけるユーザーのプライバシーとセキュリティが向上すると信じています。しかし、それには時間がかかるということもわかっています。そのため私たちはウェブのエコシステムと連携し、Chrome がどのようにポジティブなユースケースをサポートし続けることができるかを理解し、よりよいウェブを構築してまいります。
そこで、web.devを構築し、Lighthouse という測定ツールとガイドを 1 か所にまとめました。このサイトを改善し、現在、パフォーマンス、安全性、アクセシビリティ、レジリエンスなどを実現する 200 以上のわかりやすいガイドを参照できるようになっています。I/O では、Reactを始めとして、皆さんが使うツールのガイドを作成する予定もお知らせしました。
![]()
現在は、デベロッパー レポートや利用しているフレームワークについての改善のヒントを提供できるように、Lighthouse に同レベルのカスタマイズを追加する作業を行っています。Wordpress 用のガイドは既に組み込まれています。2019 年およびそれ以降で、さらに追加する予定です。
この 30 年間で、ウェブは長い道のりを歩んできました。デベロッパー コミュニティの皆さんや他のブラウザと協力して、多くの人がどこからでも情報やサービスにアクセスできるようにするという共通のミッションに向かえることは私たちのよろこびです。
Google I/O Extended: Recap Live Japan 2019 より、日本語で行われたセッション
Reviewed by Eiji Kitamura - Developer Relations Team![]()
今年、ウェブは生誕 30 周年を迎えました。なんとすばらしい 30 年だったことでしょうか。ウェブ プラットフォームは、シンプルなハイパーテキスト ドキュメントを支えるものから、デザインの最先端で臨場感あふれるダイナミックな体験を実現するものへと発展しています。
この先も世界のニーズは進化を続けるでしょう。私たちが世界のウェブ コミュニティに参加し続け、将来のニーズを満たすようにこのプラットフォームを適応させ、改善する動機は、その点にあります。私たちが集中的に取り組んでいるのは、ユーザーの信頼と安全を中心に据えつつ、ウェブを高速かつ強力なものにすることです。
ウェブの即時性というビジョン
ウェブでは、スピードが重要です。ユーザーは読み込み速度に非常に敏感で、これがビジネスに直接的な影響を与えることがわかっています。
そこで、ブラウザを高速かつ軽量にしつつ、デベロッパーの経験を活かして多くのことを実現するために、私たちは懸命に努力を続けています。起動時のボトルネックに注目することで、ローエンド端末での Chrome の起動時の読み込み速度を 50% 短縮することができました。すべての端末の平均では、10% の短縮になっています。さらに、スクロールのパフォーマンスが 18% 向上し、V8 によって、実際のアプリで JavaScript のメモリ使用量が最大 20% 減少しています。
ブラウザの効率化に加えて、デベロッパーの重荷を取り除くための機能追加も行っています。その中からいくつかご紹介します。
- デベロッパーが独自の JavaScript ソリューションを作成しなくても優れたイメージ読み込みを実現できるように、イメージと iframe を直接ブラウザに遅延読み込みする lazy loading を追加します。デベロッパーがシンプルな HTML 属性を追加するだけで、あとは Chrome がすべて行ってくれます。
- 高速なサイトでユーザーが別のページに移動する場合、Chrome が積極的にページをクリアする機能によって、ユーザー エクスペリエンスが低下する可能性があります。この白い「読み込み中ページ」が一瞬だけ現れるのを防ぐため、Paint Holdingという新しい試験運用版機能を導入し、ウェブのナビゲーションを改善します。この機能が Awwwards のウェブサイトで実際に動作している様子をご覧ください。
ナビゲーションについて言えば、ユーザーがウェブを横断する方法を根本的に変革する新しいテクノロジー、Portals があります。Portals は、iframe と同じように、コンテンツをページ内に直接埋め込むものです。しかし、標準の iframe とは違い、「アクティベート」してトップレベルのページになることができます。これにより、ウェブのあらゆる場所で瞬間的な遷移が可能になります。オリジナル ページの UI のパーツを安全な方法で個別に保持できる高度な体験なので、当初のモデルの理想を維持したまま、シームレスなオーバーレイを提供できます。
I/O では、デベロッパーが Portals や関連 API を使ってプリフェッチ、画面遷移の拡張、サイト間のコンテキスト情報の交換などをサポートする方法をお知らせしました。現在、Canary 版の Chrome でフラグを使うと、Portals API を利用できます。この新しいプリミティブを使ってデベロッパーの皆さんがどんなものを構築するのか、楽しみにしています。
これにより、コンテンツをプリロードしてページを即座に読み込むという柔軟性がブラウザに生まれます。さらに、この処理はプライバシーが保護された状態で行われます。このビジョンの第 1 フェーズである Signed Exchangeは、Chrome でデベロッパーが利用できるようになりました。
ここで説明したのは、ウェブの即時性を上げる機能の一部です。しかし、それが成功するかどうかは、デベロッパーがウェブを高速にし、パフォーマンスを維持できるかどうかにかかっています。そこで、その助けとなるさまざまなツールを追加しました。
2017 年に導入した Chrome UX レポートは、実際の指標を提供することにより、ユーザーが体験しているウェブページについて理解を深めてもらうためのものです。現在、このレポートには 600 万近くのオリジンのデータセットが含まれており、Google Search Consoleの最新のスピード レポートなど、多くのツールで活用されています。このレポートは現在ベータ版で、こちらからプログラムへの登録やフィードバックの送信ができます。
デベロッパーの皆さんにさらに幅広く実際の指標を提供するため、Firebaseチームは Performance Monitoringツールを強化し、ウェブアプリをカバーするようになりました。
また、パフォーマンスというレールから外れないように、多くのトップサイトがビルド環境で「パフォーマンス予算」を実装しています。そこで、Lighthouse にパフォーマンス予算を直接組み込み、本番サイトがパフォーマンス リグレッションの影響を受ける前に通知するようにしています。
ウェブをさらに強力に
私たちが目指しているのは、皆さんがウェブでユーザーに体験してほしいあらゆることを実現できるようにすることです。そこで、皆さんの体験をユーザーの体験に近づけることで機能面のギャップを埋めようと、昨年より懸命に作業を続けてきました。特に差し迫った重要なニーズに対処するために、コミュニティと密接に連携し、たくさんの機能を非常に速いペースで完成させています。中でもすばらしい機能に、ファイル システム アクセス、ストレージの無制限割り当て、SMS ベース認証などの機能があります。認証プロセスで「ワンタイム パスワード」が重要な部分を占めているマーケットで開発しているデベロッパーには、SMS ベース認証が特に重要になります。
この分野には引き続き力を注ぎたいと考えていますが、あなたのアプリをネイティブのシステム共有機能と連携させることができる Web Share Target APIは既にリリースしており、本日の I/O でリリースした Web Perception ツールキットなどの体験を実現する Shape Detection APIも開放しています。このツールキットを使うと、モバイルカメラを組み込んだり、ウェブサイトの利用効率をアップしたりできます。
モバイルでのこのような強力な機能の提供に加えて、質の高いウェブ エクスペリエンスを構築するデベロッパーのリーチを広げたいとも考えています。そこで、デベロッパーがウェブ コンテンツを Android アプリに組み込めるようにする Trusted Web Activityをリリースしました。インド最大の手頃な価格のホテル ネットワークである OYO Roomsなどの企業は、既に Trusted Web Activity を使って軽量版エクスペリエンスを構築しています。これは、一部のマーケットのパートナーでよく見られるパターンです。
昨年、フルウィンドウのサポートや一般的なデスクトップ アプリ機能を必要とするウェブアプリを実現するため、デスクトップ PWA が ChromeOS に対応しました。そして、このサポートは Windows、Mac、Linux に広がっています。
デスクトップ PWA には目覚ましい勢いがあり、ユーザーが高品質な PWA を見つけて簡単にインストールできるように、私たちの役割を果たしてゆきたいと考えています。そこで、Chrome の UI のアドレスバー内に直接 [インストール] ボタンを作って見つけやすさを向上させました。これは、デベロッパーが忠実なユーザーに対するエンゲージメントを向上させ、すばらしい体験を構築できるようにするための 1 歩です。この点については、さらに改善してゆきます。
端末のフラグメント化が激しい中、ローエンドのフィーチャー フォンから大画面デスクトップまで、すべての端末で動作する体験を作ることができるか、確認する必要がありました。そこで、楽しいゲーム Proxxを制作しました。これは、UI に preact を使い、ワーカーを使ってメインスレッド以外で多くの処理を行えるように Comlinkを利用しています。そして、すべての端末で動作します。制約の多い端末でも問題はありません。ウェブ上にあるので直接プレイすることもできますが、おそらく記事を読み終わってからの方がよいでしょう :)
来年中に、ウェブで次世代のゲーム、生産性、メディア、ソーシャル アプリを実現するさらなる可能性を実現したいと考えています。もちろん、ユーザーの安全性や信頼性といった中核原則はすべて維持します。
透明性と選択肢とコントロールをユーザーの手に
ユーザー エクスペリエンスは私たちにとって非常に重要で、その中心にあるのはユーザーの安全性とプライバシーです。I/O では、Chrome が Cookie を扱う方法に関する重要な変更予定についてお知らせしました。これは、トラッキングに対する選択権を提供して、ウェブ全般のセキュリティとプライバシーを向上させるものです。今年中には、ユーザーにウェブのトラッキングに関する透明性と制御を提供できる新機能のプレビュー版を Chrome に導入する予定です。私たちは、以上の変更によって、ウェブにおけるユーザーのプライバシーとセキュリティが向上すると信じています。しかし、それには時間がかかるということもわかっています。そのため私たちはウェブのエコシステムと連携し、Chrome がどのようにポジティブなユースケースをサポートし続けることができるかを理解し、よりよいウェブを構築してまいります。
デベロッパー エクスペリエンスの改善
ウェブ プラットフォームのスコープは広がり、高速で安全で高機能を求めるユーザーからの声は高まっています。その中で、高品質なサイトを作るのは、難しくなるのではなく簡単になるべきです。そこで、web.devを構築し、Lighthouse という測定ツールとガイドを 1 か所にまとめました。このサイトを改善し、現在、パフォーマンス、安全性、アクセシビリティ、レジリエンスなどを実現する 200 以上のわかりやすいガイドを参照できるようになっています。I/O では、Reactを始めとして、皆さんが使うツールのガイドを作成する予定もお知らせしました。
現在は、デベロッパー レポートや利用しているフレームワークについての改善のヒントを提供できるように、Lighthouse に同レベルのカスタマイズを追加する作業を行っています。Wordpress 用のガイドは既に組み込まれています。2019 年およびそれ以降で、さらに追加する予定です。
この 30 年間で、ウェブは長い道のりを歩んできました。デベロッパー コミュニティの皆さんや他のブラウザと協力して、多くの人がどこからでも情報やサービスにアクセスできるようにするという共通のミッションに向かえることは私たちのよろこびです。
Google I/O Extended: Recap Live Japan 2019 より、日本語で行われたセッション