The Future of Frontend Development

INTRODUCTION

The year was 2003, I was a young kid only 13 of age. I’ve had my first computer just about for 7 years at that point however this was the year when my family switched from dial-up to DSL broadband internet. Which meant my alloted time of 1-2h of internet time per day just turned into non stop internet access. This was the first time I was able to explore the internet without any restrictions. I was able to watch videos, play games, chat with friends, and most importantly I was able to access forums, blogs and websites that would teach me how to code.

My first language was C, in my youthful naivete I thought it would be super cool to learn how to become a game dev(like most kids). Over on one of my IRC channels I frequented I was told that C++ was what all the cool kids were using. So I switched over to that. Through C++ I got into networks programming and through that I slowly but steadily got into web development.

At this point I was an angsty 16 year old teenager, my language of choice was PHP. I built my first few websites for family and friends and I was hooked on web development. I was able to build something that was accessible to everyone, something that was easy to share and something that was easy to maintain.

But through the years the web has evolved the quickest and gone through some of the most drastic changes. We went from simple XHTML + PHP dynamic websites to interactive web applications built with jQuery and AJAX, to full blown SPA’s(single page applications) built with React, Angular, and Vue to PWAs and WASM.

It has been a wild ride and I’m excited to see where the future of frontend development will take us. In this article I will be discussing some of the emerging trends and technologies that I believe will shape the future of frontend development.

Note These are not predictions, I don’t have a crystal ball in my possession, my smoke machine is broken and I’m all out of tarot cards. These are just my thoughts and opinions on things that in the current year of 2024 are gaining traction and can potentially shape the future of frontend development. A lot of these are old news or old ideas that are being revisited and reimagined and some have been around for a while but are just now gaining traction.

EMERGING TRENDS AND TECHNOLOGIES

The Rise of the Headless CMS

Back in the ol’ days of the web we simply defaulted to using Wordpress for all our CMS needs. It was easy, user friendly and could be molded into anything you wanted it to be with some moderate effort and best of all it did both the “frontend and backend” for you. That last part was ironically also it’s biggest weakness. It limited your choices and because it had to accomodate more and more user needs it became bloated and slow.

What is a Headless CMS?

A headless CMS is essentially a content management system stripped to it’s essentials, it only serves as an interface between your content and your frontend. It doesn’t care about how you display your content, it only cares about how you store and manage your content. This means you can use any frontend technology you want to display your content.

This means that you are free to use any frontend technology you want, heck you can even go full static site generator or have your mobile app or desktop app consume the same content from the same CMS as your website. It follows the UNIX principle of do one thing and do it well, in this case it’s managing your content.

I believe that the rise of the headless CMS can not and will not be stopped and will only continue to grow in popularity. The benefits far outweigh the negatives. In fact some headless CMSs out there let you build your own bespoke CMS dashboard with minimal hassle independent of your data source for example: Directus, Strapi, and Sanity.

What’s more plenty of these headless CMSs are offered as a service that your end clients can simply access and manage via their browser. This means you can build a website for a client and they can manage their content without having to worry about the technical details of how their website works or how to deploy it.

The Continued Dominance of JavaScript Frameworks

Every second a new JavaScript framework is born, every minute a new JavaScript framework dies. There’s no denying that JavaScript frameworks have had a huge impact on frontend development. They have made it incredibly easy to build complex web applications with very minimal effort for a small trade off in maintainability, occasional performance issues and production breaking bugs due to some obscure javascript quirk.

I don’t think JavaScript frameworks are going anywhere anytime soon. In fact I believe that they will continue to dominate the frontend development landscape for the foreseeable future. They have become the de facto standard for building web applications and they have a huge ecosystem of libraries and tools that make building web applications a breeze.

I believe they will evolve further and adopt more features from other languages and frameworks. For example React has adopted server components which allows you to essentially run NodeJS style backend code in your frontend. This means you can do things like database queries, file system operations, and other backend operations in your frontend code that will then be executed on the server and the result will be sent to the client.

Is that good, bad or ugly? Yes, all of the above. But it’s a trend that I believe will continue to grow and evolve.

The Integration of WebAssembly

In recent years WebAssembly has gained a lot of traction and has become a popular choice for building high performance web applications.

What is WebAssembly?

WebAssembly is a binary instruction format for a stack-based virtual machine. It is designed as a portable target for compilation of high-level languages like C/C++/Rust, enabling deployment on the web for client and server applications.

Basically it allows you to run code written in other languages like C, C++, and Rust in the browser. This means you can build high performance web applications that can run at near native speeds in the browser. Which is great for performance intensive applications that would traditionally be desktop applications. Figma is a great example of a web application that uses WebAssembly to run incredibly fast and smooth in the browser.

I believe that downloading and installing desktop applications will become more and more of a nieche thing for most common users of the web. WebAssembly will allow developers to build high performance web applications that can run on any device with a modern browser. This removes a pretty big chunk of friction and humans will always take the path of least resistance. The friction of having to download and install an application that is, why would you do that when you can just open a browser and use the application right away?

Now I am aware of all the security implications of that and also that this means that we won’t ever truly own software anymore which I personally don’t think is the best thing for the future of software but that’s a topic for another article.

The Growing Importance of Web Accessibility

Web accessibility has been a hot topic for a while now and it’s only going to get hotter(rawr). The web is for everyone and it should be accessible to everyone. This means that we as developers have a responsibility to make sure that our websites are accessible to everyone. If I roll the dice on this sentence I can assume that you the reader are a healthy individual but many users out there are not and they should be able to have the same access to the the wonderful place that is the web as you or me do.

I believe that web accessibility will become a standard requirement for all websites in the future. Now wether that is because of legislation or because of a shift in mindset is to be seen. But I believe that it will happen. Or atleast I hope it will happen.

