【神回】ReactのuseMemo、この動画一本で完全に理解したわｗｗｗ【レンダリング最適化】

【神回】ReactのuseMemo、この動画一本で完全に理解したわｗｗｗ【レンダリング最適化】
https://www.youtube.com/watch?v=r6QXX6SuOq8

【動画の要約】
・useMemoは「値のキャッシュ」を行うためのHooks。
・重い計算結果をメモ化することで、不要な再計算を防いでパフォーマンス向上。
・第2引数の依存配列が変化した時だけ再計算される仕組み。
・「何でもかんでも使えばいい」わけじゃない、適切な使いどころも解説。

きたああああ！useMemo苦手だったから助かるわ！
06:00 あたりの解説が一番わかりやすかったわ。

冒頭 00:00 の導入からして丁寧さが伝わってくるな。
この人の解説、図解もあってマジでスッと入ってくるんだよな。

>>2
わかる。06:00 の具体的なコード例見ると、依存配列の意味がやっと繋がった感じするわ (ﾟ∀ﾟ)

02:50 くらいの「useMemoを記述する瞬間」のライブコーディング助かる。
エラー出しながら進めてくれるから、初心者がハマるポイントがよくわかるわｗ

「重い処理」をわざとループで再現してるの草。
でもあれがないとuseMemoのありがたみが分からんからな。

>>5
それな！02:50 のVSCodeの画面見て、自分も同じミスしてたことに気づいたわｗｗ

依存配列を空にしたらどうなるか、とか細かい検証もしてくれるの神すぎる。
明日から職場のクソ重Reactアプリに導入してくるわ 🏃💨

結局 06:00 が結論なんだよな。
「必要な時だけ計算する」っていう当たり前のことがHooksだと難しく感じる不思議。

これ見てから useCallback の動画も見ると更に理解深まりそう。
React学習中ならこのチャンネル登録必須だろ。

>>9
レンダリングの仕組みを知らないと、なぜuseMemoが必要か一生理解できないからなｗ
そこもセットで解説してくれてるのがマジで有能。

00:00 のこの清潔感あるデスク周りも憧れるわ。マイクいいやつ使ってそう。

>>12
デスクとかマイク気にする前にコード書けよｗｗｗ
でも 00:00 の導入の喋りも聞き取りやすくて集中できるのは確か。

02:50 のエラーが出た瞬間の「お、きたきた」感好きだわｗ
エンジニアあるあるを動画に盛り込んでくれるの親近感わく。

useMemoを使いこなせば、お前らも脱・初心者エンジニアやぞ！
俺はあと10回見て脳に刻み込んでくるわ ＼(^o^)／

結論：useMemoは値の貯金箱や！💰

>>16
例えが上手いのか下手なのか分からんけど、キャッシュ＝貯金ってのはあながち間違ってないなｗ

06:00 のピンクの囲み部分、あれが全ての答え。テストに出るぞー。

てかこの動画、無料で見れていいレベルじゃないだろ。Udemyで売れるわ。

>>19
本当それ。YouTubeでサクッと見れるから、分からなくなったら 02:50 辺りから見直すのを習慣にするわ。

React Hooks、全部このシリーズで解説してほしい。マジで助かる。

お前ら、分かった気になってるけど、実際に手を動かさないとすぐ忘れるからな！
06:00 のコードを今すぐ写経しろ！

>>22
うっ、耳が痛い……。今パソコン開いたわ。

00:00 から最後まで無駄な時間が一切ない構成、編集者に感謝だわ。

結局、最後は「使いすぎに注意」ってオチがあるのもプロっぽくていいな。

メモ化のコストと計算のコスト、その天秤をどう考えるかまで教えてくれるのは強い。

06:00 ループ教官「依存配列が変わるまで俺を動かそうとするなよ」

>>27
草。その擬人化分かりやすいわｗｗ

02:50 のタイピング音、地味にASMR感あって好きなんだけどｗ

このシリーズ全部見たらフロントエンド余裕で転職できそう。

>>30
夢見るのは勝手だが、まずは 06:00 の概念をマスターしろっての！

この動画見てuseMemo使いたすぎて、今適当な計算ロジック書いてるわ。

00:00 のアイコンからしてセンスあるよな。モダンなエンジニアって感じ。

>>32
それが一番の上達法だよ。 02:50 のミスをなぞるのも大事。

「値をメモ化するのがuseMemo、関数をメモ化するのがuseCallback」
この違いを 06:00 で意識させる構成、マジで神。

動画見終わった後のこの全能感ｗ

>>36
明日には忘れてる定期。だから 06:00 をブックマークしとけって！

プログラミングの解説動画って眠くなるの多いけど、これは最後まで見れたわ。

依存配列の中身をわざと変えて挙動を確認する 06:00 あたりの検証、教育的価値が高すぎる。

はい、全員高評価押して解散！ 00:00 の挨拶からやり直してこい！ｗ

引用元: 【React】useMemoの使い方｜値のキャッシュや使いどころなど丁寧に解説