このページは Cloud Translation API によって翻訳されました。

Chrome 108 の新機能

Adriana Jara

必知事項は次のとおりです。

新しいビューポートのサイズ単位により、適応型 UI を簡単に作成できます。
カラーベクターフォントで可変フォントがサポートされるようになりました。
File System Access API の一部であるインターフェース FileSystemSyncAccessHandle のメソッドが同期になりました。
その他多くの機能

Adriana Jara と申します。Chrome 108 のデベロッパー向けの新機能について詳しく見ていきましょう。

新しいビューポートサイズの単位

新しいビューポート単位を使用すると、アダプティブ UI をより細かく制御できます。

これらの単位では、ブラウザ内で開いたり閉じたりできる UI 要素が考慮されるため、ビューポート領域の測定方法が異なります。たとえば、アドレスバーです。

large 単位は、これらのユーザーエージェントインターフェースが閉じられていることを前提としたビューポートサイズを提供します。

一方、small 単位は、インターフェースが展開されていることを前提としたビューポートサイズを提供します。

dynamic 単位を使用すると、ブラウザインターフェース要素が表示されるかどうかに応じて、ビューポートのサイズが自動的に調整されます。

値は、大単位（最大値）と小単位（最小値）の範囲内の任意の値にできます。

ビューポートユニットの種類ごとに異なるビューポートの部分。

詳しくは、こちらの記事をご覧ください。また、Android ビューポートのサイズ変更動作の変更も確認して、ビューポートを適切に処理してください。

COLRv1 で可変フォントがサポートされるようになりました。

COLRv1 カラーベクターフォントは Chrome 98 以降でサポートされていますが、最初のリリースでは COLRv1 テーブルの静的機能のみがサポートされていました。

しかし、COLRv1 仕様には OpenType バリエーションも含まれています。つまり、変数軸の値を変更することでフォントプロパティを変更できます。現在、このようなバリエーションがサポートされています。

このリリースには、CSS @supports の条件拡張機能である font-tech() と font-format() も含まれています。

これらの条件により、開発者はフォント機能が利用可能になったときに検出して最新のエクスペリエンスをユーザーに提供できるほか、サポートが利用できない場合はフォールバックも作成できます。

こちらのデモで可変フォントを使って、言葉にインパクトを加えてみましょう。

FileSystemSyncAccessHandle メソッドが同期になりました。

オリジンの非公開ファイルシステムは、パフォーマンスを重視して高度に最適化された特別な種類のファイルへのアクセスを提供します。デベロッパーは、FileSystemFileHandle オブジェクトで公開されているメソッドである createSyncAccessHandle() を呼び出すことで、このようなファイルにアクセスできます。

この呼び出しの結果は FileSystemSyncAccessHandle になります。

このアクセスハンドルのメソッド truncate(newSize)、getSize()、flush()、close() は、以前は非同期でしたが、Chrome 108 以降は同期になりました。

この変更には正当な理由があります。FileSystemSyncAccessHandle を、WASM ベースのアプリケーションが想定する同期の POSIX ライクなファイル API と一致させることで、API の使い勝手を向上させ、パフォーマンスを大幅に向上させることができます。

これは互換性を破る変更となる可能性があるため、上記のメソッドを使用している場合、Promise.then() を使用すると機能しなくなります。以前は非同期だったメソッドと現在は同期のメソッドのいずれかの結果に対する then() 呼び出しを連結する場合は、コードを変更する必要があります。

// ⛔️ This will break, and you need to restructure your code:
accessHandle.flush().then(/* Follow-up code */);
// ✅ Correct:
accessHandle.flush();
/* Follow-up code */

詳細な手順については、こちらの記事をご覧ください。

その他

もちろん、他にもたくさんあります。

置換された要素の overflow の動作が変更され、ロールアウトされています。
ID プロバイダの場合は、Federated Credential Management API をご覧ください。
Media Source Extensions API をワーカーコンテキストで使用できるようになりました。

Chrome 108 の新機能

新しいビューポート サイズの単位

COLRv1 で可変フォントがサポートされるようになりました。

FileSystemSyncAccessHandle メソッドが同期になりました。

その他

関連情報

登録

新しいビューポートサイズの単位