Memoize Context

πŸ§β€β™‚οΈ I've taken the name and color state and combined them into a single FooterContext as well as extracted some of the UI into a FooterSetters component (for all the stuff that allows you to control the Footer). Feel free to check my work to inspect the changes if you want.
πŸ‘¨β€πŸ’Ό Great, now if you pull up the React DevTools, you'll notice all the components rerender whenever you change the counter in the App component. This is happening because the FooterContext is a new value prop every render.
So if you memoize the value prop with useMemo, you can prevent the unnecessary rerender of consuming components when the value prop doesn't change.

No tests here. Sorry.