Google I/O 2024 で発表された 10 の最新情報: すべてのウェブ デベロッパーのために AI の力を活用

この 8 月で、ウェブが 35 周年を迎えます。何世代にもわたってこの素晴らしいテクノロジーを生み出し、私たちの生活に数え切れないほどのイノベーションをもたらしてきました。今は AI による新世代の 始まりですここでは、デベロッパー基調講演と I/O セッションで発表された 10 の優れた機能をご紹介します。これらは、よりパワフルなウェブをより簡単に実現し、開発の改善への道筋をつけます。

1. Chrome デスクトップに Gemini Nano を統合して新しいオンデバイス AI 機能を提供

Chrome 126 以降では、Gemini Nano が Chrome デスクトップに組み込まれます。 このことが重要な理由は、プロンプト エンジニアリング、微調整、容量、費用を気にすることなく、Chrome の数十億人ものユーザーに強力な AI 機能を提供できるようになります。オンデバイス機能を備えた Chrome の「文書作成サポート」は、ユーザーが短い形式のコンテンツを作成する際に役立ちます。

早期プレビュー プログラムに登録すると、ウェブの未来をより良いものにしていくことができます。

2. WebAssembly と WebGPU により、使用する AI モデルに関係なくオンデバイス AI を実現

Google は、WebGPU と Wasm(ウェブ上のオンデバイス AI を実現するバックボーン テクノロジー)を使用して、AI モデルが迅速かつ効率的に実行されるように多額の投資を行ってきました。WebGPU の 16 ビット浮動小数点値、Wasm の Memory64 および JavaScript Promise 統合などの新しい改善により、AI の実行がさらに高速になります。Wasm と WebGPU を使用すると、AI ライブラリで幅広いハードウェアでモデルを大規模に実行できます。

3. AI 搭載の Chrome DevTools でデバッグ プロセスを合理化

Chrome DevTools は、アプリのデバッグとチューニングを行うための最も一般的な方法の一つです。AI により、デバッグが非常に簡単になります。Chrome DevTools コンソールに Gemini を導入することで、分析情報を生成し、問題の把握、さらには修正方法の把握を支援します。

Chrome DevTools Console Insights は、現在米国で試験運用版機能として提供されています。他の国にも展開される予定です。

4. Speculation Rules API でインスタント ブラウジング体験を実現

新しい Speculation Rules API により、ほぼ瞬時に移動し、ページをバックグラウンドでプリフェッチおよび事前レンダリングすることでブラウジングのスピードを大幅に高速化します。秒ではなくミリ秒を考えます。何よりも数行のコードだけで利用を開始でき、AI を使用してナビゲーション パターンをインテリジェントに予測できます。

Tokopedia の例: 接続が遅い場合でも、プリレンダリングによって読み込み時間が大幅に短縮された影響。

5. 複数ページのサイトの場合の表示の切り替え

Google は、ユーザーのウェブ体験を再定義したいと考えています。ウェブ向けの開発方法も変えたいと思いますView Transition API を使用すると、ページの状態を簡単にアニメーション化できます。現在は複数ページ アプリと連携し、サイトのアーキテクチャに関係なく流動的なナビゲーションを作成できるようになりました。投機ルールと AI と組み合わせると、ページ遷移を真にシームレスに行うことができます。

6. ブラウザを一元的に確認できるウェブ プラットフォーム ダッシュボード

ブラウザをまたいでプラットフォームの変更、API、フレームワークが絶えず更新される場合、それらに対応するのは容易なことではありません。Baseline を使用すると、すべてのブラウザでサポートされているウェブ機能を把握できます。ウェブ プラットフォーム ダッシュボードを使用すると、ウェブ プラットフォーム全体を一連の機能としてマッピングして表示し、開発を追跡して、相互運用ステータスを確認できるようになります。

7. ワークフローにベースライン ツールを利用可能

ベースラインは、ワークフローに統合すると最適に機能します。本日より、Akamai の RUM Archive に RUM Archive Insights の新しいデベロッパー向けツールが追加されました。初めて、ベースラインのバージョンと機能のグローバル ユーザーシェアを並べて確認できるようになりました。

8. Angular の部分ハイドレーションでパフォーマンスが向上

Google は、ウェブアプリのビルドとデプロイに最適なプラットフォームの一つが Angular であると考えています。現在、部分的なハイドレーション(部分ハイドレーション)に取り組んでいます。これにより、JavaScript は必要な場合にのみアプリの一部のみを読み込んでハイドレートします。これにより、パフォーマンス重視のアプリの Core Web Vitals が大幅に改善されます。数週間以内にデベロッパー プレビューで公開しますので、ご確認ください。

9. すぐに使える、シグナルを使用した Angular のきめ細かいリアクティビティ

Google は、アプリでの変更の検出と管理をより細かく制御できるようにしたいと考えています。開始: シグナルによるきめ細かいリアクティビティ。Angular は、新しいリアクティブ API セットを提供し、シグナルを利用したトップクラスのデベロッパー エクスペリエンスを実現します。シグナルを使用すると、きめ細かい変更検出が可能になり、コンポーネント ツリーの一部のみを確認して状態変化を反映するため、UI を手動で最適化する必要がなくなります。

シグナルベースのリアクティブ API は、現在すぐに利用可能です。 今年後半には、きめ細かい変更検出機能をリリースする予定です。

10. Maps JavaScript API で 3D の没入型体験を構築する

Google Maps Platform の使い慣れた Maps JavaScript API に Photorealistic 3D マップが組み込まれ、臨場感あふれるウェブ エクスペリエンスを構築する方法がさらに広がります。Google のレンダリング テクノロジーを活用して、ユーザーの期待する速度で充実した 3D 地図を表示できます。良い点は 1 行のコードから始めることができる点です

皆様が素晴らしい臨場感あふれるエクスペリエンスを構築されるのを楽しみにしております。 詳細


日々、複雑な開発を乗り越え、可能性の限界を押し広げています。私たち全員が楽しめる新しい体験を 創造するお手伝いができることを嬉しく思います。developer.chrome.comweb.dev にアクセスして、簡単に使えるこのパワフルなウェブについてご覧ください。 XYouTube、そして LinkedIn でぜひフォローしてください。

次回の I/O でお会いしましょう。