• I use Next js with App router.
• My app looks like this:
  enter image description here
• My navigation bar with tabs stays in the main layout:
  enter image description here
• Each tab represents a different route and different page:
  enter image description here

PROBLEM: when I e.g. type something in the Users page and then switch a tab and return to my Users tab – Users components re-render. I need it to not change during switching tabs. Later on, there could be many tabs opened and I don’t want to re-render them each time a tab is changing – each route page could be very complex inside and I can’t imagine storing every user movement in e.g. Redux and recreating the whole page every time user switch the tab…
Could you please help me with it?

I tried to wrap the Users component with React.memo() but it does not work..

I expect not re-render components when switching tabs