Hacker News new | past | comments | ask | show | jobs | submit login

The article wasn't "To handle simple modals, try a state machine." It was "To handle things with a lot of complicated changing state, try a state machine, and here's a simple example."

When you have state explosion, it gets complicated really fast as they get bigger. State machines help you manage that by telling you when you've missed something. They scale in a way that a bunch of hooks doesn't.




> It was "To handle things with a lot of complicated changing state, try a state machine, and here's a simple example."

Right you are.

We should also acknowledge that state machines are a fundamental tool of GUI development. Either you use them, or you use them even though you're oblivious to them. There is no way around them.

Some GUI frameworks like Qt even develop and support their own state machine framework to drive their UIs.

https://doc.qt.io/qt-5/statemachine-api.html

I mean, what do UI design people think a UI flow diagram is supposed to be?

Of all things to complain about React, state machines aren't one of them.


Except state machines aren't that good at handling complexity. This generally boils down to:

- The number of possible transitions scales quadratically with the number of nodes

- They're not very composable

Plus, there are many things that compile down to state machines, such as Regex or async/await, because they're a pain to write directly.


State machines do compose, but usually in a message passing environment. That might be a message passing programming environment like Erlang, or it might be a message passing system such as a protocol stack. Every layer in your stack be it bluetooth, IP, or whatever is a state machine communicating with messages to the layers above and below (whether or not it is written using an explicit state machine, most protocol layers implicitly are a state machine).

The number of possible transitions thing isn't really an issue. For embedded applications I usually use a (home grown) Python tool that generates C code from a CSV file. The CSV file is 4 columns - start state, event, end state, action function (optional). That list of transitions can get to hundreds of lines, but grouped by starting state it is fairly easy to manage and understand - e.g. you're looking at the list of things that can happen when the device is 'CHARGING' (such as charger disconnect, power on).


That's why statecharts exist.


Yeah, I think I over-reacted to the introductory line of 'Ever needed to wire up a confirmation dialog in React?' which colored my reading of the article.

The author explained that it's just a hook to introduce the concept of state machines, but this kind of complexity seems to be cheered on, and you'll easily find code like this, or worse, in production apps.


State machine via dialogs sounds like a UX anti-pattern.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: