Future, Faster: Unlock the Power of Web Components with Polymer (Google I/O '17)を見ました。
全体として、そもそもWeb ComponentsやPolymerに馴染みのない開発者向けにPolymer 2.0の紹介やWeb Componentsがブラウザで標準サポートされる意義を噛み砕いて紹介する内容でした。Polymer Summit 2016をご覧になった方にはほとんど新しい内容はないと思います。また、他のJSライブラリユーザーに向け、Polymer 1.0では難しかった他のJSライブラリ(angular/react)との互換がPolymer 2.0の登場でより簡単になった点についても言及しています。
以下動画を見ながらメモしたものです。書き起こすのは大変なので、Web ComponentsやPolymerの一般的な内容は割愛しました。ご覧になる際に参考にしてください。
(！)は拍手や歓声のあった瞬間です(笑)
- 2:27 (!!)safari10からCustom ElementsとShadow DOMを正式にサポート
- 11:34 Polymerを使っている企業の紹介(Comcast/USA Today/ING/NET-A-POTER/BBVA/Coca Cola/Electronic Art/Predix/Google Earth/Youtube)
- 15:47 (!)Polymer 2.0の発表
- 16:14 (!)ブラウザがWeb Componentsをサポートし始めたのでPolymer 2.0は1.0のファイルサイズは1/4に
- 18:45 (!)Web Componentsは標準だから、サポートブラウザであればconsole上でそのままコードを試すことだってできる(ライブラリも不要)
- 22:06 Polymer2.0 + Polyfill(Custom Elements&Shadow DOM&CSS Custom Properties)のサイズ Chrome(11k)Safari(14k)Firefox(33k)
Edge(33k)IE(37k) - 22:47 Angularやpreact(Reactのalt版)のコンポーネントとも互換性がある
- 23:57 Polymer 2.0は、全てのJSライブラリとも互換性がある
- 24:46 Polymer 1.0から2.0へのスムーズなマイグレーションが可能
- 29:25 最近ローンチされたWebComponentsOrgは開発者の作成したオープンソースのWeb Componentsを共有可能なプラットフォーム(すでに1000を越えるコンポーネントがアップされている)
- 32:36 IDEのプラグイン(Qiitaに投稿した記事)と新しいPolymer CLIの紹介
- 33:45 ここからPRPLパターンの説明
- 34:02 PRPLパターンの誕生したエピソード。(凄い…これぞ集合知)
- 36:37 Twitter LiteがPRPLパターンに基づいて作成されたという話。PRPLは固有のライブラリに縛られない応用のきくコンセプトである。
- 37:02 PWAのサンプルとしてデモアプリケーションPolymer Newsを紹介
- 39:56 写真加工アプリCheeseも作ってみた
- 41:24 IOのWeb Components関連のプレゼン紹介
- 42:18 (!!)次のPolymer SummitはCopenhagenでAugust 22-23, 2017に開催。Chromeの検索から「g.co/polymersummit2017」にアクセスすると申し込みの方法など確認できる。