Chrome 58 の新機能

Pete LePage

  • 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 を設定することで、プログレッシブ ウェブアプリを完全に没入感のあるものにすることができます。

ホーム画面から起動した PWA（左）、standalone モードでホーム画面から起動した PWA（中央）、fullscreen モードでホーム画面から起動した PWA（右）。

アプリがホーム画面から起動されると、アプリ以外のモバイル UI 要素はすべて非表示になります。

サンドボックス化された iframe の改善

Chrome 58 で、新しい iframe サンドボックス キーワード allow-top-navigation-by-user-activation がサポートされるようになりました。

このキーワードは、ユーザー操作によってトリガーされると、自動リダイレクトをブロックしながら、サンドボックス化された iframe にトップレベル ページを移動する機能を付与します。

その他

他にもさまざまな機能があります。

  • clearfix ハックはサポートされなくなります。浮動やクリアなどの複数のレイアウト プロパティを手動でリセットする代わりに、display: flow-root を使用して新しいブロック形式のコンテキストを追加できるようになりました。
  • PointerEvents.getCoalescedEvents() を使用すると、PointerEvent が最後に配信されてからのすべての入力イベントにアクセスできます。描画アプリなどでポイントの正確な履歴が必要な場合に最適です。
  • また、Workers と SharedWorkers を data: URL を使用して作成できるようになりました。これにより、Workers で開発する際のセキュリティが強化され、不透明なオリジンが提供されます。

これらは、Chrome 58 でデベロッパー向けに行われた変更のほんの一部です。

この動画がお役に立ちましたら、デザイナーとデベロッパーもご覧ください。デザイナーとデベロッパーが連携する際に直面する課題を解決するための新しい動画シリーズです。

YouTube チャンネルにチャンネル登録すると、新しい動画が公開されるたびにメール通知が届きます。

担当の Pete LePage です。Chrome 59 がリリースされ次第、Chrome の新機能についてお知らせします。