Introduction to Remix JS
What is Remix? Basically Remix is the same as Next but better🔥.
Remix is trending among React Software Developers and here we will go through it so that we can know that we should use it for our next project or not. We can find articles like choosing Next vs Remix. Here, we’ll understand in similar approach but we will know what should be followed.
Next has been most popular framework for server side rendering and its amazing features. Remix has similar flavor but obviously is a Burrito to have it.
“How is remix different from Next”
- Remix is as fast or faster than Next at serving static content
- Remix is faster than Next at serving dynamic content
- Remix enables fast user experiences even on slow networks
- Remix automatically handles errors, interruptions, and race conditions, Next doesn’t
- Next encourages client side JavaScript for serving dynamic content, Remix doesn’t
- Next requires client side JavaScript for data mutations, Remix doesn’t
- Next build times increase linearly with your data, Remix build times are nearly instant and decoupled from data
- Next requires you to change your application architecture and sacrifice performance when your data scales
- We think Remix’s abstractions lead to better application code
How fast is remix was?
Before we say anything, let’s acknowledge that all three versions are so dang fast it’s not even worth comparing who is faster. It’s a bit unfair to Next.js too, because the little animation of the cookie banner factors into “visually complete” and the Remix site doesn’t have it. Let’s look at it in slow motion:
Now we can see that Next.js is actually done 0.8s. Again, they are all fast. I also ran them all through the same test with a 3G network connection and it was the same story: all fast, all looked about the same.
Why Next.js is fast 🚀🚀: The homepage uses Static Site Generation (SSG) with getStaticProps. At build time, Next.js pulls data from Shopify, renders a page to an HTML file and puts it in the public directory. When the site is deployed, the static file is now served at the edge (out of Vercel's CDN) instead of hitting an origin server at a single location.
Why the Remix port is fast 🔥🔥: Remix doesn’t support SSG so we used the HTTP stale-while-revalidate caching directive (SWR, not be consfused with Vercel’s swr client fetching package). The end result is the same: a static document at the edge (even on the same CDN, Vercel’s). The difference is how the documents get there.
There are many more remix features that can exceed next, but the drawback at this time is that the remix community itself is now still small compared to next. Therefore, it is rare that many companies use this library.
