By Adam Wojda,
The world of web development is not the easiest to keep up to date on. Over the past ten years, we tried to solve a lot of problems with a lot of frameworks. It’s a good thing, it means that our industry is evolving along with other parts of it. Inspired by Kent C. Dodds talk at InfoShare 2022 I decided to dig deeper into upcoming trends in web development.
Our journey started in a completely different state of web development and over ten years ago we didn’t have a standardized world to the extent that we have now. Just 10 years ago I was still supporting Internet Explorer and was concerned with completely different things.
The next stage of web transformation as some may say - PEMPA’s which goes for Progressively Enhanced Multi Page Apps, if you have trouble remembering what stands for progressive enhancement here you have the official definition:
Progressive enhancement is a design philosophy that provides a baseline of essential content and functionality to as many users as possible, while delivering the best possible experience only to users of the most modern browsers that can run all the required code.
After all, it’s not as scary as it may seem. But React is not progressively enhanced by default you need to bring it in - and that’s where Remix could help you a lot. From a technical perspective, is just a compiler for React Router, and like other frameworks, an edge-compatible runtime.
Merging frontend and backend - these days it seems that’s the way developers want to go. What a full-stack library means is that you can use it to create a website from start to finish, it deals with client-side and server-side aspects of a web application.
This is a win-win situation where you can spend less time creating two applications for the backend and frontend side of things. It also creates new possibilities that client only libraries are not able to use. As full-stack libraries go, our latest hot new kid on the street is Remix - I will focus on this newbie in this article.
Remix is based on a low-level approach to development. It doesn’t try to patch things that are missing or lack certain features in the specs - it’s not 2010 anymore we don’t need to patch things up, instead, it tries to work with the foundations of web development and use it to the fullest - and trust me there is a lot to use these days.
Below you can read about some of the best features that come with Remix:
Remix definition of routes is something new and unique to this library as it allows you to create a hierarchy of routes in which each route is a separate file that can determine where its children should be displayed - it means you can have multiple routes active on a single page. This ends with the concept that each route is a separate page, which can be confusing to some developers, but it’s really easy to grasp and very useful once you get the hang of it.
Loaders are the backend “API” for their component and it’s already wired up for you through useLoaderData. It's a little wild how blurry the line is between the client and the server in a Remix route.
Remix tries to optimize as much as possible in the aspects on what we download after each page refresh, and after it already has served the webpage to the browser it starts hydrating the document - that proccess is called often “browser emulating”, this is what the official docs have to say about this:
When the user clicks a link, instead of making a round trip to the server for the entire document and all of the assets, Remix simply fetches the data for the next page and updates the UI. This has many performance benefits over making a full document request:
So Remix is a really great view into what’s there for us in the future, it’s a breath of fresh air in the way we are doing things in the front-end world, but is it ready to take over the world? Definetly not. You should definetly think about pros and cons when using it large scale apps.
But you definetly should play with it and get a grip of what concepts are behind it. Sooner or later it may be mature enough to be a top choice framework in the near future."
So, will the “center” approach take over the world?
Besides Remix we already see other concepts emerging out there similar to this - we have React Server Components /Suspense or Layouts RFC in Next.js so this is definetly happening and it’s happening soon.
The evolution of frameworks push our industry further, removing the previous needs of patching things, making polyfills and tradeoffs. It may seem the last few years we didn’t have any breakthrough and breaking changes but be awere - next few years will definetly be different.