The Journey of #100DaysOfCode (@Ayman_Dandan)

๐ƒ๐š๐ฒ ๐Ÿ—๐Ÿ• of #100DaysOfCode

  • ๐‘ท๐’†๐’“๐’‡๐’๐’“๐’Ž๐’‚๐’๐’„๐’† ๐‘ถ๐’‘๐’•๐’Š๐’Ž๐’Š๐’›๐’‚๐’•๐’Š๐’๐’ ๐’˜๐’Š๐’•๐’‰ ๐‘น๐’†๐’‚๐’„๐’•.๐’Ž๐’†๐’Ž๐’ ๐’‚๐’๐’… ๐’–๐’”๐’†๐‘ด๐’†๐’Ž๐’ -
    ๐˜—๐˜ณ๐˜ฆ๐˜ท๐˜ฆ๐˜ฏ๐˜ต๐˜ช๐˜ฏ๐˜จ ๐˜œ๐˜ฏ๐˜ฏ๐˜ฆ๐˜ค๐˜ฆ๐˜ด๐˜ด๐˜ข๐˜ณ๐˜บ ๐˜™๐˜ฆ๐˜ฏ๐˜ฅ๐˜ฆ๐˜ณ๐˜ด ๐˜ช๐˜ฏ ๐˜™๐˜ฆ๐˜ข๐˜ค๐˜ต

React gives you two powerful tools for optimizing performance: ๐‘๐ž๐š๐œ๐ญ.๐ฆ๐ž๐ฆ๐จ and ๐ฎ๐ฌ๐ž๐Œ๐ž๐ฆ๐จ.

โ†’ ๐‘๐ž๐š๐œ๐ญ.๐ฆ๐ž๐ฆ๐จ: Prevents a component from re-rendering unless its props change.
โ†’ ๐ฎ๐ฌ๐ž๐Œ๐ž๐ฆ๐จ: Memoizes expensive computations, only re-calculating them when dependencies change.

โ†’ ๐–๐ก๐ž๐ง ๐ญ๐จ ๐”๐ฌ๐ž ๐ˆ๐ญ: Use ๐‘๐ž๐š๐œ๐ญ.๐ฆ๐ž๐ฆ๐จ for components that frequently re-render unnecessarily, and ๐ฎ๐ฌ๐ž๐Œ๐ž๐ฆ๐จ for expensive computations.
โ†’ ๐–๐ก๐ฒ ๐”๐ฌ๐ž ๐ˆ๐ญ: It helps improve performance, especially in apps with lots of complex components.
1728043409999

2 Likes