I've long ago abandoned spaghetti mega-scripts and SPAs in favor of targeted JS libraries that extend HTML capabilities. They're not web components, they don't require some framework to manage, and my HTML works fine without them, but if I load the library and add certain attributes or tags to my markup, I get extra capabilities. The libraries don't require crazy tooling to manage, don't have extensive dependencies and so they facilitate steady incremental development.
I'm very happy with this approach and I'm reusing code I've written years ago for completely different projects.
Do you mean libraries like Turbolinks[1] and/or Intercooler[2] here? I'm interested in what libraries you use, and others like these which help "bridge the gap" between traditional and single-page sites.
[1] https://github.com/turbolinks/turbolinks [2] https://intercoolerjs.org/
[1] https://unpoly.com/ [2] https://www.morling.dev/blog/quarkus-qute-test-ride/
I'm a fan of these kinds of solutions. For my 100% static website, https://instant.page does make it feel instant. TurboLinks feels a little "heavier" and has a more complex interaction with other frontend code, but it works very well.
https://github.com/derbyjs/derby
https://github.com/derbyjs/racer
IIRC there were some old packages but these were unmaintained and didn't work with later versions of Turbolinks, so I ended up looking at Rails source and other examples. Basically making sure to handle redirects and headers correctly. You can see the webpack config in the same project, pretty much just standard setup with some tweaks for loading Stimulus controllers.
Sounds like jQuery plugins.
Seriously though, I wish for a similar thing without the baggage. Maybe there needs to be a common interface defined for such "just add water" libraries.
Are you thinking something like ShareDB? https://github.com/share/sharedb
As a person who is browsing the web, I do want server rendered pages, correct history of navigation, urls to match pages, a lack of refreshes, live collaboration with other users. What I dont want is a manual refresh to lose anything or bring me to a different page. And I want the site to work, and progressively fail if I have javascript off.
Most interactivity can still be server side. Look at google.com, as you type in a search query, and they return a static update with results matching what youve typed so far.
Ah - I didn't have anything quite that powerful in mind, more like fairly simple, browser-local enhancements to make interacting with regular old HTML pages more pleasant. For example a drop-in library that would save the state of a form and restore it on a refresh, like the old formsaver jQuery plugin. I would like to see an ecosystem of libraries like that again
Rich seems to be advocating for a JS middle-ground here, which I think is a great direction to go in for this kind of workflow.
Not everything is an app, and frankly I think we build a lot of non-apps as if they are apps because we enjoy the feeling that we've engineered something.
I'd like "web programming" to start with Vannevar Bush's As We May Think, then go to Licklider, Ted Nelson, then hypercard programming (hypertalk). Set up a BBS, a gopher site and then write HTML for NCSA Mosaic.
Read the RFCs and W3C standards, learn about Netscape's SSJS failure before touching nodejs, you know, serious academic scholarship. Maybe look at the failed TCL browser support, which has example snippets in the HTML 4 standard, understand why it didn't work, etc.
I think we'd get dramatically better results
SPAs are newer, so they must be better, right? /s
This is similar to other articles I've seen that draw a distinction between two choices: zero javascript vs full SPA. I think this is a false dichotomoy because most features advertised for SPAs (analytics, data/content preloading, transitions, optimized page loading) can be implemented for static sites as well. It would be nice to see frameworks that were more modular and interoperable because this would allow/give engineers the choice to decide which parts they want to be static and which parts they want to be dynamic.
I'm not sure if I agree with what you're saying though because you haven't provided examples of how the features of SPAs can be accomplished without JavaScript. Do you have references and examples?
Sure, you can do this with AJAX, but so far there are no SSR + component-level hydration + AJAX frameworks that solve this out of the box.
Facebook is working on something similar though as Dan Abramov has hinted at on Twitter.
But if you have any amount of interactivity (forms, widgets, etc) SSR makes total sense. Specially with component-level hydration which means the duplication of content would be lower than traditional SSR. AFAIK Marko is the only framework that has this feature.
See this article for more info on this topic:
https://medium.com/@mlrawlings/maybe-you-dont-need-that-spa-...
I think it's a shame that frontend web developers have thrown themselves behind the SPA paradigm so hard that the notion of a JavaScript ecosystem that doesn't try to do pull _everything_ into its own domain is unimaginable. I'd love to see more mindshare go towards building libraries that are drop-in/"just add water" progressive enhancements for static sites.
[edit: minor grammar correction]