[フレーム]
はてなブックマークアプリ

サクサク読めて、
アプリ限定の機能も多数!

アプリで開く

気に入った記事をブックマーク

  • 気に入った記事を保存できます
    保存した記事の一覧は、はてなブックマークで確認・編集ができます
  • 記事を読んだ感想やメモを書き残せます
  • 非公開でブックマークすることもできます
適切な情報に変更

エントリーの編集

loading...

エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。

タイトルガイドライン

このページのオーナーなので以下のアクションを実行できます

タイトル、本文などの情報を
再取得することができます
コメントを非表示にできます コメント表示の設定

ブックマークしました

ここにツイート内容が記載されます https://b.hatena.ne.jp/URLはspanで囲んでください

Twitterで共有

ONにすると、次回以降このダイアログを飛ばしてTwitterに遷移します

239users がブックマーク コメント 18

ガイドラインをご確認の上、良識あるコメントにご協力ください

0 / 0
入力したタグを追加

現在プライベートモードです 設定を変更する

おすすめタグタグについて

よく使うタグ

なぜReactは標準でComponentをmemo化しないのか?

239 users zenn.dev/taroro28

ガイドラインをご確認の上、良識あるコメントにご協力ください

0 / 0
入力したタグを追加

現在プライベートモードです 設定を変更する

おすすめタグタグについて

よく使うタグ

はてなブックマーク

はてなブックマークで
関心をシェアしよう

みんなの興味と感想が集まることで
新しい発見や、深堀りがもっと楽しく

ユーザー登録

アカウントをお持ちの方はログインページ

記事へのコメント18

  • 注目コメント
  • 新着コメント
hylom
メモ化はメモリやストレージを消費することで動作速度改善を図る手法なので有効に働くかどうかはケースバイケース

その他
atico
メモリも倍以上使うので、必要な時以外使わない。パフォーマンスに問題があるパターンはスクロールイベントをdebounceしてなかったり、無限スクロールを表示箇所以外もレンダリングしたりとmemo関係ないことも多い。

その他
programmablekinoko
愚直にvDOMのレンダーをして、最適化したいならオプションのAPIでどうぞって、王道だと思う。これを守らないと関数型プログラミングの前提が色々崩れると思う

その他
kako-jun
useStateやuseMemoでの比較はshallowで、しかも意外とコストが高いのね。ということは、人間から見て分かりやすい順番でなく、より変化しやすい変数ほど左に書いたほうが、比較回数が減って速いのかな?

その他
aktkro
なるー

その他
twotiger
React.memoは効果ないどころかパフォーマンスが悪化することもあるので、デフォルトでは無効になってる

その他
onesplat
良い記事だけどもRecordやTuppleが導入されてもO(1)になるわけではないだろ。js/tsの見た目上はループが消えたように見えるだけで、内部では結局どこかでmemcmp相当のことをしているわけで。差が小さくはなるかもしれんけど

その他
yarumato
"疑問を解消するために調査した内容をまとめた。途中でrenderのタイミング、memo化で再renderが抑えられる理由などの前提知識の復習も含めていて、memo化の勉強にもなると思う。memo化は性能低下になりうる"

その他
snowcrush
めっちゃ良い記事

その他
yo_waka
propsのshallowチェックのコストとrenderコストを比較して使ってねってことなんですね

その他
Keisuke69
確かにしょっちゅう書くのだるいなと思う。ソースコード的にも

その他
efcl
React Componentのメモ化を自動化してもそこまでパフォーマンスが良くならないケースがあることについて

その他
kjkj_ongr
とりあえずmemo化、と思ってしまうケースが多かったが、比較処理をするため逆にレンダリングにかかる時間が増えるケースがあるのは意識できていなかった

その他
saken
re

その他
fuyu77

その他
mon_sat
Svelte や Vue.js のように Computed Property でキャッシュし Component 自体は必要なときだけ再レンダリングするほうが好き

その他
carolina04
親Componentの再renderによってpropsの変更がある時だけ再renderして欲しいComponent ⭕ memo化した方が良い 親Componentの再renderによってpropsに変更がない時でも再renderして欲しいComponent ❌ memo化しちゃだめ

