Chrome Dev Summit 2014 - Polymer - 労働組合の状況

最近では、Polymer と Web Components は注目に値するトピックです。このエコシステムは急速に進化しているため、デベロッパーが最新の変更を把握することは困難な場合がよくあります。

Chrome Dev Summit での講演で、Polymer チームのエンジニアリング マネージャーである Matt McNulty 氏が Polymer の概要、および Polymer 1.0 へのロードマップの概要について説明しました。

ポリマーとは

まず Polymer とは何か、

Polymer は、ウェブ コンポーネントから要素やアプリを作成するためのライブラリです。ウェブ コンポーネントとは、デベロッパーが独自のカスタム要素を使って HTML の語彙を拡張できるようにする、最先端の新しい標準セットです。

Polymer によるアプリケーションの迅速な構築を支援

ウェブ コンポーネントはブラウザの新しいプリミティブとして設計されているため、非常に強力ですが、レベルが非常に低く、操作にはかなりのコードが必要です。

Polymer による Web Components のスイート化

Polymer では、構文を「糖衣」することで、Web コンポーネントの処理が簡単になります。記述する必要があるボイラープレート コードの量が減り、宣言型スタイルが追加されるため、HTML を記述するのと同じくらい簡単にウェブ コンポーネントを作成できます。

Polymer の実験

Polymer は、Web Component 標準をポリフィルできるかどうかを確かめるための実験として始まりました。この技術がすべてのブラウザで使用可能になる前に、開発者からフィードバックを得ることができました。Polymer を使用するデベロッパーが増えるにつれ、単なるポリフィルから、生産性機能(データ バインディング、属性変更ウォッチャー、自動ノード検索など)が満載のライブラリへと変わりました。どんなテストでも結果は出ているのに、どうやって得られたのか?

Polymer レポートカードの改善が必要です

多くのデベロッパーから、Polymer で Web Components を使った作業による表現力と生産性の向上が好まれる一方で、パフォーマンスや全体的な複雑さに関する懸念も寄せられていました。

これは、Polymer がこれまで培ってきた自然な緊張関係を浮き彫りにしています。ウェブ プラットフォームを進化させる実験であると同時に、開発者が信頼できる本番環境にふさわしいものを生み出すという試みです。

今後予定されている変更

Polymer チームは、デベロッパーが安心して使用できる、よりスリムで本番環境に対応したバージョンをリリースするために、ライブラリのすべての機能を入念に検討しました。

レイヤ

Polymer は一連のレイヤにリファクタリングされました。コア機能は高速かつ無駄がなく、より高度な機能はオプトインされます。ほとんどのユースケースでは、コア機能がデベロッパーのニーズを満たせるはずです。

ポリマーをレイヤにリファクタリング

シンプルなデータ バインディング

Polymer のデータ バインディング システムも、パフォーマンスのために大幅に最適化されています。階層化されたアプローチに続き、双方向バインディングがオプトインになりました。デフォルトは一方向バインディングです。また、公開済みのプロパティの型が明示され、プロパティの変更時にイベントが発生するようになり、異なるライブラリの要素の通信が簡単になりました。

データ バインディングが簡素化されました

より薄い Shadow DOM

Shadow DOM のポリフィルは、優れたエンジニアリング技術です。プラットフォーム プリミティブを徹底的にテストするうえで重要なことは、包括的で仕様を遵守するように設計されましたが、残念ながら Polymer が使用していない機能のパフォーマンス上のボトルネックが多数生じています。

次回リリースの Polymer では、別のアプローチを採用し、Polymer が必要とする分だけをポリフィルできる shim スタイルのレイヤを採用します。

シム シャドウダムの方がはるかに速くなります

既存のポリフィルは、Polymer 以外の汎用ウェブ コンポーネントで使用できます。

webcomponents.org に移行する

ポリフィルについても、新しい場所が登場します。現在、多くのデベロッパーが Polymer と Web Components の関係について混乱しています。ウェブ コンポーネントを使用するには Polymer 全体を使用すべきだと考える人もいますが、実際はポリフィルがあれば十分です。

この違いを明確にするために、ポリフィルを webcomponents.org に移動し、名前を webcomponents.js に変更しました。

Polyfill が webcomponents.org に移行

この移動は、他の図書館作家がポリフィルを混乱なく活用できるように設計されています。Polymer チームは引き続きポリフィルに貢献していきますが、今回の変更により、Polymer がコミュニティのためのより多くの共有リソースになることを願っています。

結果

では、これらの変更によりどのような結果が得られるでしょうか。

速度

Chrome では Polymer が 5 倍高速、Safari で 8 倍高速になりました。

Safari で Polymer が 8 倍高速に

ファイルサイズ

ファイルサイズも 87% 削減され、123 KB から 15 KB(gzip で 6 KB)に減少しました。

ポリマーが 87% 小さくなりました

ロードマップ

次のリリースで API の互換性を破る変更がいくつかあり、新しいバージョン番号(0.8)で示されていますが、これは書き換えではないことをチームが明確に示したいと考えています。現在のプロジェクトを Polymer 0.5 から 0.8 に移行するのは簡単です。

Polymer チームも、今後のリリースについてデベロッパーにより明確にするためのロードマップの概要を示しています。

Polymer ロードマップ、第 1 四半期にベータ版、第 2 四半期に 1.0

0.8 プレビューは現在、GitHub でブランチとして提供されています(ただし、まだ非常に積極的に開発中であり、ドキュメントもありません)。公式ベータ版 0.9 は 2015 年第 1 四半期にリリースされ、1.0 は第 2 四半期中にリリースされる予定です。

テスト終了

Polymer の最近のすべての変更に伴い、その背後にあるチームは、Web Components があらゆるデベロッパーのスタックに不可欠な要素となるための土台作りに着手しています。Web Components を初めて使用する場合は、これらの革新的なテクノロジーをぜひ一度ご確認ください。すでにコンポーネント(および Polymer)を扱っている方なら、未来は本当に明白です。最新情報はすべて Polymer ブログをご覧ください。質問やコメントは Polymer メーリング リストにご登録ください。今後ともよろしくお願いいたします。