Static Sites Are Good

Gone are the days when you had to wait for quite a long time to fetch a server rendered HTML page. Single page applications (SPA) try to solve this problem by handling the HTML rendering entirely with client-side javascript. But, too much of anything is harmful.

It's true that javascript is meant to manipulate the DOM programmatically, however if you send too much of it to the client, it takes a hit on performance. And, we are back to where it all started. SPAs were meant to improve performance (and they do up to a certain extent) but, their current implementation does the opposite.

Not only that, SPAs are no good for accessibility and SEO as well. This doesn't mean you can't implement accessibility in SPAs, its just that it's hard — considering the fact that the HTML content is dynamically altered using javascript. For SEO, search engine crawlers can't find the rendered HTML content without executing javascript and that's not good.

This leads to a couple of questions:

• How do you find a balance between HTML and Javascript?
• Are SPAs bad for everything?
• What strategy can improve the performance while still using some javascript?

Static First Approach

The idea is simple — you build your "staticky" content (which is not meant to be interactive) at build time, host it somewhere on the cloud and then serve that as an HTML page to the client. Parts which do need some interactivity can be progressively enhanced using javascript.

Progressive enhancement is a concept where you send a minimum viable experience (wonderful analogy by Andy Bell) to the client which works even without javascript. And once javascript is available, you enhance the experience.

For example, for a blog, you can build the static content and components such as headers and footers at build time and then use some javascript (if you need to) for enhancing the button click of a newsletter CTA.

I discussed the simplicity of static sites, Jamstack, it's future and it's meaning with Mike Neumegen on #thefutureofjamstack. We also talked about what should be the new name for Jamstack and it was fun. Catch the full talk here.

SPAs Are Not Bad For Everything

There are certain use cases where you need a lot of interactivity and state management, for example a video calling app or an enterprise web application involving a lot of complex components which talk to each other.

However, in this case also, you should go for a hybrid approach where you server render as much as you can (using server side rendering) and leave the rest for javascript.

The Best Strategy

Honestly, there is no universal best strategy. It all depends on your use case and what you are trying to build. Finding the right approach is the first thing you should do when building a project.

Conclusion

For the most part, static-first sites are the go to thing if your application doesn't involve much complexity. However, you are free to choose the right tool for your application — but choose wisely.