Skip to content

Why Remix?

There are many JavaScript web frameworks. Here is why Remix V3 might be the right choice for your next project.

Runs Everywhere

Remix is built on the Fetch API, Web Streams, and other web standards. This means the same application code runs on:

  • Node.js --- the most widely deployed JavaScript server runtime
  • Bun --- a fast, modern JavaScript runtime with built-in bundling
  • Deno --- a secure runtime with native TypeScript support
  • Cloudflare Workers --- edge compute that runs close to your users worldwide

You do not need to change your code or maintain separate builds for different platforms. Write once, deploy anywhere.

ts
import { createRouter } from 'remix/fetch-router'

let router = createRouter()
router.get('/api/hello', () => Response.json({ message: 'Hello!' }))

// This same router works on every platform.
// Only the thin server adapter changes.
export default router

Use What You Need

Most frameworks are all-or-nothing: you either use the whole thing or nothing at all. Remix is different. It is built from 40 independent packages, and every single one works on its own.

Need just a router? Use the router. Need just cookie handling? Use the cookie package. Want to bring your own authentication system but use Remix for everything else? Go ahead.

ts
// Use only the router --- no other Remix packages required
import { createRouter } from 'remix/fetch-router'

let router = createRouter()
router.get('/health', () => new Response('OK'))
ts
// Use only the cookie package --- works with any server
import { createCookie } from 'remix/cookie'

let session = createCookie('session', { httpOnly: true, secure: true })
let header = await session.serialize({ userId: 42 })

Nothing is locked in. If you outgrow a Remix package or find something better, you can replace it without rewriting your entire application.

Type Safety Throughout

Remix is written in TypeScript from the ground up. This is not just "has type definitions" --- it means TypeScript catches real bugs at development time:

  • Type-safe routing --- URL parameters like :id are automatically typed. If your route is /users/:id, your handler receives id as a typed string parameter. Typos and missing parameters are caught by the compiler.
  • Type-safe database queries --- When you define a table schema, all queries against that table are checked at compile time. Select the wrong column name? TypeScript tells you before you run anything.
  • Type-safe middleware --- When middleware adds data to the request context (like a user object after authentication), downstream handlers see that data with its correct type.

What is "type safety"?

Type safety means the programming language (in this case, TypeScript) checks that you are using values correctly before your code runs. For example, if a function expects a number and you pass a string, TypeScript flags that as an error in your editor. This catches entire categories of bugs without needing to write tests for them.

Built on Web Standards

When you learn Remix, you are learning the web platform. The APIs you use --- Request, Response, ReadableStream, URL, Headers, FormData, Blob, File, Web Crypto --- are the same APIs available in every modern browser and every modern JavaScript runtime.

This has practical benefits:

  • Your skills transfer. Knowledge of Remix's APIs is directly applicable to browser-side code, service workers, and other frameworks.
  • No proprietary lock-in. If you ever move away from Remix, your understanding of web standards goes with you.
  • Documentation is everywhere. MDN Web Docs covers every API Remix uses, giving you a massive, well-maintained reference library for free.

Everything in One Place

Remix covers the full stack of web application development:

FeatureWhat it does
RoutingMaps URLs to handler functions with dynamic segments, nested routes, and type-safe parameters
Components / JSXRender HTML using a lightweight built-in component system
DatabaseTyped query builder for PostgreSQL, MySQL, and SQLite with migrations
AuthenticationOAuth, OpenID Connect, and credentials-based login with providers for Google, GitHub, and more
SessionsPer-user state stored in cookies, Redis, or Memcache
MiddlewareComposable request/response processing for auth checks, logging, CORS, compression, and more
File HandlingUpload parsing, S3-compatible storage, lazy streaming for large files
ValidationParse and validate form data, JSON bodies, and URL parameters
TestingBuilt-in test runner and assertions that work without a build step

What is "middleware"?

Middleware is a function that runs between receiving a request and executing your route handler. It can inspect or modify the request, add data to the context (like the current user), or short-circuit the response entirely (like returning a 401 for unauthenticated requests). Middleware functions are composable --- you can chain as many as you need.

Having all of these tools in one framework means they are designed to work together. The authentication middleware produces a typed user object that your route handlers can access. The session package integrates cleanly with the cookie package. The database toolkit's types flow through to your route responses. There is no glue code or compatibility layer needed.

Performance by Default

Remix includes several performance features that work out of the box:

  • Streaming responses --- Send HTML to the browser progressively using Web Streams, so users see content before the entire page is ready. This is especially valuable for pages that need to load data from multiple sources.
  • Compression --- Automatically compress responses with gzip or Brotli using the built-in compression middleware.
  • Static file serving --- Serve static assets with proper ETag headers (so browsers can cache them) and range request support (so large files can be downloaded in chunks).
  • Lazy files --- Handle large file uploads without loading the entire file into memory. Remix streams file data on demand, keeping memory usage constant regardless of file size.

What is "streaming"?

Normally, a server builds an entire HTML page, then sends it to the browser all at once. With streaming, the server starts sending HTML as soon as the first piece is ready. The browser can begin rendering the page immediately, which makes the application feel faster --- especially on slow connections or when some data takes longer to load.

Minimal Boilerplate

Remix aims for the shortest distance between "I have an idea" and "it's running." A working server is a handful of lines. Adding a database table is one function call. Wiring up authentication is a middleware declaration.

ts
import { createRouter } from 'remix/fetch-router'
import { createTable } from 'remix/data-table'
import { sessionMiddleware } from 'remix/session-middleware'
import { authMiddleware } from 'remix/auth-middleware'

let router = createRouter()

// Add session and auth support
router.use(sessionMiddleware())
router.use(authMiddleware())

// Define a route
router.get('/dashboard', (context) => {
  let user = context.get('user')
  return Response.json({ message: `Welcome, ${user.name}` })
})

When something goes wrong, Remix provides clear error messages that tell you what happened and where, rather than cryptic stack traces from deep inside a dependency tree.

How Remix Compares

Every framework makes tradeoffs. Here is how Remix's approach differs from some common alternatives:

vs. Traditional Express/Fastify Apps

Frameworks like Express give you a minimal foundation and leave most decisions to you: which template engine, which ORM, which authentication library, which session store. This flexibility is powerful but means you spend a lot of time assembling and integrating pieces yourself.

Remix gives you a complete, integrated toolkit while still allowing you to replace any individual piece. You get the convenience of a batteries-included framework with the flexibility of a modular one.

vs. Next.js / Nuxt

Frameworks like Next.js and Nuxt are tightly coupled to a specific UI library (React or Vue) and often to a specific deployment platform. They also typically require a build step to function.

Remix is UI-library independent (it has its own lightweight component system but does not require React or Vue), platform-independent (runs on any JavaScript runtime), and runtime-first (no build step required). You are not locked into any single vendor or ecosystem.

vs. Hono / ElysiaJS

Lightweight frameworks like Hono and Elysia focus on the routing and request-handling layer. They are fast and elegant for APIs but leave higher-level concerns (databases, auth, sessions, file handling) to external packages.

Remix starts from the same web-standards-based foundation but provides a full-stack solution that covers the entire application lifecycle. If you find yourself adding more and more packages to a lightweight framework, Remix gives you those same capabilities in a single, cohesive toolkit.

Next Steps

  • Overview --- Read the high-level introduction to Remix.
  • Philosophy --- Understand the design principles behind these choices.
  • Getting Started --- Install Remix and build your first application.

Released under the MIT License.