その他
hylom
hylom メモ化はメモリやストレージを消費することで動作速度改善を図る手法なので有効に働くかどうかはケースバイケース

2022年05月23日 リンク

その他
umai_bow
めちゃ参考になった

その他
atico
atico メモリも倍以上使うので、必要な時以外使わない。パフォーマンスに問題があるパターンはスクロールイベントをdebounceしてなかったり、無限スクロールを表示箇所以外もレンダリングしたりとmemo関係ないことも多い。

2022年05月23日 リンク

その他
fukken
たったひとつのStoreからstateを持ってきてた時代の設計判断、という気がする。

その他
programmablekinoko
programmablekinoko 愚直にvDOMのレンダーをして、最適化したいならオプションのAPIでどうぞって、王道だと思う。これを守らないと関数型プログラミングの前提が色々崩れると思う

2022年05月23日 リンク

その他
kako-jun
kako-jun useStateやuseMemoでの比較はshallowで、しかも意外とコストが高いのね。ということは、人間から見て分かりやすい順番でなく、より変化しやすい変数ほど左に書いたほうが、比較回数が減って速いのかな?

2022年05月23日 リンク

その他

注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

リンクを埋め込む

以下のコードをコピーしてサイトに埋め込むことができます

プレビュー
アプリのスクリーンショット
いまの話題をアプリでチェック!
  • バナー広告なし
  • ミュート機能あり
  • ダークモード搭載
アプリをダウンロード

関連記事

usersに達しました!

さんが1番目にブックマークした記事「なぜReactは標準で...」が注目されています。

気持ちをシェアしよう

ツイートする

なぜReactは標準でComponentをmemo化しないのか?

はじめに 普段はスタートアップでBtoB SaaSの開発をしているtaroと申します。 今回は、Reactのmemo化に... はじめに 普段はスタートアップでBtoB SaaSの開発をしているtaroと申します。 今回は、Reactのmemo化について考えている中で抱いた 「なんでReactは標準でComponentをmemo化していないんだろう?」 という疑問を解消するために、色々と調べたり考えたりした内容をまとめました! 途中でrenderのタイミングや、memo化で再renderが抑えられる理由などの前提知識の復習も含めていて、memo化について詳しくない方もmemo化の勉強にもなると思うので、ぜひぜひ読んでみてくださいー! なぜこんな疑問を抱いたのか? まずはそもそも僕がタイトルにあるような疑問を抱いた背景です。 疑問を抱くまでの思考プロセスはこんな感じです。 「再renderが余分に走ってて画面が重いから最適化したいなー」 →「React.memo()を使ってComponentをmemo化しよう!」 →

ブックマークしたユーザー

  • techtech05212023年08月30日 techtech0521
  • sawapi2023年06月19日 sawapi
  • ikosin2023年06月19日 ikosin
  • jsoizo2023年06月18日 jsoizo
  • klim08242023年06月18日 klim0824
  • ggkuron2023年06月18日 ggkuron
  • todays_mitsui2023年06月18日 todays_mitsui
  • kazre2023年06月17日 kazre
  • s-hiraoku2023年03月29日 s-hiraoku
  • s_hiraiku2023年03月29日 s_hiraiku
  • mollifier2022年11月29日 mollifier
  • maasayan2022年11月04日 maasayan
  • ringo61192022年11月04日 ringo6119
  • ivgtr2022年10月17日 ivgtr
  • aktkro2022年10月07日 aktkro
  • twotiger2022年10月06日 twotiger
  • mztns2022年10月06日 mztns
  • kazokmr2022年10月06日 kazokmr
すべてのユーザーの
詳細を表示します

ブックマークしたすべてのユーザー

同じサイトの新着

同じサイトの新着をもっと読む

いま人気の記事

いま人気の記事をもっと読む

いま人気の記事 - テクノロジー

いま人気の記事 - テクノロジーをもっと読む

新着記事 - テクノロジー

新着記事 - テクノロジーをもっと読む

同時期にブックマークされた記事

いま人気の記事 - 企業メディア

企業メディアをもっと読む

はてなブックマーク

公式Twitter

はてなのサービス

Copyright © 2005-2025 Hatena. All Rights Reserved.
設定を変更しましたx

AltStyle によって変換されたページ (->オリジナル) /