Rasengan Logo
Rasengan Logo
  • Docs
  • Blog
  • Showcase
  • Support us
Using stable versionv1.2.0
Documentation
Packages
Templates
Rasengan UI Kit
Using stable versionv1.2.0
Documentation
Packages
Templates
Rasengan UI Kit

GETTING STARTED

Upgrading

Latest Stable version

To update to the latest version of Rasengan.js, you just have to run the following command:

Terminal
bashpnpm add rasengan@latest

Latest Beta version

To update to the latest beta version of Rasengan.js, you just have to run the following command:

Terminal
bashpnpm add rasengan@beta

Upgrade from 1.1.x to 1.2.x

If you want to improve the performance of your application — especially as it grows in size — upgrading to version 1.2.x is a great choice.

This version introduces two major features:

Lazy Loaded Routes

Routes are now loaded on demand, based on the page the user is visiting. This means your app only loads what it needs, when it needs it — which helps reduce initial load time and makes navigation feel faster.


Everything is handled automatically, there is no option to opt out this feature.

SSG (Static Site Generation)

You can now generate static HTML files for your pages ahead of time. This improves performance, SEO, and allows your site to be served extremely fast, without waiting for server responses or client-side rendering.


The configuration is simple, inside the rasengan.config.js file, you just have to enable the prerender option.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; import { rasengan } from 'rasengan/plugin'; export default defineConfig({ prerender: true, vite: { plugins: [rasengan()], }, });

This is the minimal configuration, it will enable the prerender globally into your application. If you prefer, you can select what you really want to prerender.

rasengan.config.js
jsimport { defineConfig } from 'rasengan'; import { rasengan } from 'rasengan/plugin'; export default defineConfig({ prerender: { routes: ['/', 'blog/**'], }, vite: { plugins: [rasengan()], }, });

This approach is ideal for hybrid applications, where:

  • Public pages are statically generated
  • Authenticated or dynamic routes remain rendered via SSR or SPA

So, to upgrade you have to follow the following steps:

[01]Install the target dependency

Run the following command to install the correct version of Rasengan.js

Terminal
bashpnpm add rasengan@~1.2.0
[02]Remove AppRouter from main.tsx file

Get off the AppRouter instance from the main.tsx, because it's not longer important there.

Before

main.tsx
tsximport '@/styles/index.css'; import { type AppProps } from 'rasengan'; import AppRouter from '@/app/app.router'; export default function App({ Component, children }: AppProps) { return <Component router={AppRouter}>{children}</Component>; }

After

main.tsx
tsximport '@/styles/index.css'; import { type AppProps } from 'rasengan'; export default function App({ Component, children }: AppProps) { return <Component>{children}</Component>; }
[03]Move the AppRouter to the index.ts file

Now import the AppRouter instance into the index.ts file

Before

index.ts
tsimport { renderApp } from 'rasengan/client'; import App from './main'; renderApp(App, { reactStrictMode: true });

After

index.ts
tsimport { renderApp } from 'rasengan/client'; import App from './main'; import AppRouter from '@/app/app.router'; renderApp(App, AppRouter, { reactStrictMode: true });
[04]Start the dev server

Then run the dev command to start the local server

Terminal
bashpnpm run dev
Project Structure
Routing - Base Concepts

ON THIS PAGE

Latest Stable version
Latest Beta version
Upgrade from 1.1.x to 1.2.x
Lazy Loaded Routes
SSG (Static Site Generation)
Rasengan Logo
Rasengan Logo

Resources

  • Docs
  • Packages
  • Blog
  • Showcase
  • Support us

Community

  • Github
  • X (Twitter)

Subscribe to the Newsletter

Stay informed to the news about rasengan.js including new releases, events, etc...

© 2024-2026 Rasengan Labs, All rights reserved.