Google Developers Japan: Chrome 49 ベータ版: CSS Custom Properties、Background Sync、ES2015 の新機能など

Local blog for Japanese speaking developers

Chrome 49 ベータ版: CSS Custom Properties、Background Sync、ES2015 の新機能など

2016年2月26日金曜日

[この記事は同期サムライ Josh Karlin による Chromium Blog の記事 "Chrome 49 Beta: CSS custom properties, background sync with service workers, and new ES2015 features" を元に翻訳・加筆したものです。詳しくは元記事をご覧ください。] 特に記載のない限り、下記の変更は Android、Chrome OS、Linux、Mac、Windows 向けの最新の Chrome ベータ版に適用されます。

CSS カスタムプロパティ

最近のモダンなウェブサイトには、値の繰り返しを含む CSS ファイルを使用しているものがあります。たとえば、1 つのカラースキーム内の 2～3 色をページ全体で再利用する手法です。このようなデータを変更するのは手間もかかり、作業ミスも発生しやすくなります。変更が必要な箇所が、1 つまたは複数の CSS ファイル全体に散らばっているからです。この事態を改善するため、Chrome で CSS Custom Properties がサポートされるようになります。これによって、外部フレームワークを使用せずに CSS 内部でプロパティ変数を定義できるようになります。デベロッパーはドキュメント内の好きな場所で var() 関数を使って、Custom Property を参照することができます。

Custom Property の変更により、ウェブサイト内の複数のコンポーネントを更新可能
CSS Custom Properties は、Shadow Root をまたいで継承されます。したがって、内部のことが分からなくても、外観に微調整を加えたりテーマを設定したりする「Style API」を提供する Web Component を実現できます。Polymer ライブラリではこのプラットフォーム機能を使って、コンポーネントのカスタマイズを簡略化しています。

Service Worker で Background Sync

ユーザーがサイトに滞在する時間がきわめて短く、そのサイトで行った変更がネットワークに送信される前に別のサイトに移動した場合、サイトでローカルの変更を反映しきれなかったり、同期に失敗したりすることがありました。たとえば、メールクライアントを使っていたユーザーが「送信」をクリックしてすぐに別のサイトに移った場合、送信中のメッセージが消失することがあります。新たに追加される Background Sync API は、ネットワークの信頼性を高めるためのものです。Service Worker は、スケジュールを作成してそのデバイス上での変更を反映するための 1 回限りの同期を実行します。これは、デバイスが次回ネットワークに接続するときに実行され、該当サイトが開かれているかどうかにはよりません。

ECMAScript 2015 サポートの改善

ES2015 仕様（ES6）は、大幅な変更が加わった JavaScript の最新仕様です。これによって、読みやすくて強力でメモリ利用効率の高いアプリケーションロジックを書くことができるようになります。最新バージョンである Chrome の V8 エンジンでは、JavaScript ES2015 の機能の 91% がサポートされています。分割代入（destructuring）や関数のデフォルトパラメータを指定できるようになるため、配列やオブジェクトからデータを抽出したり、関数パラメータにデフォルト値を設定する際にボイラプレートコードを回避できるようになります。Proxy オブジェクトや Reflect API を使用すると、たとえばプロパティの検索や割り当てなど、以前は制御できなかった動作をカスタマイズすることができます。また、最新バージョンの Chrome では、strict（厳格）モードの外でも class などのブロックレベルの構造や let が利用できるようになっています。

keygen および application/x-x509-user-cert

<keygen> エレメントは、HTML フォームの一部として使用してキーペアを生成することができます。これはユーザーセキュリティを強化するためのものですが、<keygen> と、MIME タイプが「application/x-x509-user-cert」のユーザー証明書が送信されると、それが悪用されてユーザーのセキュアな通信が阻害されたり、使用しているデバイスの機能への干渉が発生したり、同意なしにユーザーの行動が追跡されたりする恐れがあります。その対応として、<keygen> はデフォルトで空の文字列を返すようになります。また、MIME タイプ「application/x-x509-user-cert」で送信されたユーザー証明書は、自動的にダウンロードされたりインストールされることはなくなります。

