Docs: Clarify useEffect non-primitive dependency pitfall

[SaifUrRehman2k]

Docs: Clarify useEffect() non-primitive dependency pitfall

Closes: #8156

Description:

This PR addresses issue #8156 by clarifying the behavior of the useEffect() dependency array when non-primitive values (objects or arrays) are used.

Problem:

The existing documentation doesn't explicitly warn developers about the common pitfall where non-primitive dependencies, which create a new reference on every render, can cause the effect to run on every render (or cause infinite loops)

Solution:

Added a section Behavior of useEffect() with non-primitive dependencies, which includes:

• An explanation of why objects/arrays cause dependency changes on each render.
• Examples demonstrating the issue
• Recommended solutions, such as using useMemo() or defining constant values outside the component

[github-actions[bot]]

Size changes

📦 Next.js Bundle Analysis for react-dev

This analysis was generated by the Next.js Bundle Analysis action. 🤖

This PR introduced no changes to the JavaScript bundle! 🙌