vista
Vista.js is a React 19 framework with App Router conventions, React Server Components, standalone .vista output, and a dual-engine model:
default: the main webpack-backed RSC/SSR engineflashpack: a Rust-backed engine path that records graph/runtime state in.flash
Official site: https://vista-js.vercel.app
Repository: https://github.com/Mantitup-Org/vista
Packages
| Package | Purpose |
|---|---|
@vistagenic/vista |
Framework runtime, CLI, server/client exports, cache APIs, fonts, theme APIs |
create-vista-app |
Scaffolds Vista apps with engine selection and package-manager prompts |
vista-native |
Internal Rust/NAPI bridge used by the repo |
Current Capabilities
Vista currently ships the following core surface:
- App Router-style file conventions under
app/ - React Server Components and streaming SSR
- Server Actions and runtime action manifests
- Cache APIs:
unstable_cache,revalidateTag,revalidatePath,cacheTag,cacheLife - Route groups, parallel routes, interception routes, slot defaults, loading/error/not-found boundaries
- Segment config support (
dynamic,revalidate,runtime,preferredRegion,maxDuration,fetchCache) - Standalone
.vistaoutput with manifests, file tracing, PPR shell artifacts, and runtime metadata - Flashpack
.flashruntime state fordev,build, andstart - Metadata route support through app files like
app/(seo)/sitemap.ts,robots.ts, andmanifest.ts - Package-level theme primitives via
vista/theme - Experimental typed API package surface via
vista/stackandvista/stack/client
Quick Start
Create a default app:
npx create-vista-app@latest my-app
cd my-app
npm run dev
Create a Flashpack app:
npx create-vista-app@latest my-app --engine flashpack
cd my-app
npm run dev
Create a typed API starter:
npx create-vista-app@latest my-app --typed-api
By default, generated apps use the same commands regardless of engine:
npm run dev
npm run build
npm run start
The selected engine is stored in vista.config.ts.
Package Examples
Theme provider from the package:
import { ThemeProvider, ThemeScript } from 'vista/theme';
Cache APIs from the package:
import { unstable_cache, revalidateTag, revalidatePath } from 'vista/cache';
Server helpers from the package:
import { cookies, headers, draftMode } from 'vista/server';
Monorepo Layout
vista/
├── apps/
│ └── web/ # Official website and docs at vista.xyz
├── bench/ # Vista-first benchmark fixtures
├── crates/ # Top-level Rust crates and NAPI surface
├── flashpack/ # Rust-backed Flashpack engine crates
├── packages/
│ ├── vista/ # Framework package
│ └── create-vista-app/ # Scaffolding CLI
├── scripts/ # Test, guard, and benchmark helpers
├── task.md # Execution ledger / milestone history
├── CONTRIBUTING.md
└── developer.md
Local Development
Install workspace dependencies:
pnpm install
Build the framework package after touching packages/vista/src:
npm --prefix packages/vista run build
Build the website:
npm --prefix apps/web run build
Build the native binding when you change crates/vista-napi:
npm --prefix crates/vista-napi run build
Common Commands
| Command | Purpose |
|---|---|
pnpm build |
Build the workspace through flash-run.cjs |
pnpm dev |
Run workspace dev tasks |
pnpm test |
Full repo test chain |
pnpm test:integrity |
Framework integrity guard |
pnpm test:rsc-conformance |
RSC and route conformance suite |
pnpm test:vista-output |
.vista standalone/output verification |
pnpm test:flashpack-dev |
Flashpack dev/restart verification |
pnpm test:flashpack-state |
Flashpack state reuse / cleanup verification |
pnpm bench |
Full benchmark run |
pnpm bench:quick |
Quick benchmark smoke run |
Deployment Notes
The repo includes first-party deployment config for the official site:
render.yamlvercel.json
apps/web is the deployment target. Its SEO route files live in app/(seo)/, not public/.
Release Flow
Maintainers publish from the development branch.
Typical sequence:
git add -A
git commit -m "release: x.y.z"
git push origin development
npx lerna publish from-package --yes
git tag vx.y.z
git push origin vx.y.z
Learn More
- Repository: https://github.com/Mantitup-Org/vista
- Official site: https://vista-js.vercel.app
- Contribution guide: CONTRIBUTING.md
- Internal contributor guide: developer.md
- Benchmark guide: bench/README.md