The Evolution of Progressive Web Apps (PWAs)

Progressive Web Apps or PWAs for short have been around for a while now but I feel like they’ve only just started to gain some traction, it’s been slow for sure.

What is a Progressive Web App?

A progressive web app is a basically just a Web App with a manifest file that makes it installable on your device typically mobile but also desktop. It also has a service worker that allows it to work offline and load faster.

It has an interesting dynamic with WASM as well, you could build your PWA with WASM and have it run in the browser but also be easily installable on any device. This means you could build a pretty ok performing mobile app with just web technologies and have it be installable on any device. I’m personally not the biggest fan of PWAs but I can see the appeal for some use cases.

I believe that PWAs will become more and more popular in the future as they offer a way to build cross platform applications with web technologies without relying on electron or having to rewrite your application for every platform or device.

They can also bypass phone app stores and desktop stores which has caused some controversy with Apple in the past.

The Ascendancy of Artificial Intelligence (AI) and Machine Learning (ML)

AI and ML have been around for a while now. AI has kinda exploded in recent years with ChatGPT, Copilot, and other AI powered tools, in fact it seems like 2024 is the year where people try to put AI into everything. Only a matter of time till they try to put themselves in AI but that’s a different story.

I believe that AI and ML will become really useful tools for a lot of people and for a lot of technologies and usecases. Personally I’m not a big fan of using AI for creative work, I find that humans are a lot better at actually creating creative things than AI is. In fact AI can not really create as of yet it can just kinda assume and predict based on data it has been fed. So there’s a point of diminishing returns when it comes to AI and creative work.

But plenty of companies will use AI in creative ways such as meeting, call assistants that will be able to take notes, do sentiment analysis and recall the entire meeting in great detail for you. To put it simply imagine if you had an AI assistant that you could ask about that one point your manager was making during that big meeting he wanted everyone to attend but you were too busy browsing social media on your phone. Asking your manager to repeat himself long after the meeting has ended would be embarassing or income changing depending on your manager.

But if you had an AI assistant you could simply ask that AI all your questions.

The Rise of Streaming and Real-Time Communication

At the moment the web operates on a request-response model. You make a request to a server, wait for a bit while the server processes your request does it’s work to prepare a response and then sends it back to you. This is fine but fairly slow.

I believe there will be a point in which this type of communication between server and client is no longer the most efficient way to communicate. Something that will make the cost of this a lot lower.

Basically socket communication is superior to request-response communication in almost every single way, it’s main drawbacks are that it’s more expensive and more difficult to maintain and debug.

But basically I think even simple websites will simply stream their content over to your browser in the future. The only interesting part with this will be how will stuff like SEO look, when you don’t really have a static page to index anymore. I personally think that SEO will become less and less important in the future as the web becomes more and more of a real-time experience plus the fact that much of the use cases of search engines are already covered by AI assistants at the moment.

The Power of Web Workers and Service Workers

Misko Hevery has a tendency to be ahead of his time but not popular. He has recently created Qwik which is a new-ish JavaScript framework that relies heavily on web workers and service workers to deliver a fast and smooth experience to the user. Now you may know Misko as the creator of Angular which was the first hugely popular and widely used JavaScript frontend framework.

Web workers and service workers are a way to run JavaScript code in the background of your application. This means you can do things like offload heavy computations to a web worker and have it run in the background while your main thread is free to do other things. This can greatly improve the performance of your web application and make it feel more responsive and smooth.

I think Misko is on the right track with this, workers will most likely be a very important building block of modern javascript frameworks in the future. However I believe that it won’t be Qwik that popularizes this but rather most likely React or Svelte or some other completely new framework.

The Rise of Low-Code/No-Code Development

Let me preface this by saying that I hate that this is becoming so popular, in fact the only thing I hate more is the fact that there are thought leaders and guides out there that recommend building your solo startup by heavily utilising no-code tools to bridge something quick and dirty together as a proof of concept.

No-Code and Low-Code tools are basically tools that let you create with minimal to no coding knowledge or experience required. They are great for prototyping and building simple applications. You can create a website, a mobile app, or a web application without writing a single line of code.

I believe that due to the enterpreneurial spirit of the current generation and the rise of the POC and MVP culture that no-code and low-code tools will become increasingly popular in the future. They offer folks the ability to scaffold their idea out into a working prototype to showcase to investors or even to launch to the general public.

I don’t like it, but that’s what I think will happen.

The Continued Growth of Static Site Generators

What is old will be new again. Static sites once ruled the web, then dynamic sites took over, now static sites are making a comeback. We’re kinda forming two camps in web development recently. On one side you got the minimal effort wire a lot of different tools together to get a working web app or website and on the other side you have the let’s keep it simple and just build as much stuff as simple as possible gang cough HTMX cough.

Static site generators kinda bridge that gap in a way, because with tools like Astro and Svelte you can build a static site that is also a web application with all the complexity and interplay of different tools and libraries that you want.

I believe that static site generators will continue to grow in popularity in the future as they offer a way to build fast and performant websites that can also possibly scale into more complex and feature rich web applications within the same codebase.

CONCLUSION

The web still remains one of the quickest evolving and most exciting platforms to develop for. In just 20 years we went from simple static websites filled with GIFs and auto playing music to fully fledged application that run in your browser and let you do work that was previously only possible by going through a very long desktop application installation process.

It hasn’t been that long but the web has come a long way and I’m excited to see where it will go in the future. This blog post outlined a couple of my thoughts on the trends and technologies that I see emerging or growing in popularity currently. Wether or not I’m right remains to be seen but I’m excited to see where the future of frontend development will take us.