I am working fetching data from a large json file with object inside object and so on. And the data is updated using an onclick function This is making tha site slow. So to make it fast I tried making a new useReducer and adding all the called objects in it, now i am stuck as I wanted to render the object present in this reducer from it and rest from the original state. But the original state is rendering every time onclick is called.

To make the condition, i used a conditional statement

!selected object 
? <Data value1={myState.value1} value2={value2} value3={value3} value3={value3} /> 
: <Data value1={myReducer.value1} value2={value2} value3={value3} value3={value3} /> 

And for iteration i have used nested Object.keys

And what else can be done to optimize it.