Recommended practices

Following React best practices

Refer to the official React documentation for guidance on React fundamentals. Following React best practices keeps your code performant and bug-free, and makes future updates easier.

Common issues

Flickering UI and useEffect

If you're experiencing flickering or visual issues with components, you might not need useEffect. See You Might Not Need an Effect for alternative solutions.

Keep in mind that effects have specific behavior:

• Effects only run on the client, not during server rendering
• React typically lets the browser paint the updated screen before running your effect
• If your effect handles something visual (like positioning a tooltip) and creates noticeable flickering, use useLayoutEffect instead

For more information, see the useLayoutEffect documentation.

Flexibility

Primer React is designed to be flexible while maintaining consistency. If you need to implement something outside these recommendations, open an issue and we'll help find the best approach.