![](https://developer.chrome.com/static/docs/puppeteer/images/hero.png?authuser=8&%3Bhl=ja&hl=ja)
操り人形師
Puppeteer は、Chrome DevTools プロトコルと WebDriver BiDi を介して Chrome と Firefox の両方を自動化する高レベルの API を提供する JavaScript ライブラリです。
スクリーンショットの撮影や PDF の生成から、複雑な UI の操作やテスト、パフォーマンスの分析まで、ブラウザ内のあらゆる作業を自動化できます。
コンセプト
ページのインタラクション
ネットワークの傍受
スクリーンショットを撮る
実行モード
ブログ投稿
Windows の Chromium ベースのブラウザでテキストのレンダリングが改善
Edge チームは、Chromium で Windows ClearType チューナーの値を直接尊重するサポートを追加しました。これにより、Windows の Chromium ベースのブラウザでテキストのレンダリングが改善されました。
メディアの再生時にピクチャー イン ピクチャーを自動的に開始する
Chrome では、メディアを再生しているウェブアプリがピクチャー イン ピクチャーを自動的に開始できます。
Chrome 134 ベータ版
Chrome に追加される最新機能を紹介します。
Chrome 133 の新機能
Chrome 133 のリリースが開始されました。エキサイティングな新しい CSS 機能など、他にも多くの機能があります。
Chrome 133 の DevTools の新機能
AI チャット履歴の永続化、ナビゲーションの改善、[パフォーマンス] のリスト無視とスタック トレース、新しい [新機能] パネルなど。
WebGPU の新機能(Chrome 133)
unorm8x4-bgra と 1 コンポーネントの頂点形式が追加され、未定義の値で不明な上限をリクエストできるようになりました。また、WGSL の配置ルールが変更され、破棄による WGSL のパフォーマンスが向上しました。
Chrome 拡張機能の今後の予定(2025 年 1 月)
Chrome 拡張機能の最近の変更の概要と、デベロッパーが期待できる今後の拡張機能の魅力的な機能について説明します。
Chrome ウェブストアのポリシーの更新: デベロッパーにとって明確で一貫性のあるポリシーを実現
Chrome ウェブストアは、デベロッパーとユーザーにとって高品質で信頼できるエコシステムの構築に取り組んでいます。この目標に沿って、Google は、プラットフォーム全体で明確かつ一貫したポリシーを適用するための一連のポリシーの更新を発表します。今回の更新では、機能、コンテンツ基準、デベロッパー ガイダンスの主要な分野に対応しています。 Google は、 再審査請求プロセス を効率化し、透明性を高めるために、プロセスを合理化しています。今後、デベロッパーはポリシー違反ごとに 1
パスキーの WebAuthn 機能検出の簡素化
「getClientCapabilities()」を使用して WebAuthn の機能を検出し、ユーザーに合わせて認証ワークフローを調整する方法を学びます。
省エネモードでのフリーズ
Chrome 133 以降では、省エネモードが有効になっているときに、CPU 使用率の高いバックグラウンド タブがフリーズされるようになりました。
iOS で Google パスワード マネージャーのパスキーを利用できるようになりました
iOS 17 以降の Chrome で、Google パスワード マネージャー(GPM)でパスキーを作成、同期、認証できるようになりました。これにより、Chrome が利用できるすべてのデバイスで GPM のパスキーを使用できるようになります。
CSS attr() のアップグレード
カスタム プロパティを含む任意の CSS プロパティで attr() を使用できるようになりました。また、値を文字列以外のデータ型に解析できるようになりました。
CSS scroll-state()
コンテナクエリに似ていますが、停止したクエリ、スナップされたクエリ、オーバーフローしたクエリに使用します。
Chrome 133 ベータ版
Chrome に搭載される最新機能について学びます。
Chrome 132 の新機能
Chrome 132 のリリースが開始されました。Dialog 要素は ToggleEvent を取得し、要素レベルの動画共有をサポートします。File System Access API は Android と WebView をサポートします。
Chrome DevTools に Gemini を導入した方法
DevTools の新しい AI アシスタント パネルの楽しいユースケースについて学びます
CSS text-box-trim
テキスト コンテンツの上下にスペースを追加して、視覚的なバランスをとる。
ウェブ バイタル拡張機能のサポート終了
Web Vitals 拡張機能と DevTools の統合が完了し、拡張機能のサポートは終了しました。
組み込み AI チャレンジの受賞者
組み込み AI チャレンジで受賞したアプリと拡張機能をご覧ください。このチャレンジでは、Chrome の Gemini Nano でできることを再考していただきました。
WebGPU の新機能(Chrome 132)
テクスチャビューの使用、32 ビット浮動小数点テクスチャのブレンド、GPUDevice の adapterInfo 属性、無効な形式でキャンバス コンテキストを構成する JavaScript エラーの発生、テクスチャのサンプラー制限のフィルタリング、拡張サブグループの試験運用版、デベロッパー エクスペリエンスの向上、16 ビット正規化テクスチャ形式の試験運用版のサポートなど。
自動入力の実践: 実際の分析情報
Chrome の調査によると、自動入力を使用するユーザーはフォームの入力が速く、放棄率が低くなります。
カスタマイズ可能な選択リクエストの回答から得られた結果(デベロッパー フィードバック フォーム)
貴重な時間を割いてフィードバックを送信していただき、詳細を確認して標準の策定にご協力いただきありがとうございました。
DevTools でパフォーマンス トレースを記録して分析する
DevTools でパフォーマンス トレースを記録して分析する。
Chrome 132 の DevTools の新機能
Gemini を使用してネットワーク リクエスト、ソースファイル、パフォーマンス トレースをデバッグしたり、AI チャット履歴を表示したりできます。
CSS ラップ 2024
Chrome DevRel チームとスケートボードに乗った Chrome Dino と一緒に、2024 年に Chrome とウェブ プラットフォーム向けにリリースされた最新の CSS を学びましょう。
[パフォーマンス分析情報] パネルのサポート終了
試験運用版の [パフォーマンス分析情報] パネルは 2025 年 1 月に削除され、[パフォーマンス] パネル自体に新しい分析情報が追加されます。
WebGPU の今後
最新の GPU for the Web ワーキング グループ ミーティングで議論された、新しい AI とレンダリング機能について学びます。
動画のユーザー補助機能が Gemini API デベロッパー コンペティションのウェブ賞を受賞
Gemini API デベロッパー コンペティションのウェブ アワードに ViddyScribe が選ばれました。動画の音声による説明を生成することで、ウェブ上の動画をよりアクセスしやすくする方法について、Gemini を例に説明しました。
新しい拡張機能メニューのテスト開始に備えて拡張機能を準備する
新しい拡張機能メニューに対応するよう拡張機能を準備する方法。
パフォーマンス パネルで直接トレースにアノテーションを付ける
DevTools の新しいアノテーション機能を使用してパフォーマンス トレースをよりわかりやすくする方法を学びます。
Translator API オリジン トライアルに参加する
ローカル AI モデルを使用して、ブラウザでテキストをリアルタイムで翻訳します。ユーザーは母国語で投稿できるようになりました。
Chrome 132 ベータ版
Chrome に搭載される最新機能について学びます。
パソコン版 Chrome のパスキーの Signal API
パソコン版 Chrome のパスキーの Signal API の導入
Chrome 拡張機能の Prompt API オリジン トライアルに参加する
Chrome 拡張機能の Prompt API オリジン トライアルに参加して、Chrome で Gemini Nano にアクセスします。
Chrome 131 の新機能
Chrome 131 のリリースが開始されました。詳細要素の CSS スタイル設定の追加、ページ マージン ボックスによる印刷レイアウトの簡素化など、さまざまな機能が追加されています。
Summarizer API オリジン トライアルに参加する
オリジン トライアルに参加して、ユーザーは長い記事や複雑なドキュメント、さらにはチャットでの活発な会話から、簡潔で洞察力に富んだ要約を作成できます。
WebGPU の新機能(Chrome 131)
WGSL、GPUCanvasContext getConfiguration()、点と線のプリミティブのクリップ距離には、深度バイアス、サブグループ用のインクルーシブ スキャン組み込み関数、マルチ描画間接の試験運用版サポート、シェーダー モジュールのコンパイル オプションの厳密な計算、GPUAdapter requestAdapterInfo() の削除などがあってはなりません。
スタイル設定のその他のオプション(<詳細>)
新しい ::details-content 疑似要素を使用して、表示タイプを設定したり、展開と閉じを切り替える部分のコンテナにスタイルを適用したりできるようになりました。
シームレスな認証情報の共有により、ユーザーのログインがスムーズになる
シームレスな認証情報共有を使用すると、ユーザーが Android アプリとウェブサイトで同じ認証情報を使用してログインできることをパスワード マネージャーに安全に通知できます。
[パフォーマンス] パネルで Core Web Vitals のリアルタイム指標をモニタリングする
[パフォーマンス] パネルで Core Web Vitals の指標をリアルタイムでモニタリングする。
CSS を使用して印刷するときにウェブページの余白にコンテンツを追加する
ウェブページの印刷時にカスタムのヘッダーとフッターを作成する。
DevTools の新機能(Chrome 131)
Gemini で CSS をデバッグし、検出結果にアノテーションを付け、[パフォーマンス] パネルで分析情報を取得し、過度のレイアウト シフトや合成されていないアニメーションなどを検出します。
Chrome から --headless=old を削除
Chrome 132 では、古いヘッドレス モードが削除されました。Chrome ヘッドレス シェルまたは新しいヘッドレス モードに移行します。
DevTools の新しいスクロール バッジ: スクロール可能な要素をすばやく見つける
DevTools の新しいスクロール バッジによって、スクロール可能な要素のデバッグがどのように簡素化されるか(およびその作成方法)について説明します。
DevTools の AI アシスタンスでおすすめすべき 5 つのこと
DevTools の新しい AI アシスタント パネルの楽しいユースケースについて学びます
Chrome 131 ベータ版
Chrome の最新ベータ版に追加される機能をご確認ください。
WebGPU の新機能(Chrome 130)
デュアルソース ブレンディング、Metal でのシェーダーのコンパイル時間の改善、GPUAdapter requestAdapterInfo() のサポート終了など。
Chrome 130 の新機能
Chrome 130 のリリースが開始されました。ドキュメントのピクチャー イン ピクチャーでは、ピクチャー イン ピクチャー ウィンドウをより細かく制御できます。CSS ネスト宣言により、厄介なエッジケースを修正できます。また、複数行に分割された要素のデコレーションをどのように動作させるかを指定できます。Chrome 130 のデベロッパー向け新機能について、Pete LePage が詳しく説明しています。
Box-decoration-break プロパティ(Chrome 130)
Chrome 130 では、接頭辞のない box-decoration-break が完全にサポートされています。
Chrome 拡張機能の今後の予定(2024 年 10 月)
Chrome 拡張機能の最近の変更の概要と、デベロッパーが期待できる今後の拡張機能の魅力的な機能について説明します。
プライベート ネットワーク アクセスの保留
プライベート ネットワーク アクセス(PNA)のロールアウトは保留中です。
CSS 選択のスタイル設定の継承の変更
Chrome 131 では、CSS ハイライトの継承が変更されます。
Translation API が早期プレビュー版で利用可能に
Translation API が、組み込み AI 早期プレビュー プログラムの参加者にご利用いただけるようになりました。
Chrome DevTools での予測を把握する: 難しい理由とその改善方法
例外がキャッチされるかどうかを DevTools デバッガが予測する方法を学びます。
Google Chrome 組み込み AI チャレンジに参加する
Chrome の Gemini Nano でできることを再考する「組み込み AI チャレンジ」を開催します。
Chrome ウェブストア デベロッパー ダッシュボードのモバイル エクスペリエンスを改善
このたび、Chrome ウェブストア デベロッパー ダッシュボードの UI を変更し、レスポンシブ性とモバイル フレンドリー性を高めました。これにより、店舗掲載情報のパフォーマンスのモニタリング、掲載情報の変更、店舗の拡張機能の管理がより便利でアクセスしやすくなることを願っています。 すべてのグラフと分析ページが更新され、レスポンシブ性が向上しました。これにより、モバイル デバイスでの拡張機能のストア掲載情報のパフォーマンスをより適切に確認できるようになりました。
Chrome 130 の DevTools の新機能
パフォーマンス パネルで移動できるライブ指標とパンくずリストの推奨事項、ネットワーク フィルタの刷新、HAR エクスポートのクリーンアップなど。
キャッシュの解明: キャッシュの調査、クリア、無効化
DevTools を使用してキャッシュを検査し、トラブルシューティングします。
Web Vitals 拡張機能が DevTools に追加されました
ウェブバイタル拡張機能は Chrome DevTools のパフォーマンス パネルと統合され、2025 年 1 月にスタンドアロン サポートが終了します。
Chrome で Google パスワード マネージャーのパスキーをパソコンと Android 間で同期
パソコン版 Chrome では、まもなく Google パスワード マネージャー(GPM)でパスキーを作成して、Android に加えてこれらのプラットフォーム間で同期できるようになります。
Writer API と Rewrite API の早期プレビューを公開
EPP の参加者は、Chrome の書き込み API と書き換え API を使用してプロトタイプを作成できるようになりました。
フィードバックが必要: CSS 組積造をどのように定義すればよいでしょうか?
提案されている 2 つの組積造の仕様の比較。
Chrome 130 ベータ版
最新の Chrome ベータ版の機能と変更点を使ってサイトをテストします。
Chrome 試験運用版: プロセスの共有
プロセス共有の試験運用と、Chrome DevTools のデベロッパー エクスペリエンスへの影響。
WebGPU の新機能(Chrome 129)
キャンバス トーン マッピング モードでの HDR サポート、サブグループのサポートの拡大など。
Chrome 129 の新機能
Chrome 129 のリリースが開始されました。長いタスクでは、パフォーマンスを向上させるために、固有のサイズで要素をアニメーション化できます。また、アンカー配置の構文にもいくつかの変更があります。Chrome 129 のデベロッパー向けの新機能について、Pete LePage が詳しく説明しています。
ローカルと実際のユーザーの Core Web Vitals のパフォーマンスを DevTools でモニタリングする
Chrome DevTools の [Performance] パネルでは、ローカルの Core Web Vitals のパフォーマンスをモニタリングし、フィールドの実際のユーザーデータと比較する新しい方法が導入されています。
Web Serial の Bluetooth RFCOMM の更新
Web Serial で Bluetooth RFCOMM シリアルポートが使用可能になったことを検出する方法について学びます。
デベロッパー フィードバックのリクエスト: カスタマイズ可能な選択
カスタマイズ可能な新しい選択機能をいち早くご紹介します。
画面をフリーズして消える要素を検査する
DOM 内の要素をフリーズして、DevTools で調査できるようにします。
Keyboard Lock と Pointer Lock API には、Chrome 131 の権限が必要です
Keyboard Lock API を使用すると、デベロッパーは、インタラクティブなウェブサイト、ゲーム、リモート デスクトップやアプリのストリーミングなど、さまざまなユースケースで没入感のあるフルスクリーン エクスペリエンスを提供できます。これは、ウェブサイトがホスト オペレーティング システムで許可されているすべての鍵を使用できるようにすることで実現します。 Pointer Lock API を使用すると、デスクトップ アプリケーションでポインタ アイコンを非表示にして、マウスの動きを 3D
Digital Credentials API のオリジン トライアルのご紹介
Digital Credentials API のオリジン トライアルは、Chrome 128 以降開始されます。Digital Credentials API は、運転免許証やデジタル ウォレットに保存されている国民識別カードなどのデジタル認証情報を通じて、ウェブサイトがユーザーに関する検証可能な情報を選択的にリクエストできるようにする新しいウェブ プラットフォーム API です。
アンカー ポジショニングの構文の変更
注意が必要なアンカー ポジショニング API に関連する変更。
DevTools の新機能(Chrome 129)
[パフォーマンス] > [検索リクエスト]ネットワーク、自動入力を使用した住所フォームでのテストデータの使用、レコーダー パネルで Firefox 用 Puppeteer にエクスポートしたり、[Performance] パネルでモニタリングでパフォーマンスの問題をひと目で把握したりできます。
Chrome で WebAuthn のヒント、関連オリジン リクエスト、JSON シリアル化を導入
Chrome の WebAuthn で、ヒント、関連オリジン リクエスト、JSON シリアル化を使用できるようになりました
Language Detection API の早期プレビュー版が利用可能
EPP の参加者は、Chrome の言語検出 API を使用してプロトタイプを作成できるようになりました。
Chrome 129 ベータ版
現在のベータ版の機能について詳しく紹介するこの投稿で、Chrome の次期リリースのプレビューをご確認いただけます。
WebGPU の新機能(Chrome 128)
サブグループのテスト、線とポイントの深度バイアスの設定のサポート終了、未キャプチャ エラーの DevTools の警告の非表示(PreventDefault の場合)、WGSL が最初にサンプリングを補間する、その他。
Chrome 128 の新機能
Chrome 128 がリリースされました。改行のある Ruby 要素の表示が改善され、Promise.try で Promise チェーンの開始が簡単になり、PointerEvent インターフェースが拡張されて複数のペンを一意に識別できるようになりました。その他、他にも多くの要素があります。Chrome 128 のデベロッパー向け新機能について、Adriana Jara が詳しく解説します。
Chromium のユーザー補助のパフォーマンスを改善
Ahmed Elwasefi が Google Summer of Code を通じて Chromium コントリビューターになった経緯を語った投稿。
File System Observer API のオリジン トライアル
Chrome チームは、ファイル システムへの変更をデベロッパーに通知する新しい File System Observer API をテストしています。
Summarization API の早期プレビュー版が利用可能に
EPP の参加者は、Chrome で Gemini Nano の Summarization API を使用してプロトタイプを作成できるようになりました。
スクロール スナップ イベント
新しい JavaScript イベントを 2 つ導入しました。scrollSnapChange と ScrollSnap 試験
DevTools でスクリーンショットをキャプチャする 4 つの方法
DevTools でスクリーンショットをキャプチャする 4 つのユニークな方法を紹介します。
WebDriver BiDi を Firefox、Chrome、Puppeteer で本番環境に対応
Puppeteer 23 では、Firefox 129 以降の安定版サポートが導入され、WebDriver BiDi をベースとした Chrome と Firefox の自動化のための統合 API が提供されます。
DevTools の新機能(Chrome 128)
コンソールの分析情報をヨーロッパで公開したり、[パフォーマンス] パネルでトラックをカスタマイズするための強化されたネットワーク トラックと API を利用したりできます。
Chrome の組み込みの AI 機能の試験運用版にご参加ください
組み込みの AI、Prompt API、Chrome の AI プランに関する最新情報
Android 版 Chrome のパスキー UX の更新
Android 版 Chrome に認証情報マネージャーが統合され、Android 14 以降でサードパーティのパスワード マネージャーがパスキーを提供できるようになりました
WebDriver BiDi による自動化が BrowserStack で利用可能に
BrowserStack が WebDriver BiDi のサポートを導入: イベント ドリブンの自動化で Selenium Grid テストを強化します。
正規表現以外の処理: Chrome DevTools の CSS 値の解析機能を強化
DevTools チームが [Styles] タブでのスタイルの表示を改善した方法をご覧ください。
改行可能な ruby 要素と CSS ruby-align プロパティ
改行可能な ruby 要素と CSS ruby-align プロパティ
Chrome 128 ベータ版
現在のベータ版の機能について詳しく紹介するこの投稿で、Chrome の次期リリースのプレビューをご確認いただけます。
Chrome 127 の新機能
Chrome 127 がリリースされました。font-size-adjust のサポートにより、Document Picture-in-Picture API、キーボードのフォーカス可能なスクロール コンテナなど、多くのユーザー アクティベーションが伝播されます。Chrome 127 のデベロッパー向け新機能について、Adriana Jara が詳しく解説します。
ユーザーが重要なアプリのインストールを Chrome でサポートする方法
Chrome の内部ユーザー調査によると、多くのユーザーはウェブアプリのインストールを重視しています。次のようなメリットがあります。 Chrome とウェブ デベロッパーが支援する方法は複数あります。たとえば、新しい ML プロモーション機能などです。この記事では、ユーザーがアプリをインストールする方法の概要について説明します。 Chrome の インストール可能条件 を満たすアプリには、Chrome デスクトップ ブラウザのアドレスバーにインストール
WebGPU の新機能(Chrome 127)
Android での OpenGL ES の試験運用版のサポート、GPUAdapter 情報属性、WebAssembly の相互運用の改善など。
読み取りフローと display: コンテンツを使用した要素に関するデベロッパー フィードバックのお願い
読み上げフローがお客様のニーズに合ったものになるよう、ぜひご協力ください。
ビュー遷移に関する誤解
View Transition API を検討する人が増えている今、いくつかの誤解を解くときが来ています。
Chrome 拡張機能: ポリシーの重要な更新
このお知らせでは、デベロッパー プログラム ポリシーのページを更新し、高品質のプロダクトの開発を促し、虚偽の振る舞いを防止し、ユーザーが十分な情報に基づき同意を得ることを目的にしています。
Chrome 拡張機能の変更内容
Chrome 拡張機能の最近の変更の概要と、今後リリースが予定されている拡張機能に関するデベロッパー向けのご案内です。
DevTools の新機能(Chrome 127)
Elements での CSS アンカー配置、Sources の「Never Pause Here」の拡張、新しいスクロール スナップ イベント リスナー、更新されたネットワーク スロットリング プリセットなど。
YouTube に Trusted Types を導入
YouTube は、クロスサイト スクリプティング攻撃を防ぐために Trusted Types を使用してプラットフォームのセキュリティを強化していますが、拡張機能に影響する可能性があります。
Long Animation Frame API をリリース
Long Animation Frame API(LoAF)は Chrome 123 からリリースされました。また、この新しい API を最大限に活用できるように、ツールとガイダンスも更新しました。
Chrome ウェブストアの舞台裏: 信頼性と安全性について質問する
Chrome ウェブストアのレビューを担当するチームと話し合いました。
ストレージ バケットでの IndexedDB の最大パフォーマンス
Chrome チームは、IndexedDB(IDB)の実装に関して、パフォーマンス関連のいくつかの改善を行いました。
WebGPU の新機能(Chrome 126)
maxTextureArrayLayers の上限の引き上げ、Vulkan バックエンドのバッファ アップロードの最適化、シェーダーのコンパイル時間の改善、送信されるコマンド バッファの一意性の確保、Dawn の更新。
新しい HTML <permission>> 要素のオリジン トライアル
Chrome チームは、ユーザーに強力な機能へのアクセスをリクエストする、新しい宣言型の HTML <権限>要素をテストしています。
Chrome 127 ベータ版
ベータ版をダウンロードすると、Chrome の最新機能をお試しいただけます。
CSS とウェブ UI の最新情報: I/O 2024 のまとめ
Google I/O 2024 での CSS とウェブ UI に関するすべてのお知らせをお読みください。
Chrome 126 の新機能
Chrome 126 がリリースされました。ViewTransitions API でのドキュメント間の遷移のサポートにより、CloseWatcher API が再度有効化され、Gamepad API に対してトリガー ランブルが行われるなど、多くの機能が追加されています。Adriana Jara が、Chrome 126 のデベロッパー向けの新機能について詳しく説明しています。
DevTools のパフォーマンス ワークフローをカスタマイズするための 3 つの新機能
パフォーマンス パネルを整理し、必要な情報に焦点を合わせるのに役立つ最新機能について学びましょう
広告表示オプションに適用される変更の確認をスキップする
このたび、Declarative Net Request API を使用して、Manifest V3 拡張機能に対する対象となる変更の審査プロセスをスキップできる新機能をリリースいたしました。
DevTools の新機能(Chrome 126)
トラック構成モードの改善、フレームチャートの無視リスト、[パフォーマンス] パネルでの CPU の 20 倍のスロットリングなど。
Google I/O 2024 における Chrome 拡張機能
開催後は Google I/O を開催し、拡張機能に関する最新情報をすべてご紹介しました。
ビュー遷移の新機能(Google I/O 2024 の更新)
MPA のドキュメント間のビュー遷移、アクティブ タイプによる選択的なビュー遷移、ビュー遷移クラスを使用したアニメーション スタイルの共有を発表しました。
Web AI を高速化するための WebAssembly と WebGPU の機能強化、パート 2
パート 2/2.WebAssembly と WebGPU の拡張機能により、ウェブ上での機械学習のパフォーマンスがどのように向上するかについて説明します。
I/O 2024 ウェブ AI のまとめ: ウェブアプリ用の新しいモデル、ツール、API
I/O 2024 でウェブ AI のまとめをご覧ください。ウェブアプリの新たなモデル、ツール、API をご紹介します。
Chrome 126 ベータ版
Chrome 126 ベータ版には、ドキュメント間のビュー遷移や、Gamepad API トリガーランブル拡張機能などの機能が含まれています。
WebAssembly と WebGPU の強化による Web AI の高速化、パート 1
パート 1/2。WebAssembly と WebGPU の強化により、ウェブ上での ML のパフォーマンスがどのように向上するかについて学びます。
JavaScript フレームワークの新機能(2024 年 5 月)
このドキュメントでは、JavaScript フレームワーク エコシステムの最近の動向を簡単にご紹介します。
Windows での UIA サポートの導入
Chrome 126 以降では、Windows UI オートメーション フレームワークがサポートされています。
Async Clipboard API 向け SVG サポート
Async Clipboard API で SVG 画像を処理できるようになりました。
DevTools のヒント: ネットワーク レスポンスをオーバーライドしてモックする
DevTools を使用してネットワーク レスポンスをオーバーライドしてモックする方法について説明します。
Google I/O 2024 で発表された 10 の最新情報: すべてのウェブ デベロッパーのために AI の力を活用
Google I/O デベロッパー基調講演とセッションから、優れた機能をご紹介します。
Chrome 125 の新機能
Chrome 125 がリリースされました。CSS Anchor Positioning API、Compute Pressure API、Storage Access API への拡張など、多数の機能が用意されています。Adriana Jara が、Chrome 125 のデベロッパー向けの新機能について詳しく説明しています。
CSS アンカー ポジショニング API のご紹介
新しい Anchor Positioning API を使用して、要素を互いに相対的に配置します。
Chrome を使用して企業にテストを実装する
エンタープライズ環境でのテストで課題を克服する方法について学ぶ
スムーズな自動テストを実現する Chrome のツール
Puppeteer、Chrome ヘッドレス、Chrome for Testing の概要と、Chrome ツールチームが提供したその他のリソースです。
DevTools の新機能(Chrome 125)
コンソールのエラーの原因、パフォーマンスの CSS セレクタの統計情報、ネットワークの Early Hints ヘッダーなど。
WebGPU の新機能(Chrome 125)
開発中のサブグループは、3D テクスチャのスライスにレンダリングされます。
e コマースサイトで CSS と UI の機能が重要な理由
最新の CSS や UI 機能(ビュー遷移、スクロールドリブン アニメーション、Popover API など)を実装することで、e コマースサイトがどのように役立つかを学びます。
「スクロールドリブン アニメーションの力を活用」のご紹介
スクロールドリブン アニメーションのすべてを学ぶ、全 10 部の動画コースです
CSS メーソンリーの代替案
メーソンリーとグリッドを異なる仕様で定義するための提案。
セキュアでないコンテキストのプライベート ネットワーク アクセス(PNA)の非推奨トライアルが終了します - PNA 権限プロンプトを実装してください
HTTPS に変換できないウェブサイトからプライベート ネットワーク デバイスにアクセスするには、権限プロンプトを使用して混合コンテンツのチェックを緩和する必要があります。
Chrome 125 ベータ版
CSS Anchor Positioning、CSS のステップ関数、Compute Pressure API など。
Chrome 拡張機能の変更内容
Chrome 拡張機能の最近の変更の概要と、今後リリースが予定されている拡張機能に関するデベロッパー向けのご案内です。
Foldable API のオリジン トライアル
Foldable API は、デベロッパーが折りたたみ式デバイスをターゲットにできるように設計された Chrome の 2 つの API です。
Chrome 124 の新機能
Chrome 124 がリリースされました。JavaScript から宣言型 Shadow DOM を使用できるようにする新しい API が 2 つあります。Web Sockets でストリームを使用できます。ビュー遷移が改良されました他にもたくさんあります。Chrome 124 におけるデベロッパー向けの新機能について、Pete LePage が詳しく説明しています。
MIDI デバイスにアクセスするにはユーザー権限が必要になりました
Chrome では、権限プロンプトによって Web MIDI API 全体を制御できるようになりました。
パワフルで楽しい: Chrome DevTools の概要
DevTools でウェブ アプリケーション開発を改善する方法をご確認ください。
WebGPU の新機能(Chrome 124)
読み取り専用と読み取り / 書き込みのストレージ テクスチャ、Service Worker と共有ワーカーのサポート、新しいアダプタ情報属性、バグの修正。
CrUX で使用可能なナビゲーション タイプ
Chrome ユーザー エクスペリエンス レポート(CrUX)の新しい nav_types 指標と、この指標を使用してウェブ パフォーマンス指標を説明および最適化する方法について説明します。
Chrome ウェブストア デベロッパー ダッシュボードでのバージョン ロールバック
今週、デベロッパーが Chrome ウェブストアで公開済みの以前のバージョンに拡張機能をロールバックできる新機能をリリースします。Google の目標は、特に Manifest V3 への移行に伴い、デベロッパーがアップデートを公開する際に安心していただけるようにすることです。 本日より、バグ修正を含む拡張機能の新しいバージョンを送信して審査に合格するまで待つ必要がなくなります。代わりに、[ その他 ] メニューまたはアイテムのパッケージ ページからロールバックを開始できます。
JS Profiler は廃止され、[パフォーマンス] パネルで CPU をプロファイリングする
CPU パフォーマンスをプロファイリングする今後のプロセスと、JavaScript Profiler を非推奨とする理由とその方法について説明します。
DevTools の新機能(Chrome 124)
スクロールドリブン アニメーションのサポート、新しい自動入力パネル、ネットワーク スロットリングにおける WebRTC の新しいオプションなど。
WebAssembly JavaScript Promise 統合(JSPI)のオリジン トライアルの開始
JavaScript Promise Integration(JSPI)は、WebAssembly にコンパイルされた同期シーケンシャル コードが非同期 Web API にアクセスできるようにする API です。
fetchLater API オリジン トライアル
fetchLater API(現在はオリジン トライアルで)について説明します。この API は、ページが閉じられていても完了する遅延フェッチをリクエストする新しい API です。
キーボードのフォーカス可能なスクローラー
tabindex 値が設定されていないスクローラーと、フォーカス可能な子のないスクローラーを、キーボードでフォーカス可能にするための変更がロールアウトされます。
Chrome 124 ベータ版
書き込み候補の HTML 属性、WebSocketStream API、優先 HTTP リクエスト ヘッダーなど。
Chrome 123 の新機能
Chrome 123 がリリースされました。新しい Light-dark 関数、Long Animation Frames API、Service Worker Static Routing API など、多くの機能があります。Adriana Jara が、Chrome 123 のデベロッパー向けの新機能について詳しく説明しています。
プライベート ネットワーク アクセス: ウェブワーカーとナビゲーション フェッチに対する保護の強化
ウェブ ワーカー、ナビゲーション フェッチ、今後の保護のためのプライベート ネットワーク アクセスの主なセキュリティ メカニズムについて説明します。このドキュメントでは、ウェブサイトの所有者がプライベート ネットワークを利用する場合に行うべきことについても説明します。
Service Worker Static Routing API を使用して、特定のパスで Service Worker をバイパスする
Chrome 123 から提供されるこの新しい API の使用方法をご確認ください。
拡張機能のリクエストの非表示と [ネットワーク] パネルの改善点
Chrome DevTools の [Network] パネルの最新の改善点をご確認ください。このパネルはウェブ デバッグをシンプルにするために設計されています。
2024 年以降のパフォーマンス ツール
DevTools の [パフォーマンス] パネルを改善するための Chrome チームの計画についてご確認ください。
WebGPU の新機能(Chrome 123)
DP4a 組み込み関数のサポート、制限のないポインタ パラメータ、WGSL で複合を逆参照するための構文シュガーなど。
共有辞書で圧縮効率を向上
ウェブでの圧縮は、共有辞書圧縮によって大幅に強化されています。圧縮がどのようなもので、どのように機能するのか、ウェブ上の静的リソースと動的リソースの両方について、標準の圧縮よりもさらに読み込み時間を大幅に短縮できる方法をご確認ください。
古いヘッドレス Chrome を chrome-headless-shell としてダウンロードします
ユーザー向けのすべての Chrome リリースで、古いヘッドレス Chrome をスタンドアロン バイナリとしてダウンロードできるようになりました。
Speculation Rules API を改善
ドキュメント ルール、積極性の設定、制限、プラットフォームでの投機ルールのサポートなど、Speculation Rules API の最新アップデートの詳細を示します。
Chrome 拡張機能: Service Worker の停止をテストする方法
この投稿では、Eyeo のチームが、拡張機能 Service Worker のテストに関する問題への道のりを紹介します。特に、Service Worker が停止したときに Chrome 拡張機能が正しく動作するかどうかを確認する方法について説明します。
DevTools の新機能(Chrome 123)
イースター エッグ、[要素] > [スタイル] のフォーカスされたページ エミュレーション、新しい Lighthouse 監査など。
サードパーティ ライブラリを管理するための Next.js パッケージ
@next/third-parties ライブラリを使用して一般的なサードパーティ リソースの読み込みを最適化する方法を確認する
Chrome 123 ベータ版
CSS の light-dark() カラー関数、ブロックの align-content、フィールド サイズ設定のプロパティ、pagereveal イベント。
ブロック レイアウトとテーブル レイアウトでの align-content のサポート
Chrome 123 以降では、フレックス コンテナやグリッド コンテナを作成せずに、Align-content を使用してアイテムを配置できます。
Chrome 122 の新機能
Chrome 122 がリリースされました。新しい Storage Buckets API では、DevTools の [パフォーマンス] パネルが更新され、Async Clipboard API で HTML を読み取るためのサニタイズされていないオプションなど、さまざまな機能が追加されました。Adriana Jara が、Chrome 122 のデベロッパー向けの新機能について詳しく説明しています。
CSS ::backdrop の継承に関する変更
Chrome 122 以降、「::backdrop」要素は元の要素からプロパティを継承します。
パフォーマンスに関するパネル表示でパフォーマンス パネルを 400% 高速化
DevTools の [パフォーマンス] パネルは、ウェブアプリのパフォーマンスの問題を診断、デバッグ、修正するための強力なツールです。今回は、DevTools の [パフォーマンス] パネルを使用してパフォーマンス パネル自体のパフォーマンスをどのように改善したか、またどのように大幅な改善を達成したかをご紹介します。
WebGPU の新機能(Chrome 122)
開発中の互換モード、maxVertexAttributes の上限の引き上げ、Dawn の更新。
EditContext API を使用してカスタムのウェブ編集エクスペリエンスを構築する新しい方法のご紹介
EditContext は Chrome と Edge でリリースされる新しい API で、デベロッパーはこれを使用してブラウザで高度なテキスト編集機能を構築できます。詳しくは、こちらの投稿をご覧ください。
DevTools の新機能(Chrome 122)
[Network] パネルと [Application] パネルにサードパーティ Cookie の段階的廃止に関する警告を表示、[Network] パネルの拡張デバッグ、[Performance] パネルのパンくずリストなど。
DevTools のヒント: 投機的ナビゲーションをデバッグしてページの読み込みを高速化する
投機的読み込みでウェブ ブラウジングを高速化し、デバッグ方法を学びましょう。
パソコン版 Chrome の SharedArrayBuffer のサポート終了トライアルを Chrome 124 まで延長
Chrome デスクトップでのクロスオリジン分離を行わない SharedArrayBuffer の非推奨トライアルを Chrome 124 まで延長します。
Chrome 122 ベータ版
Chrome 122 ベータ版では、イテレータ ヘルパー、メソッドの設定、Storage Buckets API、Async Clipboard API でのサニタイズされていない HTML の読み取りなどを利用できます。
Chrome 拡張機能の変更内容
Chrome 拡張機能の最近の変更の概要と、今後リリースが予定されている拡張機能に関するデベロッパー向けのご案内です。
Chrome 121 の新機能
Chrome 121 がリリースされました。CSS の更新、Speculation Rules API の改善、Element Capture API のオリジン トライアルなど、多くの改善が行われました。Adriana Jara が、Chrome 121 におけるデベロッパー向けの新機能について詳しく説明しています。
WebGPU の新機能(Chrome 121)
Android での WebGPU のサポート、シェーダー コンパイルでの DXC の使用、コンピューティングパスとレンダリングパスでのタイムスタンプ クエリ、シェーダー モジュールへのデフォルトのエントリ ポイント、GPUExternalTexture 色空間としての display-p3、メモリヒープ情報など。
Angular SSR を使用して DOM に安全にアクセスする
Angular で SSR とともに DOM を安全に使用する方法を学習します
Puppeteer でウェブ Bluetooth をテストする
Chrome でウェブ Bluetooth API を使用する機能をテストするには、Puppeteer を使用します。
ウェブ AI モデルのテストを強化: WebGPU、WebGL、ヘッドレス Chrome
ブラウザのテストを一貫して自動化し、アプリケーションのパフォーマンスを向上させるための Google のソリューションをご覧ください。
フォーム コントロール要素の CSS 縦書きモード
Chrome に新しい国際 CSS 機能が加わりました。
File System Access API の永続的な権限
この投稿では、File System Access API の永続的な権限を管理する方法について説明します。また、問題の現在の状態と解決中の課題の簡単な要約も提供します。
DevTools のヒント: 色の作成
数回クリックするだけで色を作成する方法を学習します。
DevTools のヒント: 取得の優先度のデバッグ
取得優先度をデバッグする方法の詳細。