Prevent Unnecessary Rerenders of Compound Components using React Context
Due to the way that React Context Providers work, our current implementation re-renders all our compound component consumers with every render of the
<Toggle /> which could lead to unnecessary re-renders. Let's fix that by ensuring that the
value prop we pass to the
<ToggleContext.Provider /> is only changed when the state changes.