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

Polymer と Web コンポーネントは最近非常にホットなトピックです。このエコシステムは急速に進化しているため、デベロッパーが最新の変更をすべて把握するのは難しい場合があります。

Chrome Dev Summit での講演で、Polymer チームのエンジニアリング マネージャーである Matt McNulty 氏は、Polymer の概要と、Polymer 1.0 へのロードマップを説明しました。

Polymer とは何ですか?

まず、Polymer とは具体的に何でしょうか。

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

Polymer は、デベロッパーがアプリケーションをより迅速に構築できるよう支援します。

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

Polymer で Web Components をさらに便利に

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

Polymer 試験運用版

Polymer は、Web コンポーネント スタンダードにポリフィルを適用し、これらのテクノロジーがすべてのブラウザにリリースされる前にデベロッパーからフィードバックを得られるかどうかをテストする目的で始まりました。多くのデベロッパーが Polymer の使用を開始するにつれて、Polymer は単なるポリフィルから、生産性向上機能(データ バインディング、属性変更ウォッチャー、ノードの自動検出など)を備えた実際のライブラリへと変化しました。すべてのテストには結果があります。では、結果はどうだったのでしょうか。

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

多くのデベロッパーは、Polymer の Web コンポーネントを使用すると表現力が高まり、生産性が向上すると回答しましたが、パフォーマンスと全体的な複雑さに関する懸念も示しています。

これは、Polymer がこれまで抱えてきた自然な緊張関係を浮き彫りにしています。ウェブ プラットフォームを前進させるための実験でありながら、デベロッパーが信頼できる本番環境にふさわしいものを作成する。

今後予定されている変更

Polymer チームは、デベロッパーが安心して使用できる、よりスリムで本番環境対応のバージョンを完成させることを目標に、ライブラリのすべての機能を慎重に検討しました。

レイヤ

Polymer は、一連のレイヤにリファクタリングされました。コア機能は高速でシンプルですが、高度な機能はオプトイン制となります。ほとんどのユースケースでは、コア機能でデベロッパーのニーズを満たすことができます。

Polymer がレイヤにリファクタリングされました

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

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

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

よりシンプルな Shadow DOM

Shadow DOM ポリフィルは、エンジニアリングの驚くべき偉業です。包括的で仕様に準拠するように設計されているため、プラットフォーム プリミティブを徹底的にテストするために重要ですが、残念ながら、Polymer で使用されていない機能にパフォーマンスのボトルネックが発生します。

Polymer の次のリリースでは、Polymer に必要なものだけをポリフィルする shim スタイルのレイヤを採用するなど、別のアプローチが取られます。

シムのシャドウ DOM が大幅に高速化

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

webcomponents.org への移行

ポリフィルについても、新しい場所に移動します。現在、多くのデベロッパーは、Polymer と Web コンポーネントの関係について混乱しています。ウェブ コンポーネントを使用するには Polymer のすべてを使用する必要があると考える人もいますが、実際に必要なのはポリフィルのみです。

この区別を明確にするため、ポリフィルは webcomponents.org に移動され、名前が webcomponents.js に変更されました。

ポリフィルの webcomponents.org への移行

この変更は、他のライブラリ作成者が混乱することなくポリフィルを利用できるようにすることを目的としています。Polymer チームは引き続きポリフィルに貢献しますが、この変更により、ポリフィルがコミュニティの共有リソースとしてより活用されることを願っています。

結果

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

速度

Chrome では Polymer の速度が5 倍に、Safari では8 倍に高速化されました。

Safari で Polymer の速度が 8 倍に

ファイルサイズ

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

Polymer が 87% 小さくなりました

ロードマップ

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

また、Polymer チームは、今後のリリースについてデベロッパーの皆様に明確に伝えるため、ロードマップも概説しています。

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

0.8 プレビュー版は GitHub のブランチとしてご利用いただけます(現在も積極的に開発中であり、ドキュメントが不足しています)。0.9 の正式なベータ版は 2015 年第 1 四半期、1.0 は第 2 四半期のリリースを予定しています。

テストの終了

Polymer の最近の変更により、Polymer のチームは、Web コンポーネントがすべてのデベロッパーのスタックの不可欠な部分となるための基盤を築いています。Web Components を初めて使用する場合は、この変革的なテクノロジーをぜひご確認ください。すでにコンポーネント(および Polymer)を使用している場合は、今後が明るいと期待できます。Polymer ブログで最新情報を確認してください。また、Polymer メーリング リストに登録して、質問やコメントを送信してください。みなさんの成功をお祈りします。