Polymer Project 2020 - Speaker Deck

Slide 1

Slide 1 text

Polymer Project 2020 GDG DevFest 2020 Takanori Oki - 17/10/2020

Slide 2

Slide 2 text

Self introduction •Takanori Oki/@takanorip/@takanoripe(Twitter) •UI Designer/Front-end Web developer •Organizer of Web Platform Study Group(WPSG) •Formerly Polymer Japan •https://www.youtube.com/channel/UCfToJ-sTOqvBnnuVq3zdZhA •Our main activity is to update the podcast.

Slide 3

Slide 3 text

What’s the Polymer Project?

Slide 4

Slide 4 text

Polymer Project • Libraries, tools, and standards for a better web • LitElement • Web Componentsを構築するためのシンプルなベースクラスを提供してくれるライブラリ • lit-html • JavaScriptのためのHTMLテンプレートライブラリ • Formerly, this project was developing Polymer library.

Slide 5

Slide 5 text

LitElement 3.0 & lit-html 2.0 Early Preview Release

Slide 6

Slide 6 text

Blog Article https://www.polymer-project.org/blog/ 2020-09-22-lit-element-and-lit-html-next- preview

Slide 7

Slide 7 text

Motivation • Performance • Size • Features & API cleanup • Server-side-rendering

Slide 8

Slide 8 text

SSR • https://github.com/whatwg/dom/issues/831 • Declarative Shadow DOM • WebComponentsをSSRしたい！というニーズが高まっている • lit-htmlのカスタマイズ機構やDOM APIへのアクセスを制限することで、SSRしやすくなる • 「Ideas for LitElement 3.0」というissueにも「SSR Support」という項があるので、本格的にSSR対応が入りそう

Slide 9

Slide 9 text

Other major changes

Slide 10

Slide 10 text

LitElement decorators • DecoratorがメインモジュールからExportされなくなった • Decoratorを使う場合は lit-element/decorators から個別にインポートする必要がある • Decoratorを使用していない場合のサイズが小さくなる • TC39で議論中のDecoratorが導入された場合への備え

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

Material Web Components

Slide 13

Slide 13 text

Progress • https://github.com/material-components/material- components-web-components • まだプレリリースだけど… • 25 コンポーネントが実装済み • 4 コンポーネントが開発中 • 1つがTBD