Tired of developing Single Page Applications

General Prog (Archived)
,
1

I developed projects using a JSON API back end and Single Page Applications in Angular 1 and Ember.

I concluded that it is too much work, and that it is an over-engineered solution. I am tired of SPAs so I have plans to use the minimum required Javascript in my next project.

Any thoughts about this?

What are you doing in your projects?

6 Likes
2

As a small disclaimer, I have never put an SPA into production. Only built small toys to learn about it.

I think it depends on the project. I truly believe that some applications can only be built using SPAs (at least if you want good UX). As an example of this, any web based music player (Spotify, Google Music, etc). When I move around the site, I want my music to play continually. However, I think most applications do not have a hard requirement to use an SPA.

I think it can be a decent idea if you have mobile or a desktop app in addition to your web app. It means just building out the API instead of an API and a traditional server rendered application.

With that said, I think that the majority of applications do not need to start with an SPA.

1 Like
3

HERE HERE!
+10000

This is why I hope for great success for liveview

1 Like
4

I’ve never built a SPA since all the ones I’ve used have had weird behaviours that annoyed me, typically around navigation but also stuff like loading a site and watching a loading icon for a minute while all the JS runs and downloads and builds content. I do use react quite a bit but I use it as components on pages not as the full application and it works well for me.

2 Likes
5

Assuming a medium to big size project I’d use either React.js or Vue.js, both are easy to learn and scale well if you want to add a router, state management, etc… If it’s a small or dummy project, then JavaScript (or whatever other language you use) by itself is good enough.

Another option that I like so much is Gatsby. It works almost like an SPA, but it’s easy enough to understand how it works if you have used React.js before, and it can be extended using existing plugins (or just by writing your own).

6

I’ve wasted much time developing SPA solutions for my side projects. I stopped a couple of years ago after using Backbone, Marionette, Angular, Spine.js, Sproutcore 1 & 2 (which later became Ember), React, Mithril, Vue and probably many more I’ve forgotten.

For a single person project/product I don’t see how the benefits outweigh the drawbacks. It becomes too complicated to maintain and add new features.

So for the past couple of years, I’ve focused on a small set of technologies on the front end. Nowadays I use Turbolinks, Stimulus and vanilla JS. For more advanced UIs I add (good old) knockout.js to the mix. However, it is rare.

4 Likes
7

I’ve built some SPA applications with Vue/React (+React-Native for mobile) in the past. There were/are lots of stumbling blocks along the way and things are moving/changing very fast. Eventually you get used to the patterns and things do get easier if you make it to that point without losing all interest.

The whole experience made me interested in taking a look at Elm/ReasonML/PureScript, to see how the story differs on that side. Never got to that point though, as I’m quite happy with the current tools I use.

Take a look at StimulusJS + Turbolinks combo. They complement each other so well. I wasn’t very convinced at first by Stimulus, it didn’t seem powerful enough, but it proved to be more than enough for my needs.

The theme I’m currently using in a project came with a lot of BootstrapJS/JQuery/own Javascript functionality in a completely chaotic architecture (loading everything on each page…if you’ve bought a Themeforest theme you know what I’m talking about) and I’ve completely replaced that with just Stimulus, thus I was able to drop completely bootstrap.js, jquery dependencies, which resulted in performance improvements + a more sane architecture and code organization. Go a bit further and optimize Webpack with a few entry points for your JS, and you get just the minimal JS footprint on each route. Performance-wise this setup is hard to beat.

Other options: Unpoly (glad that they’re working on dropping JQuery as a dependency), IntercoolerJS, Drab (Elixir-based).

Very excited about LiveView from the teasers showcased so far.

3 Likes
8

Backend rendering with Elixir and good ol’ jquery, bootstrap, and postgresql.

3 Likes