Re:The World of Statecharts
by aphextron on Monday December 23, 2019 @06:07PM
(#21868298)
I can't overstate what a gamechanger state based development using XState + React with hooks has been for me versus a standard Redux/Flow architecture with class based components. It allows you to extract business logic from your components to the point that React becomes nothing more than a view rendering layer. This makes it way easier to understand the flow of your application and simply read through the statechart and look at the corresponding components for each state. No more parsing through giant component class files, dealing with lifecycles, or mixing logic with presentation. It allows you to build a fully deterministic UI where bugs become almost impossible to happen.
[ Parent
| on HN ]
Re:The World of Statecharts
by davidkpiano on Monday December 23, 2019 @06:36PM
(#21868491)
That's awesome to hear! (Author of XState here)
For those curious: XState is a JavaScript state machine/statechart library that doesn't invent any new concepts and instead adheres strictly to statechart principles and the SCXML spec.
Yes!
Extremely same, but with Vue instead of React. In the last project I worked on, XState was a late addition, so it didn't control the whole application, but the part I wrote in it was bug free from the start.
My plan for any future JS/frontend project is to design the whole application's business logic around XState, and use Vue/React/Svelte/Whatever just for the rendering part.
Re:The World of Statecharts
by james_s_tayler on Tuesday December 24, 2019 @12:09AM
(#21870031)
This sounds very interesting! Do you have a link to a repo or tutorial / good reference example?
No, sorry. This was contract work, and is closed source.
Re:The World of Statecharts
by james_s_tayler on Wednesday December 25, 2019 @08:08AM
(#21878352)
That's ok. Anything publicly available you used as reference materials? I had a read through that site, but id love to see what's considered a good example in code.
From memory, one of the things we did was set up an event bus to communicate between xstate and Vuex. We only used the xstate.org.js and vuejs.org documentation, which are both very good.
Sorry I can't help further.
Re:The World of Statecharts
by HerrBertling on Tuesday December 24, 2019 @06:59AM
(#21871423)
Oh, that would be awesome! I’m very interested as well :)
Re:The World of Statecharts
by spiffytech on Monday December 23, 2019 @07:21PM
(#21868775)
How have you managed keeping your machine's state and context consistent? Although I can control transitions easily, I've found it's easy to miss updating parts of my machine's internal context when wiring up transitions. I wind up with my component thinking it's in a particular State, with a context that doesn't match up.
Isn’t that the job of actions after an transition happened? (modifying the internal context according to the event).
Re:The World of Statecharts
by spiffytech on Monday December 23, 2019 @07:28PM
(#21868831)
It is indeed. However, I've found the problem of writing assignment actions correctly is very similar to the problem of managing ordinary variables without xstate. I'm wondering if I'm doing this right, since I thought xstate was supposed to make that kind of bug much rarer.
Re:The World of Statecharts
by beardedman on Tuesday December 24, 2019 @07:40AM
(#21871623)
Would love a real world example of this.
Building a smaller application is fine - but what does XState look like in an enterprise level context?