行ってきた yj-meetup.connpass.com
Flummox から Redux へリプレースした話
FOLIOに画像回帰テストを導入した話
- 画面テストどこまでテストするか
- 少ないと不安、多いとメンテが大変 → わかる
- Jest とかを使えば Snapshot テストで楽できる
- Folio はそもそも DOM のテストではなく画像そのものでテストしているらしい
- 画像でのテストに必要なのは「キャプチャ生成」と「画像比較」の 2 つ
- 「キャプチャ生成」は Storybook
- 「画像比較」は reg-viz/reg-suit を使ってる
- 「assets の読み込みタイミングによっては意図しない差分が出る」「CI で回すと CI の時間が長くなる」などの問題もある
- 問題解決のために自作した、というお話 → Quramy/zisui
- 全画面撮ってるのか？画面の選定基準はあるのか？は気になる
- 対象ブラウザはとか、キャプチャした画像の保存期間はなどはどうしているのだろうか？
PWA 対応戦略と現実解
- Progressive Web Apps Checklist がある
- PWA が目指すのは「安全である」「ハイパフォーマンス」「インストール可能」ということ
- パフォーマンスを向上させるためにやること
- ロードパフォーマンスを最適化する → これだけで結構体験が変わるらしい
- HTTPS 化されていれば Service Worker で静的アセットをキャッシュする
- 上が済んでから App Manifest を置く
- オフライン化は事業内容と相談
- Web push はユーザーにとって必要な情報をちゃんとリサーチする
- → ここまでやれば、ネイティブアプリにだいぶ近くなる
Chrome DevToolsを使い倒せ！(仮)
- まずは Audits の Lighthouse 使おう
- Sources の Overrides 機能を使うとソースコードの上書きができる
- coverage で assets を使っているかどうか分かる
