repository·main·Indexed 12 days ago
https://github.com/remix-run/remixA web framework and ecosystem of composable, standards-aligned JavaScript/TypeScript tools designed for high portability across different runtimes and optimized for modern AI-driven development workflows.
fetch-router is a minimal, composable router built on the web Fetch API and route-pattern. It is designed to define typed route maps, execute middleware, and share request-scoped context across various environments including Node.js, Bun, Deno, Cloudflare Workers, and browsers. It is particularly useful for APIs, web services, and server-rendered applications where type safety and standard web APIs are required.tar-parser is a streaming JavaScript library for parsing POSIX, GNU, and PAX tar archives. It is designed for memory efficiency by processing archives incrementally without buffering the full payload.
Key Features:
fetch()).The remix/fs package provides lazy, streaming filesystem utilities for JavaScript.
Key characteristics include:
LazyFile, which matches the native Web File API and provides methods like .stream(), .toFile(), and .toBlob() for easy conversion to native types.The file-storage package provides key/value storage interfaces specifically designed for server-side File objects. It offers a consistent API regardless of whether you are using a local disk or an in-memory backend.
Key features include:
File objects.file.name, file.type, file.size, and file.lastModified.Remix is a full-stack TypeScript framework designed around Web APIs (Request, Response, URL, FormData, etc.). It provides typed routing, middleware, server-side rendering with browser hydration, and asset compilation.
Key design principles include:
Remix is composed of many standalone JavaScript/TypeScript tools that are bundled into a single remix package for ease of use. Most packages follow the Single Responsibility Principle and prioritize web standards to ensure portability across runtimes like Node.js, Bun, Deno, and Cloudflare Workers.
Key packages include:
remix: The core Remix web framework.cli: Command-line interface for Remix.auth: Browser login, OAuth, and OIDC helpers.ui: View layer with reconciler and component model.session: Session management.fetch-router: A minimal, composable router for the web Fetch API.data-table: A typed, relational query toolkit.cookie: Toolkit for working with cookies.headers: Toolkit for working with HTTP headers.assets: Server for compiling browser assets on demand.compression-middleware: Middleware for compressing HTTP responses.cors-middleware: Middleware for handling CORS.csrf-middleware: Middleware for CSRF protection.form-data-parser: A request.formData() wrapper with streaming file upload handling.The html-template package provides safe HTML template literals that automatically escape interpolated values to prevent XSS attacks. It uses branded types for TypeScript support and is runtime agnostic (Node.js, Bun, Deno, browsers, edge).
import { html } from 'remix/html-template'
let userInput = '<script>alert("XSS")</script>'
let greeting = html`<h1>Hello ${userInput}!</h1>`
console.log(String(greeting))
// Output: <h1>Hello <script>alert("XSS")</script>!</h1>The UNPKG demo follows a controller-first app layout. Key architectural components include:
app/router.ts maps route maps to controllers.app/actions/controller.ts manages top-level home and package-browser actions. Specific rendering for the package browser is colocated in app/actions/package-browser.ts.app/utils/npm.ts handles fetching tarballs from npm, decompressing them with node:zlib, and parsing them with @remix-run/tar-parser. It includes parsePackagePath() to resolve complex URLs like /@remix-run/cookie@1.0.0/src/index.ts.app/utils/tarball-cache.ts uses remix/file-storage/fs to store decompressed tarballs in a local tmp/ directory.app/middleware/render.ts provides a request-scoped HTML renderer accessible via context.render. The shared document shell is maintained in app/ui/document.ts.remix-docs-shared is a private workspace package that provides shared infrastructure for the Remix documentation sites (docs/api and docs/guides). It is not a standalone site, but a collection of utilities and components used by the documentation sites.
Key components include:
assets/: Static files for the shared UI.prerender/: Helpers for crawling and static output.search/: Pagefind elements and browser behavior.server.ts: Local Node server startup, request adaptation, and error handling.styles/: Shared tokens and docs-shell stylesheets.ui/: Shared server-rendered components and browser behaviors.Note that site-specific logic (like navigation behavior, document shells, and Markdown transforms) remains owned by the specific site (API or Guides) rather than the shared package.
multipart-parser is designed for high efficiency by operating on data streams and minimizing buffering. This makes it suitable for handling multipart payloads of any size. In benchmarks across Node.js, Bun, and Deno, it consistently performs as fast or faster than busboy and @fastify/busboy.This Remix application template follows a specific organizational pattern for routing, actions, and assets:
app/routes.ts defines the route contract.app/router.ts wires routes to handlers.app/actions/controller.tsx contains the top-level route actions.app/middleware/render.tsx installs the request-scoped renderer used by actions.app/ui/ contains the shared document shell and home page UI.app/assets.ts manages the server-side asset pipeline used by the asset route and renderer.public/ contains static files served from the app root.lazy-file provides LazyBlob and LazyFile implementations that defer reading content until it is actually needed. This is ideal for streaming server environments where you want to avoid buffering large file contents into memory all at once.
Unlike the native File constructor which requires contents to be supplied upfront, LazyFile accepts a LazyContent object that defines how to stream data on demand.