i have used memo to not rerender the RenderButtons component but is there any way in react to fully stop rerender and like avoid the extra computational computation for memo and entirely avoid use of memo or useMemo or it is the very nature if recoil library ?
import { memo } from 'react';
import { RecoilRoot, atom, useRecoilState, useRecoilValue } from 'recoil';
const countAtom = atom({
key: 'countState',
default: 0,
});
function App() {
return (
<RecoilRoot>
<div>
<RenderCount />
<RenderButtons />
</div>
</RecoilRoot>
);
}
function RenderCount() {
const count = useRecoilValue(countAtom);
return <h1>{count}</h1>;
}
const RenderButtons = memo(() => {
const [count, setCount] = useRecoilState(countAtom);
return (
<div>
<button onClick={() => setCount(count + 1)}>Add + 1</button>
<button onClick={() => setCount(count - 1)}>Subtract - 1</button>
</div>
);
});
export default App;