/ddddddiary

仕事が順調に進む。今作ってる機能のフロントエンドは全部書き終わったので、あとは PR 分割してレビュー出して終わり。残るはサーバサイド。なんか色々やることあってめんどくさいんだよな。なんか口内に違和感があり2週間ぐらい歯医者行きたいと思い続けてる。しかし思い続けてるだけで次の一歩が踏み出せない（？）。明日は絶対に歯医者予約する。予約できたら100点

---

• なんとなくもう useSWR 使わずに use と素の fetch だけで Suspense しつつデータ取れんじゃないかと思って試してみたら、簡単にできた（型は適当）。この useFetch をコンポーネントの中で使うとサスペンドしてくれる。

  • const promiseCache = new Map<string, Promise<unknown>>();
    
    const useFetch = (key: string,　fetcher: () => Promise<unknown>): unknown => {		
        if (!promiseCache.has(key)) {
      	const promise = fetcher()
      	promiseCache.set(key, promise);
        }
        return use(promiseCache.get(key) as Promise<unknown>);
        };　
    

  • 肝は Promise をスコープ外にキャッシュしておく必要があるところだ。キャッシュしないと無限再レンダリング地獄になる。なぜそうなるのかについてはここが詳しい。まあこんなもんでいいだろ。外部依存なんて使わなければ使わないほど良い。
• せっかくだからライブラリ使わずに Context だけで状態管理するか、って思ったけど selector 的なものを素の React でどう書けばいいのかわからない。
  • AI に聞いたら useSyncExternalStore を使えばいいらしいんだけど、ほんまか？この hooks のこと全然知らない…
    • こういうかんじになるのかなぁ
  • こんな useSyncExternalStore の使い方が