---
# System prepended metadata

title: WPSG Podcast#3 Show note

---

# WPSG Podcast#3 Show note

## 日時

2020/03/24 20:00

## 参加者

- takanorip
- aggre
- sizuhiko

## YouTube Link
https://youtu.be/RU1rg0pDB-8

## 議題

- Shadow DOM のユースケースとしての SSR(というかハイドレーションの不要化)
    - SSRしたいとき
        - Bot フレンドリー
        - First Meaningful Paint の短縮
    - SSRの一般的なフロー
        - リクエストに応じてSPAを実行、もしくはプリレンダリングしてHTMLを返す
        - クライアント側でリハイドレーションする(SPAと状態管理)
    - 要求に対してコストパフォーマンス悪い
        - SPAを非ブラウザ環境で実行するつらみ
        - リハイドレーションによってTime To Interactiveが遅れるつらみ
    - ShadowDOMとslot使うと楽になる
        - 仕様のおさらい、ShadowDOMの中にslotがあるとき、ShadowDOMをもつ要素の子要素がslotにアサインされる
            - https://developers.google.com/web/fundamentals/web-components/shadowdom?hl=ja#slots
        - SPAのルートをカスタムエレメント(x-app)のShadowDOMにする
        - SSRするのはx-appの子要素としてMeaningful Contentsだけをレンダリング
    - ブラウザではMeaningful Contentsがより早くレンダリングされる
    - サーバはSPAを実行する必然性が下がる
    - SPAは常にShadowDOMの中で初期化されるためリハイドレーションは不要
    - aggre の[ブログ](https://aggre.io/post/web-components-ssr)
- Micro Frontend 2020
    - https://micro-frontends.org/
    - みんなやってる？
    - takanorip
        - コンポーネントの境界の引き方の難しさ
        - ステートの流れ方が変わってきてる
            - 親->子 to 子が自ら取得
    - aggre
        - エンジニアが自分がやっているタスクを一番パフォーマンス出せる技術でやりたい
        - 共通ランタイムの使い方がキモ
        - クリティカルレンダリングパスのことを考えると共通化できるとこは共通化したい、それとどう戦うか
        - 全体をまとめる薄い層が上にある？
        - RESTFULに振る舞えるのが良い
- Web標準の追い方 2020
    - takanorip
        - W3CのGitHubリポジトリ（issue）を眺める
            - https://github.com/w3c
        - 各ブラウザのリリースノート
        - TechFeed Pro
    - aggre
        - GitHub
        - [Google Chrome Developers](https://www.youtube.com/user/ChromeDevelopers) を眺める
    - sizuhiko
        - https://www.w3.org/community/browserobo/
        - https://www.w3.org/community/

## レギュレーション

- NG 誹謗中傷、人種差別、ジェンダー差別、放送禁止用語
- NG お金、仮想通貨、株、FXなどで利益に繋がった話
- NG 自社のコンプライアンスに関する話、仕事の不満の話
- NG 政治の話
- NG 宗教の話
- OK 買い物（ポルシェでも可）
