Consider a lightweight web framework to help with the JS side of the templates

[Brookke]

Rational:

Theres a lot of stuff that is hidden away in JS files that is not obvious. It’s pretty fragile, for example if someone changes the current and next box and forgets to update the JS it’s likely going to break.

There are a few JS issues that will likely benefit from this along with the existing JS code. #126 #218 #216

Benefits

• No more repeated template in the JS files.
• Less hand written JS selector queries.
• Easier to work out when there is some sort of JS interaction or binding in the template.

The selected library should fail gracefully when JS is disabled. By fail gracefully I mean for example that the Current and Next box will still render the static version and just not update if JS is disabled.

Two options to consider that are super light weight: https://github.com/alpinejs/alpine https://stimulusjs.org/

[markspolakovs]

Preact is even lighter ;-) but that wouldn't work without JS (unless we server-render it, but that would involve a Node backend, which is ehhhhhh)

[Brookke]

Yeah preact doesn't seem suitable. Not sure it solves all of the problems listed either, without a complete rewrite of the app, which doesn't seem sensible since the site is mostly static in the first place. We want something simple that complements our existing templates I think.

[markspolakovs]

I'm comparing the two you linked, and right now I'm leaning more towards Alpine, just because Stimulus looks a bit too "Angular 1.x", for lack of a better word, for my liking.

As an aside, this is the time that I really wish we had something like Matomo, so I could see what browsers people use - just so I know whether we still need to support IE11 or if we can forget about it. (I think the latter though, Edge has been around for long enough.)