ブックマーク / qiita.com/uhyo (2)

  • Render hooksをコンポーネントの拡張として理解する - Qiita

    Render hooks とは、ReactにおいてカスタムフックからJSX式を返す設計パターンのことです。リンク先は私が当時在籍していた会社のテックブログに書いた記事で、当時の会社でこの設計パターンがハマる箇所に出会ったためアイデアを記事化したものです。ちなみに、Render hooksという命名は私ではなく当時の私の上司です。 私は当時から今までずっとこのパターンを推奨しているのですが、あまり流行る気配がありません。そこで、この記事では皆さんがこのパターンの考え方にもう少し納得できるように、render hooksパターンは普通のコンポーネントの拡張であるという見方をご紹介します。 Render hooksパターンの概要 Render hooksパターンは、UIの実装(JSX)と、そのUIに関連するロジック(たとえばステート)をまとめてカスタムフックから提供することを指します。簡単な例を

    Render hooksをコンポーネントの拡張として理解する - Qiita
    miki_bene
    miki_bene 2024/06/30
  • 結局useMemoはいつ使えばいいの? 僕の決定版 - Qiita

    皆さんこんにちは。筆者の以前の記事では、ReactのuseMemoを無駄に使うことによるレンダリング速度のオーバーヘッドがどれくらいかをベンチマークによって示しました。 それによれば、スマートフォンを想定したとしても、useMemoだけで描画に目に見える影響を与える(16msくらいの遅延を発生させる)には万のオーダーのuseMemoが必要なことが分かります。 速度ではなくuseMemoを使うことによるメモリ消費量の増加を気にする声も聞かれましたが、すみませんが筆者はそこまでメモリクリティカルなアプリをReactで書いたことがなく知見に乏しいため、今回はこの記事の対象外となります。 この結果が出たことでuseMemoをいつ使うのかなどという議論には終止符が打たれたかと思いきや、上記の記事の感想などを見ているとまだ喧々囂々です。 そこで、この記事では筆者の考えを皆さんに共有し、いよいよもってこ

    結局useMemoはいつ使えばいいの? 僕の決定版 - Qiita
    miki_bene
    miki_bene 2023/02/20
  • 1