- IndexedDB 2.0 標準が Chrome で完全にサポートされるようになりました。また、新しいスキーマ管理、一括操作メソッド、障害処理の標準化などが可能です。
display: fullscreenを使用すると、プログレッシブ ウェブアプリの没入感が高まります。allow-top-navigation-by-user-activationにより、サンドボックス化されたiframesの新機能が提供されます。- さまざまな機能があります。
変更内容の完全なリストを確認するには、Chromium ソース リポジトリの変更リストを確認する。
ピート ルページです。では、Chrome 58 のデベロッパー向けの新機能を詳しく見ていきましょう。
IndexedDB 2.0
サイトのデータベースの構造はパフォーマンスに大きな影響を与えるため、簡単に変更できます。IndexedDB 2.0 では、この状況が変更されています。
- リファクタリング後に、
objectストアとindexesの名前をインプレースで変更できるようになりました。 - バイナリ鍵を使用すると、パフォーマンスの低下を気にすることなく、より自然な鍵を作成できます。
getKey()、openKeyCursor()、continuePrimaryKey()メソッドを使用すると、データを簡単に取得できます。
データセット全体の一括復元では、getAll() と getAllKey() を持つカーソルが不要になりました。
全画面表示のプログレッシブ ウェブアプリ
Android のホーム画面からプログレッシブ ウェブアプリを起動すると、アドレスバーを非表示にするスタンドアロン アプリのようなモードで起動します。これにより、魅力的なユーザー エクスペリエンスを提供し、コンテンツの表示スペースを空けることができます。
しかし、ゲーム、動画プレーヤー、その他のリッチ コンテンツのような没入感の高いエクスペリエンスでは、依然としてシステムバーなどのモバイル UI 要素が注意散漫となり、重要なピクセルを占有してしまう可能性があります。
ウェブアプリ マニフェストで display: fullscreen を設定することで、プログレッシブ ウェブアプリを完全に没入感のあるものにすることができます。
standalone モードでホーム画面から起動した PWA（中央）、fullscreen モードでホーム画面から起動した PWA（右）。
アプリがホーム画面から起動された場合、アプリ以外のモバイル UI 要素はすべて非表示になります。
サンドボックス化された iframe の改善
Chrome 58 では、iframe サンドボックスという新しいキーワード allow-top-navigation-by-user-activation がサポートされるようになりました。
このキーワードがユーザー操作でトリガーされた場合、サンドボックス化された iframe で最上位のページを移動できるようにしますが、自動リダイレクトはブロックします。
など多数
もちろんこれだけではありません。
- もう
clearfixハックにさよなら。float や Clear などの複数のレイアウト プロパティを手動でリセットする代わりに、display: flow-rootを使用して新しいブロックフォーマット コンテキストを追加できるようになりました。 PointerEvents.getCoalescedEvents()を使用すると、最後にPointerEventが配信された時点以降のすべての入力イベントにアクセスできます。描画アプリなどでポイントの正確な履歴が必要な場合に最適です。- また、
WorkersとSharedWorkersがdata:URL を使用して作成できるようになりました。不透明なオリジンを指定することで、Workersを使用した開発の安全性が高まります。
これらは、デベロッパー向けの Chrome 58 での変更点のほんの一部です。
この動画が気に入ったら、デザイナーとデベロッパーをご覧ください。デザイナーとデベロッパーが協力する際に直面する課題の解決に取り組んでいる新しい動画シリーズです。
YouTube チャンネルにチャンネル登録すると、新しい動画が公開されるたびにメール通知が届きます。
Chrome 59 のリリース時に Chrome の新機能をお知らせします