フロントエンド情報共有会議事録 2022/08/15
こんにちは、ラクス フロントエンドチームの亀ノ上です。
弊社ではエンジニアに関わらず、社員の誰でも参加が可能なフロントエンドニュースの共有会を定期的に開いています。
普段は社内で集まって情報共有会を行いますが、現在はオフィス出社とリモートワークと別れているので、オンラインで行いました。
今回は8月15日に行われたフロントエンド情報共有会の議事録を公開します。
React Server Componentsの仕組み：詳細ガイド
参考：React Server Componentsの仕組み：詳細ガイド
RSCがようやく実際に使えそう。
コンポーネントのレンダリングをサーバー側で行う。
SSRとは違うもの。
コンポーネント単位でサーバー側かクライアント側かでレンダリングを分けられる。
バンドルサイズを減らすことができる。
クライアント側のコンポーネントのレンダリングを待っていたとしても、Reactの機能によってレンダリング可能なコンポーネントからレンダリングをしていく。
RSC完璧に理解しないと使えない？
Next.jsなど、RSCをラップしているフレームワークなどを利用すれば恩恵を受けることができる。
実現するにはどうすればいいのだろうか。
ReactとNext.jsでデモが紹介されている
https://github.com/reactjs/server-components-demo
https://github.com/vercel/server-components-notes-demo
client.jsとserver.jsにわけてコンポーネントを作成していく。
Astro 1.0リリース
参考：Astro
Viteを使った静的サイトビルドツール。
ライブラリを組み合わせることもできる（Reactコンポーネント、Vueコンポーネントなど）。
Grafbase
参考：
- サーバレスでフルマネージドなGraphQLサービスGrafbaseを試してみた
- 飛躍的に伸びているBaaS「Supabase」の概要と所感
GraphQLエンドポイントが利用できるBaaS
現在private beta
技術選定で失敗しない、正解にする力
かっこいい、この姿勢を目指したい。
技術選定は正解を探しがちだけど、チーム内で合意がとれることや、自身でなんとかすることが必要。
選んだら選んだで責任がとれるようにする。
Babel が Flow から TypeScript に移行した
参考：
- Babel が Flow から TypeScript に移行した
- Migrating millions of lines of code to TypeScript
移行のためにツールを作るのは技術者っぽくていい。
移行するときは「移行だけ」を瞬発的にやるのがいいのかも（できるなら）。
stripeもツールで一気に行われた。
フロントエンドが遅いと言われた時に
本当にフロントエンドなのか切り分ける。
APIなのかロジックなのかDOM操作なのか。
特定のライブラリ操作でパフォーマンスが低下する場合はコメントをつけて修正したりする。
パフォーマンスは軽視されることもあるので参考になりそう。
設計の考え方とやり方
参考：設計の考え方とやり方（33~36ページ）
どうやって設計スキルを見直すのだろう？
調べたことを実践する。
実践した引き出しの検索能力をあげる。
業務の中で実践していきたい。