<p>'useMemo' is used in this situation.</p>
<p>Let's think about a situation.</p>
<hr />
<ol>
<li><p>There is Component A which have part A.</p>
</li>
<li><p>It takes a long time to render part A.</p>
</li>
<li><p>Component A will be rerendered, but part A will not change.</p>
</li>
</ol>
<hr />
<p>In this situation, if we can save previous part A somewhere and use only the result without calculating (This happens only if there is no change in part A), the rendering time will be shortened a lot.</p>
<p>Below is the example.</p>
<div class="embed-wrapper"><div class="embed-loading"><div class="loadingRow"></div><div class="loadingRow"></div></div><a class="embed-card" href="https://codesandbox.io/s/usememo-y39v8j">https://codesandbox.io/s/usememo-y39v8j</a></div>


'useMemo' is used in this situation.

Let's think about a situation.

---

1. There is Component A which have part A.

2. It takes a long time to render part A.

3. Component A will be rerendered, but part A will not change.

---

In this situation, if we can save previous part A somewhere and use only the result without calculating (This happens only if there is no change in part A), the rendering time will be shortened a lot.

Below is the example.

%[https://codesandbox.io/s/usememo-y39v8j]

examplist

examplist

(React) useMemo