Difference between 'data' and 'state' in Frontend
After using React for months, I have to say it is very different between 'data' and 'state'. However at the first glance, they are the same thing. Now let's talk about this topic.
DATA is a stable structured source type. 'stable' means it will now change unless you request a new data to cover the variable. 'structured' means it is not compatible in different system.
STATE is a fluxible/changeable temporary source type. 'changeable' means it can be changed by current code scope. 'temporary' means when current scope is destroyed it should be destroyed too.
However, we always make a reference from a state to a data. This make the relationship complex.
I think there are several rules for developers to keep in mind:
- you should not use state to change its refer data, a data which is referred by a state should only be used for response (render, calculation..), no change
- data should be managed in a redux store like manager tool, if you want to request new data, you should dispatch a action to the store and let the store notify the application, and the application subscribe a listener in which can get the new data
- change a state means change the view, visual view is based on state, one state, one view, never make it unexpected when using state.
This is what I thought about data and state.