Stateful vs. Stateless components

[XVincentX]

No description provided.

[Baggz]

Ah, true, @XVincentX, good point!

[XVincentX]

So, I am not expert yet in the React, but I will, anyway, kickoff the discussion.

Since state increases complexity and reduces predictability, a Component without state is preferable. Even though you clearly can't do without state in an interactive app, you should avoid having too many Stateful Components.

But of course, we cannot create applications without states, so they must live somewhere.

I think a good way to identify a component that should have a state is when it is the only one listening to an event.

I'll make an example from the current code.

As you can see, Playground and RefractPreview are listening to the same event.

In this case, I would just let Playground component listen to the event, and then propagate that to the subcomponents that will re render themselves.

What do you think about?

This commit goes in that direction, by the way.

[Baggz]

Tracking as https://github.com/apiaryio/kit-template/issues/4 in the kit-template repository.