3 ms·
The main benefit of Elm and Redux is the simplicity of their core abstraction: that your app is just a reducing function over a stream of events from the outsid
by danneu 11y ago
The main benefit of Elm and Redux is the simplicity of their core abstraction: that your app is just a reducing function over a stream of events from the outside world including game ticks, mouse clicks, <input> field changes, etc.
For example, a counter that increments per click:
initApp = { counter: 0 };
stepApp = (action, oldApp) => oldApp.counter + 1;
viewApp = (app) => `<p>Clicks so far: ${app.counter}</p>`;
currentApp = reduce(stepApp, initApp, mouseClicks);
currentHtml = map(viewApp, currentApp);
This makes it really easy to inspect, test, and reason about what's actually happening and why since every change to your app had to be caused by an event that triggered a step from oldApp to newApp. Redux and I think Elm come with a debugger that even prints out `{action}, {oldState}, {newState}`. Makes it really easy to get a reading on things.
Though it's possibly hard to appreciate this until you've battled it out in the trenches with an abstraction that isn't so simple, especially on a large, complex app.
I personally found Redux (w/ React) immediately accessible and think it's a good place to start, especially if you're already coming from React or you want to reap the benefits without leaving Javascript. I'd feel really comfortable using Redux on any team project that was already using React and some other Flux'y implementation.
I've also been learning Elm this past week though it's taking me far longer to become productive since there are fewer resources and I have no ML experience. I've managed to create a simple Spreeder.com-style speed-reader (https://www.danneu.com/elm-speed-reader/ https://www.danneu.com/elm-speed-reader/), and if you look at the source code (https://github.com/danneu/elm-speed-reader/blob/master/Machine.elm#L70 https://github.com/danneu/elm-speed-reader/blob/master/Machi...), you can see that it's not much different from the counter-app example I pitched above where the `update` function reduces across a stream of actions including button clicks and the tick. (Disclaimer: I'm an Elm noob)
- alphanumeric0 11y agoI agree, this is one of Elm's main draws. PureScript has a library for this style of FRP (https://github.com/bodil/purescript-signal https://github.com/bodil/purescript-signal). From the documentation, Elm signals are like a process network (https://en.wikipedia.org/wiki/Kahn_process_networks https://en.wikipedia.org/wiki/Kahn_process_networks). In my experience I've been able to model any conceivable interactions with a website using this model.