矢倉 眞隆

WebAssembly実装プレビュー、Chrome 49新機能など─2016年3月のブラウザ関連ニュース振り返り

連載: WEB標準化動向 (11)

2016年3月のブラウザニュースは、Chrome 49の新機能、Firefox 45とinnerText、WebAssembly実装のプレビュー、Edgeの拡張機能、Safari 9.1リリースなどについて紹介します。

Chrome 49でCSS Variablesサポート

3月2日に、Chrome 49がリリースされました。新機能はベータ版がリリースされた際にまとめられています。また、同じエンジンを搭載するOpera 36のリリース記事でも紹介されています。

注目はCSS Custom Properties(通称Variables)でしょうか。プリプロセッサやポストプロセッサが持つ変数とちがい、ちゃんと継承されるというのが特徴です。これを利用し、Jake Archibaldが、display の値をカスタムプロパティで定義し、外部CSSが読み込まれた際に block に書きかえさせ段階的にCSSを読み込ませるというアイデアを披露しています。

V8も更新され、ES2015のdestructuringとdefault parametersが使えるようになりました。また、Promiseのrejectionを検知する unhandledrejection イベントおよび rejectionhandled イベントもサポートされました。

Firefox 45と innerText

3月8日に、Firefox 45がリリースされました。

ES 2015のClass構文が有効にされています。うれしいですね。

他には、他ブラウザとの互換性のため innerText プロパティがサポートされました。要素内の「レンダリングされたテキスト」を取得するプロパティです。

この「レンダリング」というのが曲者です。要素内の文字列を取得するには textContent プロパティがありますが、こちらは「DOM要素内のテキスト」なので display: none などが指定された要素内のテキストももちろん返ります。いっぽう、 innerText はレンダリング結果を考慮するため display: none な要素内のテキストは結果に入りません。

innerText はブラウザ拡張などで外部サイトをいじったりするときには便利だったりしますが、レイアウトを行うためパフォーマンスに影響があります。単純に要素のテキストを取得したい場合は textContent を使いましょう。

WebAssembly実装のプレビュー

3月15日に、Mozilla、Google、Microsoftが、WebAssemblyの実験的なサポート状況について公開しました。WebAssemblyの試験実装は昨年から進められていますが、3ブラウザで相互運用可能な状態になったとのことです。

FirefoxとChromeについては、NightlyやCanaryでフラグを有効にすると試せます。

WebAssemblyについては、中心人物のひとり、MozillaのLuke Wagner氏へのインタビューが面白いです(インタビューの場に混ぜていただきました)。インタビューが行われたMozillaのView Source Conferenceでのセッション資料も参考になります。

また、先日ポッドキャストでのインタビューも行われています。こちらもあわせてどうぞ。

Edgeの拡張がプレビュー版に

Microsoft Edgeの拡張機能が、ついにプレビュー版に入りました。

拡張は正式リリース時にはWindows Storeから追加できるようになるそうです。

拡張の構造はChrome拡張互換のAPIですが、現時点では本家やMozillaのWebExtensionsと少し違い、chrome オブジェクトが browser オブジェクトに変わっているそうです。ちょっと面倒ですね。

サポート予定のAPIはロードマップが公開されています。Firefox, Edge, Chromium系で(だいたい)同じコードで拡張が動くようになるのでやる気がでますね。

Safari 9.1リリース、さらにTechnology Preview登場

3月21日に、OS X 10.11.4とiOS 9.3がアップデートされ、Safari 9.1がリリースとなりました。WebKitのブログで新しい機能が紹介されています。

新しい機能は内部的に利用されてもいるようで、追加されたCSS Custom Propertiesを使い、Web Inspectorのコードをシンプルにした話もエントリとして公開されています。

さらに、3月30日、Safari Technology Previewという開発者向けのビルドが公開されました。

Safari Technology Previewはリリース版のSafariよりも新しいWebKitを搭載したビルドで、2週間にいちど更新されます。最初のビルドではES2015のArrow Functionsやイテレータ、Web標準ではShadow DOM (v1)などが使えるようになっています。

なお、レンダリングエンジンのWebKitはこれまでもナイトリービルドを提供していましたが、Safari Technology Previewは独立したUIを持ち、App Storeから更新されるといった違いがあります。

現段階でiOS版のプレビューは提供されていませんが、多くの人がそれを望んでるだろうとは認識しているとのこと。こちらのほうが出ると嬉しいので、要望をあげましょう。

de:code 2017
Powered byNTT Communications

tag list

アクセシビリティ イベント エンタープライズ デザイン ハイブリッド パフォーマンス ブラウザ プログラミング マークアップ モバイル 海外 高速化 Angular2 AngularJS Canvas Chrome Cordova CSS de:code ECMAScript Edge Firefox Google Google I/O 2014 HTML5 Conference 2013 html5j IoT JavaScript Microsoft Node.js PhoneGap Polymer React Safari SkyWay TypeScript UI UX W3C W3C仕様 Webアプリ Web Components WebGL WebRTC WebSocket