As we're already chugging along into the new year, it's the perfect time to take a look into what trends started gaining traction in web development in 2024. Reflecting on the whirlwind of updates from 2023, here's a rundown of some hot topics for the upcoming year.
Back to self-hosting
Self-hosting was the initial and default way for web developers and companies to host their applications for many years. Developers had to go deeper into inner workings of IIS, Nginx, or similar tools in order to host their web applications. Then came cloud services, swooping in to make deployment a walk in the park compared to the "do-it-yourself" approach. No more server maintenance nightmares, right?
Cheaper and more convenient cloud deployments meant that it was easier to learn and maintain your deployment somewhere else, as compared to the “standard” self-hosted solution. After all, you had to own a server, maintain it, update it, solve bugs, etc. At the same time, Docker became a thing and slowly but surely, the “it works on my computer, but not in production” started looking like a thing of the past.
However, it was not enough to replace the convenience of just shipping your application on some of the external providers. The convenience of of not being forced to learn too much about networking, administration, and handling VMs still wasn’t there. The rise of cheaper home servers, using Network Attached Storage (NAS) and their wide array of options, made it much easier to handle the self-hosting needs for lightweight use. We now have tools like Proxmox and Portainer, which make self-hosting your own Docker containers a breeze. We even saw DHH’s (who is a creator of Ruby on Rails, among other things) company moving completely to a self-hosting model, which prompted a big debate.
Back to server
In the world of React, there is a strong drive towards servers as the way of rendering apps. Spearheaded primarily through Next.js, React Server Components gained a lot of space in the public discourse, despite being very new tech. These tools are stirring the pot – some devs see them as groundbreaking, while others think they're simply reinventing the wheel. Regardless, the promise is faster page loads, less client-side code, and a smoother dev experience.
React Components enable execution and rendering of the React code exclusively on the server, which should bring benefits such as faster page loads, a lower amount of code shipped to the client, and better developer experience. One big DX advantage to it is safely accessing the database layer directly from the component itself, without the need for API.
HTMX is another library that gained popularity due to its server-first approach to rendering data, although seeking a much simpler way of appealing to developers.
Back to SPA
Hold up, isn’t this a bit of a contradiction? While server-side rendering is gaining steam, there’s also a solid camp refining the good ol' Single-Page Application (SPA) approach. The main reason for that is the feeling that we went so far in terms of experimenting with the server-first approach that we’ve forgotten that not all applications should be living on the server. Some could be highly dynamic, with loads of complex client-side validations, or you simply want to migrate your old Create-React-App architecture to Vite.
BTW, if you're wondering what the hell is a SPA and when should I use it over React Server Components, let me quickly explain. A single-page application (SPA) is a web application that loads only a single web document initially and then dynamically updates the content on that same page without the need to reload the entire page. SPAs interact with users by rewriting existing web pages instead of loading completely new pages from the server.
One of the examples of newer approaches to SPA is the Remix SPA mode. It uses Vite to create a setup that is basically React Router and Vite, with additional Remix-specific features, such as file-based routing and more.
Another example of a React framework utilizing Vite to give their users a SPA experience is Wasp - a full-stack framework for React & Node.js that drastically cuts the boilerplate. Despite being a full-stack framework, it focuses on the standardized approach of deploying a client-side React app with a Node.js server to be as portable as possible. With this approach, you can deploy your app pretty much anywhere, as well as self-host it, which is also a thing that we mentioned before in this article.
For the even faster start, it also features Open SaaS - a 100% free and open-source boilerplate starter for React & Node.js. Just clone it and get a working app with auth, billing, Open AI API, user dashboard and more!
Finding this article useful?
We're working hard at Wasp to create content like this, not to mention building a modern, open-source React/NodeJS framework.
The easiest way to show your support is just to star Wasp repo! 🐝 But it would be greatly appreciated if you could take a look at the repository (for contributions, or to simply test the product). Click on the button below to give Wasp a star and show your support!
Rise of low level languages
Leaving the world of JavaScript just for a bit, we find many examples of low-level languages making their way into the mainstream, especially when it comes to the tools for JavaScript. This is a trend that has already started during the last couple of years and should continue well into 2024 and beyond. When JavaScript ecosystem started to flourish, there were many great tools that were built with JavaScript, making it easier for developers to contribute to them and allow them to create their own plugins customize them to their liking.
One of the big reasons why we should be excited about this is the performance that those tools bring to developers when compared to JS-based tools. Tools like SWC (Speedy Web Compiler) and Turbopack (Vercel’s self-proclaimed successor to Webpack) are built in Rust. On the other side, Bun, which is an all-in-one JavaScript toolkit bult with Zig. It not only enables users to use it as their default JavaScript runtime, but also as a bundler, test runner, and Node.js-compatible package manager. What is great is that many new tools don’t remove the compatibility with pre-existing concepts, making it relatively easy to transition.
Conclusion
As with everything, we should take all predictions and potential trends with a grain of salt. It is easy to get carried away by the hype of new technologies and tools that are constantly being available today. If you read this article carefully, you might think to yourself “ok, where is AI here?”. I deliberately didn’t include any AI-based predictions to create awareness of other cool developments and trends in the industry that are overlooked.
What do you think of those trends? Are you noticing them as well? Or even better, doing some of this stuff yourself? Let us know in the comment section below and share your opinions!
Top comments (37)
You forgot to mention that 2024 is the year of signals.
Good catch! I hope that TC39 will be accepted and that signals will become a first-class feature of browsers.
Yea nice read it like it make it happen I would definitely give it a try
I already used the Singal app.
the r/selfhosted forum on Reddit is a goldmine for selfhosting tips!
Fun fact - even Angular has started adopting usage of Vite :D
Nice article highlighting some of the trending technologies these past few months - excited to see how things evolve over the next year!
Over my years of experience one of the things I noticed is that early adoption of trending technologies should always be minimised unless the use case very closely matches your end-goals or enables very quick low-risk wins.
One prime example I've seen recently of this on a project is a team who migrated from an Angular application onto React w/ NextJS and the infrastructure side of the Next side has reared its head with some headaches for configuration setup and dockerisation due to how propreitary some of the tech is tied with Vercels deployment pipelines.
Wasp seems an interesting product, and I can for sure see the Rails similarities at play, React, Node and Prisma all caught my eye over the last few years and Ive used them in different settings, very cool to see a product trying to establish a new paradigm with them linked together for easier development - will try it out in the near future!
I was thinking where is AI until I saw the conclusion 😄
interested
Rust is good for desktop apps, it has better access to hardware.
TauriJS is using rust at its back for this purpose.
Like these kinds of posts. Overviews are really nice to read and catch up quickly. Selfhosting is back and better than ever
Deserve more likes and comments :)
Thanks for this write up!
Great analysis!
Thanks for this!
Cool, nice article. Thanks for sharing!
Nice article
I learned a lot reading this, thank you 🙏
Uuu I'm excited for stuff like rolldown.rs/ (the Rust rewrite of Rollup and it should power the next-gen Vite)
Nice overview! Both SPA and server as trends is interesting, but actually makes sense :)
Some comments may only be visible to logged-in visitors. Sign in to view all comments.