StimPine Comparison and SLICE/PLUCK/FLICK
Hey friends,
Just a PSA now that the weather's nice: if you work outside you should PROBABLY put on sunscreen.
(Don't be like me and get burned!) 😅🌞🧴
Thinking Too Hard
This week I spent some time last week evaluating Alpine JS as a potential replacement for the standard JS controller library we use at Viget: Stimulus
There's similar in that:
- Both are activated and controlled via HTML attributes.
- Both allow binding of actions and events via HTML attributes.
- Both give some minimal lifecycle events and DOM selection helpers.
- Both attempt to keep things nice and minimal.
But then they start to diverge in their expectations:
- Stimulus is async lazy-loaded by default, Alpine expects everything registered up front.
- Stimulus expects you to write an external controller for every component, Alpine expects you to write (most) everything IN your component HTML markup.
My basic overall impression is that Stimulus keeps things in the vanilla JS 'feel' but with some weird naming magic helpers, where Alpine has a more Vue-inspired minimal aesthetic. I've found Alpine harder to extend, but you get a LOT for free and you wind up having to write less code.
Both are great libraries, but as I've written before, the DOM-scoping features of Alpine make it especially attractive for component-driven development. I'll keep kicking the tires on this one...
Interesting Web Bits
- This game was fiendishly hard as a young kid, the Digital Antiquarian writes about Riven
- Inspiration: Scale. Check out these floating canvas mirror animations (one of my coworkers identified it using Spline 🤔)
- I love the amount of thought and work spent towards a problem that I don't experience... at all... the peanut butter spinner. (I'll never need it, but I can still appreciate it.)
- For those times you just need to SLICE!
- And the other times you need to PLUCK!
- And finally when you need to FLICK