今回のリリースのその他の機能

MediaRecorder API が追加されます。これを使うと、ユーザーから同意を得ていれば、プラグインがなくてもウェブサイトで音声や映像の録音や録画ができます。

デベロッパーは CSS で font-display を使って、フォントを読み込む方法を制御できるようになります。これによってページの読み込み速度が向上します。

FetchEvent.clientID 属性を使うと、Fetch リクエストを開始した Service Worker クライアントを検知し、そのクライアントに個別の応答を返すことができるようになります。

マウスのホイールなど、不連続にスクロールするデバイスなどを使ったときにスクロール操作がアニメーションされ、動作がより円滑になります。

Secure Cookie の保護がさらに強化されます。Cookie のプレフィックスを使って、Secure Cookie を特定できるようになります。

Remote Playback API に含まれている disableRemotePlayback 属性を使って、リモートでメディアを再生する操作を無効化できるようになります。

Event.timeStamp が DOMTimeStamp から DOMHighResTimeStamp に変更されます。これによって、スクロールの遅延やポインタ速度の測定を高精度で行えるようになります。

UnhandledRejection イベントおよび RejectionHandled イベントによって、Promise が拒否されたときの処理を追跡できるようになります。

URLSearchParams を使用して、より簡単に URL の GET パラメータの操作を行えるようになります。

WebAudio API で、IIR フィルタ、OfflineAudioContext.suspend() と resume()、DecodeAudioData の Promise がサポートされます。

WindowClient.navigate() で、Service Worker が操作中のウィンドウを新しい URL にナビゲートできるようになります。

サイトで Save-Data ヘッダーフィールドをチェックし、ユーザーがデータの使用量の削減をリクエストしているかどうかを検知できるようになります。これによって、ウェブとの応答操作を軽くすることができます。

細かな変更

Chrome の CSP (Contents Security Policy) で、‘script-src http:’ が HTTP と HTTPS の両方に一致するようになります。これによって、デベロッパーがセキュアなリソースまで不用意に拒否することを防ぐことができます。

Fetch API の Enum、Request.mode で navigate モードがサポートされるようになります。これによって、より正確に仕様に準拠するようになります。

属性セレクターのマッチング処理で、大文字と小文字の違いを無視するオプションがサポートされます。

'rel=noopener' を指定することで、オープン元のページを明示しないポップアップを作成できるようになります。

addEventListener() と removeEventListener() の最初の 2 つの引数が必須となります。また、ディクショナリの構文を使って "capture" オプションを指定できるようになります。これによって、より正確に仕様に準拠するようになり、柔軟性も向上します。

Chromium の TLS で、標準化バージョンの ChaCha-Poly1305 暗号スイートがサポートされます。

Navigator の仕様に含まれなくなっている Navigator.getStorageUpdates() が削除されます。

MouseEvent.webkitMovementX/Y は、プレフィックスなしのバージョンで置き換えられ、削除されます。

initTouchEvent は、より正確に仕様に準拠するため、TouchEvent コンストラクタで置き換えられます。initTouchEvent は廃止予定となります。Chrome 53 で完全に削除される予定です。

Object.observe() は、標準化の対象に含まれなくなったため廃止予定となります。将来のリリースで削除される予定です。

getComputedStyle(e).cssX の動作は、公式の仕様に含まれなくなったため、廃止予定となります。

RTCPeerConnection のレガシーメソッドの一部の非標準的な使用方法は廃止予定となります。これによって、Promise ベースの WebRTC 仕様の実装を利用できるようになります。

Document.defaultCharset は、より正確に仕様に準拠するため、廃止予定となります。

Eiji Kitamura - Developer Relations Team

ラベル

ブログアーカイブ

2024
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2023
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2022
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2021
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2020
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2019
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2018
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2017
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2016
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2015
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月

2014
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2013
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2012
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2011
- 12月
- 11月
- 10月
- 9月
- 8月
- 7月
- 6月
- 5月
- 4月
- 3月
- 2月
- 1月

2010
- 12月
- 11月

Feed

"プロダクトに関するご意見はプロダクトフォーラムにお願いします"

Google
Privacy
Terms