|
|
|
|
|
by nailer
3095 days ago
|
|
> Stimulus also differs on the question of state. Most frameworks have ways of maintaining state within JavaScript objects, and then render HTML based on that state. Stimulus is the exact opposite. State is stored in the HTML, so that controllers can be discarded between page changes, but still reinitialize as they were when the cached HTML appears again. It really is a remarkably different paradigm. One that I’m sure many veteran JavaScript developers who’ve been used to work with contemporary frameworks will scoff at. And hey, scoff away. If you’re happy with the complexity and effort it takes to maintain an application within the maelstrom of, say, React + Redux, then Turbolinks + Stimulus will not appeal to you. The complexity of React + Redux is completely orthogonal to having a virtual DOM. Ractive, vue, and the like are similarly easy as Stimulus. Making state management easier is a matter of having simpler APIs, not moving state into HTML. Quick Ractive version (at work so just ad-libbing): new Ractive({
el: '.greeter-ui',
template: `
<div>
<input value="{{ name }}>
<button class="greet">Greet</button>
</div>
`,
data: {
name: 'Alex'
},
oncomplete: function(){
var Greeter = this;
var greetButton = document.querySelector('button.greet')
document.addEventListener(greetButton, 'click', function(event){
var name = Greeter.get('name')
console.log(name)
event.preventDefault();
})
}
})
|
|
This might be a subjective matter of taste, but I find the React solution much uglier, harder to read, and less intuitive despite the fact that I've been writing React for a while now, and have never written Stimulus.
Here's my guess on why: React syntax has to be able to simultaneously account for JS syntax, HTML syntax, and its own API - all within one syntax that can't be optimized for any one of those use cases. Stimulus allows (forces?) you to leverage more focused HTML syntax where applicable, and javascript syntax where applicable while also letting you leverage your preferred flavors as you see fit (say HAML and CoffeeScript).