Chrome 70 では、以下をサポートしました。
- Windows と Linux のデスクトップ プログレッシブ ウェブアプリ。
- 認証情報管理 API に、公開鍵認証情報のサポートが追加されました。
- また、ワーカーに名前を付けることもできます。
他にもさまざまな機能があります。
Pete LePage と申します。Chrome 70 のデベロッパー向け新機能について詳しく見てみましょう。
変更点の詳細なリストについては、Chromium ソース リポジトリの変更リストを確認する。
Windows と Linux のデスクトップ プログレッシブ ウェブアプリ
Windows と Linux にデスクトップ プログレッシブ ウェブアプリをインストールできるようになりました。
インストールが完了すると、スタートメニューから起動され、他のインストール済みアプリと同様に、アドレスバーやタブなしで実行されます。サービス ワーカーは高速で信頼性が高く、アプリ ウィンドウ エクスペリエンスは他のインストール済みアプリと同じように感じられます。
開始方法は、現在行っている方法と変わりません。既存のプログレッシブ ウェブアプリで行った作業はすべて引き続き適用されます。アプリが標準の PWA の条件を満たしている場合、Chrome は beforeinstallprompt
イベントをトリガーします。イベントを保存し、UI を追加して(アプリのインストール ボタンなど)、アプリをインストールできることをユーザーに伝えます。次に、ユーザーがボタンをクリックしたときに、保存したイベントで prompt()
を呼び出します。これにより、Chrome がユーザーにプロンプトを表示します。ユーザーが [追加] をクリックすると、Chrome によって PWA がスタートメニューとデスクトップに追加されます。
詳しくは、デスクトップ PWA に関する投稿をご覧ください。
Credential Management API: 公開鍵認証情報
Credential Management API を使用すると、ユーザーにとってログインが非常に簡単になります。これにより、サイトはブラウザの認証情報マネージャーや、Google や Facebook などの連携アカウント サービスとやり取りしてログインできるようになります。
Chrome 70 では、3 つ目の認証情報である公開鍵認証情報のサポートが追加されました。これにより、ウェブ アプリケーションは、暗号で証明された強力なアプリケーション スコープの認証情報を作成して使用し、ユーザーを強力に認証できるようになります。
サイトが 2 段階認証プロセスに指紋を使用できるようになるので、とても楽しみです。また、他のタイプのセキュリティ キーのサポートも追加され、ウェブ上のセキュリティも強化されます。
詳しくは、Credential Management API のドキュメントをご覧ください。また、WebAuthn デモとその使用方法をお試しください。
名前: workers
ワーカーを使用すると、JavaScript をメインスレッドからバックグラウンドに簡単に移動できます。これは、コストの高い複雑な JavaScript 計算を実行しているときにメインスレッドがロックしないため、サイトのインタラクティビティを維持するために重要です。
WebWorker を使用しない

多くの重い JavaScript が実行され、遅く、ぎくしゃくした動作になる。
WebWorker を使用した方法

負荷の高い JavaScript が実行されないため、高速でスムーズなエクスペリエンスが実現します。

多くの重い JavaScript が実行され、メインスレッドには影響しません。
Chrome 70 では、ワーカーに name
属性が追加されました。これは、コンストラクタのオプション引数で指定します。
const url = '/scripts/my-worker.js';
const wNYC = new Worker(url, {name: 'NewYork'});
const oSF = {name: 'SanFrancisco'};
const wSF = new Worker(url, oSF);
これにより、同じ URL を持つ複数のワーカーがある場合に、専用ワーカーを name
で区別できます。DevTools コンソールで名前を出力することもできます。これにより、デバッグしているワーカーを簡単に把握できます。
ワーカーに名前を付ける機能は、Firefox、Edge、Safari ですでに利用できます。詳細については、GitHub でのディスカッションをご覧ください。
その他
これらは、Chrome 70 のデベロッパー向けの変更のほんの一部です。もちろん、他にも多くの変更があります。
- Web Bluetooth が Windows 10 で利用可能になりました。これにより、サイトは、ユーザーが選択した近くの Bluetooth デバイスと、安全かつプライバシーを保護しながら通信できるようになります。
- Chrome は、
Report-To HTTP
レスポンス ヘッダー フィールドを使用してサーバーに介入メッセージと非推奨メッセージを送信したり、ReportingObserver
インターフェースに表示したりできます。 - 知っておくべき重要な非推奨機能がいくつかあります。詳しくは、Chrome 70 の非推奨と削除に関する投稿をご覧ください。
- Chrome DevTools の新機能については、最新の DevTools の新機能の投稿をご覧ください。
登録
最新の動画情報を受け取るには、Chrome デベロッパーの YouTube チャンネルにチャンネル登録してください。新しい動画が公開されるとメール通知が届きます。
Pete LePage と申します。Chrome 71 がリリースされ次第、Chrome の新機能についてお知らせします。