Chrome 49 ベータ: CSS カスタムプロパティ、Service Worker を使用したバックグラウンド同期、および ES2015 の新機能_html/css

Chrome 49 ベータ: CSS カスタムプロパティ、Service Worker を使用したバックグラウンド同期、および ES2015 の新機能_html/css_WEB-ITnose

WBOY

リリース： 2016-06-24 11:25:54

オリジナル

1563 人が閲覧しました

英語原文: Chrome 49 Beta: CSS カスタムプロパティ、サービスワーカーとのバックグラウンド同期、および ES2015 の新機能

著者: Josh Karlin、Syncing Samurai

特に断りのない限り、以下に説明する更新は最新の Chrome に適用されますベータ版 (Android、Chrome OS、Linux、Mac、Windows)。

CSS カスタムプロパティ

最近の Web サイトでは、CSS ファイルに繰り返し値が含まれることがよくあります。たとえば、ページ全体の配色からいくつかの色を再利用しています。このデータは 1 つ以上の CSS ファイルにまたがっているため、変更は面倒でエラーが発生しやすくなります。この状況を改善するために、Chrome は CSS カスタムプロパティをサポートするようになり、開発者は外部フレームワークを使用せずに CSS でプロパティ変数を定義できるようになりました。開発者は、var() 関数を使用して、ドキュメント内の任意の場所でこれらのカスタムプロパティを参照できます。

カスタムプロパティを変更すると、Web サイト内の複数のコンポーネントが更新される可能性があります

CSS カスタムプロパティはシャドウルート間で継承することもできるため、Web コンポーネントはコンポーネントの内容を知らなくても使用できる「スタイル API」を提供できます。コンポーネントとテーマを設定します。 Polymer ライブラリは、このプラットフォーム機能を利用してカスタムコンポーネントを簡素化します。

バックグラウンド同期に Service Worker を使用する

以前は、更新がネットワーク経由で送信される前にユーザーがサイトに留まらなかった場合、サイトのローカルの変更が失われるか、同期が失われる可能性がありました。たとえば、ユーザーが「送信」をクリックしてすぐに移動すると、電子メール Web クライアントは進行中のメッセージを失う可能性があります。新しいバックグラウンド同期 API は、次回デバイスがネットワークに接続したときに (Web サイトが開いていない場合でも) Service Worker によってユーザーのローカル変更の 1 回限りの同期を実行することにより、ネットワークの信頼性を向上させます。

ECMAScript 2015 サポートの改善

ES2015 仕様 (ES6) は JavaScript のメジャーアップデートであり、開発者はより明確で、より強力で、よりメモリ効率の高いアプリケーションロジックを作成できます。 Chrome V8 エンジンの最新バージョンは、JavaScript ES2015 機能の 91% をサポートしています。開発者は、配列やオブジェクトからデータを抽出するとき、または関数パラメーターのデフォルト値を設定するときに、分割パラメーターとデフォルトパラメーターを使用して定型コードを回避できるようになりました。プロキシオブジェクトと Reflect API は、プロパティの検索や割り当てなど、以前は非表示だったオブジェクトの動作をカスタマイズできます。 Chrome の最新バージョンでは、クラスなどのブロックレベルの構造を構築して、厳密モード以外でも利用できるようにすることもできます。

Keygen と application/x-x509-user-cert

要素は、HTML フォームの一部であるキーペアを生成するために使用されます。これはユーザーのセキュリティを強化するために使用できますが、MIME タイプ application/x-x509-user-cert 経由で送信されるユーザー証明書が悪用されて、ユーザーの安全な通信が中断され、デバイスの操作が妨害される可能性もあります。またはユーザーの同意なしにユーザーを追跡すること。今後、はデフォルトで空の文字列を返し、MIME タイプ application/x-x509-user-cert 経由で送信されたユーザー証明書を自動的にダウンロードおよびインストールしなくなります。

このリリースのその他の機能

ユーザーの同意があれば、Web サイトはプラグインに依存せずに、新しい MediaRecorder API を使用してオーディオとビデオを記録できます。
開発者は CSS font-display を使用してフォントの読み込み方法を制御し、ページの読み込み速度を向上できるようになりました。
Web サイトは、FetchEvent.clientID プロパティを使用して、どの Service Worker クライアントがフェッチリクエストを開始したかを確認し、専用の応答を返すことができるようになりました。
マウスホイールなどの不連続なスクロールデバイスの場合、Chrome はスクロールをアニメーション化し、よりスムーズなユーザーエクスペリエンスを実現します。
Chrome はセキュア Cookie をより厳密に保護し、開発者が Cookie プレフィックスを使用してセキュア Cookie を識別できるようになりました。
Web サイトは、disableRemotePlayback 属性 (リモート再生 API の一部) を使用してメディアのリモート再生を防止できるようになりました。
Event.timeStamp は DOMTimeStamp の代わりに DOMHighResTimeStamp を使用するようになり、高精度のスクロール遅延とポインター速度の測定が可能になりました。
Promise の拒否処理を、UnhandledRejection および RejectionHandled イベントを使用して追跡できるようになりました。
開発者は、URLSearchParams を使用して URL の GET パラメータをより簡単に操作できるようになりました。
WebAudio API は、DecodeAudioData の Promise に加えて、IIR フィルター、OfflineAudioContext.suspend() およびresume() をサポートするようになりました。
WindowClient.navigate() を使用すると、Service Worker は制御されているウィンドウを新しい URL に見つけることができます。
Web サイトは、Save-Data ヘッダーフィールドを選択することで、ユーザーがデータ使用量の削減を要求したかどうかを検出し、より迅速かつ簡単に応答できます。

小さな変更

Chrome のコンテンツセキュリティポリシーでは、「script-src http:」が HTTP および HTTPS と一致することを許可するようになり、開発者が安全なリソースを誤って拒否することを防ぎます。
Fetch API の Request.mode 列挙は、仕様への準拠を強化するためにナビゲーションモードをサポートするようになりました。
開発者は、属性セレクターを照合するときに大文字と小文字を無視することを選択できるようになりました。
現在、開発者はリストにないポップアップウィンドウを作成でき、ページはこのウィンドウを開くために「rel=noopener」を使用します。
addEventListener() と RemoveEventListener() は最初の 2 つの引数を必要とし、辞書構文を使用して「キャプチャ」オプションを指定するようになりました。これにより、仕様への準拠が向上し、柔軟性が向上します。
Chromium は、TLS の標準 ChaCha-Poly1305 暗号スイートをサポートするようになりました。
Navigator.getStorageUpdates() は Navigator 仕様に存在しなくなったため、削除されました。
MouseEvent.webkitMovementX/Y は削除され、プレフィックスのないバージョンに置き換えられました。
initTouchEvent は、仕様への準拠を強化するために TouchEvent コンストラクターを優先して非推奨になり、Chrome 53 では完全に削除されます。
Object.observe() は標準化のトレンドに適合しなくなったため非推奨となり、将来のバージョンでは削除される予定です。
getComputedStyle(e).cssX の動作は、正式に仕様の一部ではないため、非推奨になりました。
特定の RTCPeerConnection レガシーメソッドの非標準的な使用は、WebRTC 仕様の Promise ベースの実装では非推奨になりました。
Document.defaultCharset は、仕様要件への準拠を強化するために非推奨になりました。