4 Front-End Trends and 1 Loser

Things to look for in 2021

Photo by Tim Hüfner on Unsplash.

Let’s take a peek at what may be the most important front-end trends in 2021 — and one trend that I don’t think will prevail.

Photo from Svelte.

Svelte

According to the documentation, Svelte is a component framework — like React or Vue — but with an important difference. The difference is Svelte runs at build time, converting your code to highly efficient JavaScript. So you can get the benefits of the component framework without the performance penalty.

Svelte has been around for a few years, with the latest version (3) shipping in 2019. It has over 39K stars on GitHub, but it’s not widely used in bigger projects, as it’s still perceived as immature. So why will 2021 be the decisive year for Svelte’s popularity?

The typical problem with component frameworks is they are rendered client-side, so search bots get an almost empty HTML, which is bad for SEO. To alleviate that problem, each library has its solutions. For Svelte, it was usually Sapper. But in October, at Svelte Summit 2020, its creator decided to ditch Sapper and propose a new way of making Svelte applications.

The new approach will be based on a SvelteKit. Its goal is to focus on the developer experience, with fast builds, hot module reloading, error overlays, and serverless support. If Svelte can add a seamless experience and out-of-the-box SSR support, it may be a game-changer.

So it seems Svelte is going to provide a first-class experience for the developer. But will it be enough to convince them to use it?

Photo by Markus Spiske on Unsplash.

No-Code/Low-Code

No-code tools allow people with no coding experience, the “citizen developers,” to create software. Meanwhile, low-code tools can be used by people with some programming experience to create software and modify it slightly.

For years now, citizen developers could create websites using tools like Squarespace or Wix. But in the last few years, many new tools have emerged to let everyone make a plethora of other applications.

You can now create mobile apps, use machine learning, add augmented reality to eCommerce sites, build voice apps, chatbots, or design complex forms. The number of new tools is astonishing.

I know many limitations to no-code and low-code tools. They produce apps similar to each other with limited functionality and severe restraints. Also, vendor lock-in may hit many businesses hard. But in the long run, I don’t think it matters.

These tools offer everyone a unique opportunity to build software. Anyone with an idea, a little money, and a few weeks of time will be able to create the application of their dreams. Instead of months of development and thousands of dollars, the effects will be visible almost immediately. It will provide a great opportunity for cheap proofs of concept or A/B testing.

I don’t believe no-code will eliminate the need for software developers. But it will empower people to build things on their own and let developers focus on more complex and interesting problems.

Photo from Remix.

Remix

According to its creators, Remix is a React- and Node-based full-stack framework that brings you state-of-the-art web development without leaving behind the fundamentals of what made the web great.

Remix provides out-of-the-box HTTP caching, meta tag support, and server rendering with proper status codes. It also gives you nested routes and an easy way to load data.

You may think of Remix as a Ruby on Rails for modern times. It strives to combine great developer experience and development speed with web fundamentals long forgotten in the era of Single Page Applications (SPA).

Remix isn’t production-ready. It just started its beta (which is called Supporter Preview). The framework looks promising and is maintained by two of the most influential developers in the React world — creators of the great React Router.

The downside of Remix? It’s not free. For now, an indie license costs $250 USD per year. The biggest Remix competitor, Next.js, is free.

Developers have gotten used to open source and expect to get their tools for free. It will be interesting to see if a great piece of software you need to pay for can become a popular choice.

Image by Magda Waksberg.

Static Site Generation

Single Page Applications aren’t great for SEO. For the last few years, we had two solutions to that problem: server-side rendering (SSR) and static site generation (SSG).

With SSR, we run the application on the server. It creates HTML that is fetched by the front end. With SSG, we create all of the pages of the application at build time. So the files stored on the server are static and are fetched by the browser like a standard, non-SPA application.

SSR's biggest problem is that building an app on the server takes many resources and can be slow, so it increases the page load time. The SSG downside was that every small change required a new build and creation of all of the application pages. If the application had many pages, the process was slow and costly.

Now it looks like the SSG won and the SSR is (almost) dead. Next.js, a prevalent full-stack framework, made SSG a default and added incremental builds to alleviate the problem of rebuilding all of the pages on every change. Also, static site generators like Gatsby add incremental builds to their offer.

With great speed, security, and development experience, SSG is set to be a clear winner in 2021.

But don’t forget about Remix. It’s based on SSR, so if it wins big, that approach can get back into the game.

Photo from GraphQL.

The Great Loser — GraphQL

According to the documentation:

“GraphQL is a query language for APIs and a runtime for fulfilling those queries with your existing data. GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools.”

What does that mean? It means it’s an alternative to the REST API. In REST, you normally have dozens of endpoints, and each of them returns too much data. GraphQL allows you to have fewer endpoints (usually one) and define what data you need to fetch.

GraphQL was open-sourced in 2015 and regularly made lists about the “Hottest trends of insert year,” yet it’s still not very popular. Why would that change the next year?

It won’t.

GraphQL was designed to solve a particular set of problems —p roblems many teams don’t have. In exchange, it introduces new difficulties: caching, scaling, lack of HTTP statuses handling, etc.

GraphQL is great, but it’s just not worth the hassle for many developers. So it will still be used by some companies but won’t rise substantially. At least not in 2021.

What about you? What do you think will skyrocket in 2021?

Be sure to read the rest of my blog. Thanks!