One is a unified cross-platform React web and React Native framework that lives entirely in a Vite plugin. One v1 is almost here - we’ve just released 1.0.0-rc.1, marking it ready for production use. With over 1,800 commits since the announcement of the alpha about a year ago, we’re incredibly proud of the simple, robust framework it’s become.
One makes building apps for both web and native a delight, bringing simplicity and sanity to what typically is an incredibly messy affair. Where before you’d need two frameworks, two bundlers, and a ton of glue code, with One it’s now as simple as can be - Vite, a single plugin, and some file-system routes.
Get started a simply as:
npx one
We’ve invested a lot to achieve stability, many new features, and some class-leading performance numbers.
Thanks to per-page render modes and a variety of optimizations, One makes it possible for the first time to get 100 on your Lighthouse performance score without trouble, even on hydrated pages that share UI with native.
One is a uniquely great framework even if you are only targeting web. In a world haunted by complexity, One simplifies by focusing: it only supports React, not multiple frameworks, and it’s always taken a principled stand against RSC or magic directives. One now has a feature-set that rivals any modern web framework.
Some highlights:
- Fully-typed file system routes with autogenerated helpers, groups, nested layouts, and
.platformfile-level forking. - Fully typed links, params, and more.
- Global and per-page render modes with seamless routing between any of them - SSR, SSG, SPA - for flexibility and performance.
- Typed loaders for easy, simple, typed data loading and refetching.
- Lock-in-free: it’s Vite + Hono, builds to a
distfolder, and has multiple output targets. - new Metro-mode: use Metro for native, for maximum compatibility and ease of migration.
- new Middleware for request interception and shared context.
- new Sitemaps with per-route overrides.
- new Deploy to Vercel or Cloudflare workers with a single config option.
- new useLoaderState, setServerData and getServerData for advanced data loading.
- new setResponseHeaders for ISR/caching via CDN cache headers, cookies, and custom response headers.
- new Automatic NativeWind and Reanimated detection and support.
- new Advanced script loading strategies that significantly improve Lighthouse scores.
- new Loader HMR with
watchFilefor instant content updates during development. - new Image data imports with
?imagedatasuffix for automatic dimensions and blur placeholders. - new Dev Tools - SEO preview, route debugging, loader timing, error tracking, and source inspector all in one unified panel (Alt+Space).
- new useBlocker - Block navigation for unsaved forms with customizable confirmation prompts.
- new Protected Routes - Declarative route guarding with automatic redirects for unauthenticated users.
- new Route Validation - Validate route params before navigation with Zod schemas or async functions.
- new CSS Collection Improvements - In dev mode, route modules are pre-warmed to collect CSS upfront, avoiding flash of unstyled content during navigation.
- new Route Masks - Display a different URL in the browser while navigating to complex routes, perfect for modals and side panels.
- new Scroll Position Groups - Preserve scroll position when navigating between child routes in nested layouts.
- new LCP Optimization and CSS inlining
- Inline layout CSS for a great hybrid mix of first-load performance and caching, and optimize LCP for 30+% improved Lighthouse scores.
- new Smart Link Prefetching - Predicts which link you’re moving toward using mouse trajectory, prefetching before you hover.
- new useSearchParams - Standard URLSearchParams API for working with query strings, matching expo-router.
- new useMatches, useMatch, usePageMatch - Access all matched routes and their loader data for breadcrumbs, layouts accessing page data, and more.
For the full changelog, see the release notes.
Getting Started
The quickest way:
npx one
Pick a starter and you’re up and running. From there, check out the introduction, routing guide, or deployment docs.
Thanks
One started as a fork of Expo Router, itself a wrapper of React Navigation, built on top of vxrn. Thanks to the Expo team and React Navigation team for their amazing OSS work.
A huge thanks is owed to Pokai Chang, who led the majority of the work of maturing One to version 1. He landed Metro mode, countless bug fixes, a robust testing infrastructure, and much more.
One builds on some excellent open source work:
What about Rolldown?
We’ve been testing Rolldown in a branch and it’s looking promising. It works mostly on web already and will make our lives easier on native, but we’re waiting for their full-bundle dev mode as it will greatly simplify the transition. We expect web support to land shortly after.
Community
Get in touch!
- Join our Discord to chat, ask questions, or share what you’re building
- Open an issue if you hit a bug (repros help a lot!)