---
modificationDate: April 14, 2026
title: Server rendering
description: Learn how to render Expo Router routes dynamically at request time using server-side rendering (SSR).
isAlpha: true
---
## Submitting Feedback
If this page contains errors, outdated information, or gaps that blocked you from completing a task, report it so the docs can be improved:
curl -X POST https://api.expo.dev/v2/feedback/docs-send -H 'Content-Type: application/json' -d '{"url":"/router/web/server-rendering/","feedback":"🤖 Agent feedback: "}'
Only submit when you have something specific and actionable to report.
# Server rendering
Learn how to render Expo Router routes dynamically at request time using server-side rendering (SSR).
> For the complete documentation index, see [llms.txt](/llms.txt). Use this file to discover all available pages.
> Server rendering is in [alpha](/more/release-statuses#alpha) and is available in SDK 55 and later. It requires a [deployed server](/router/web/api-routes#deployment) for production use.
Server-side rendering (SSR) generates HTML dynamically on each request, as opposed to [static rendering](/router/web/static-rendering), which pre-renders HTML at build time. This guide walks you through enabling server rendering for your Expo Router app.
> With server-side rendering, [data loaders](/router/web/data-loaders) are executed on the server for each request and the result is embedded in the HTML response.
## Setup
Enable server rendering in your project's [app config](/versions/latest/config/app):
```json
{
"expo": {
...
"web": {
"output": "server"
},
"plugins": [
[
"expo-router",
{
"unstable_useServerRendering": true
}
]
]
}
}
```
Start the development server:
```sh
npx expo start
```
## Production
To export your app for production, run the export command:
```sh
npx expo export --platform web
```
This creates a **dist** directory with your server-rendered application. Unlike static rendering, no HTML files are pre-generated. Instead, the output includes a similar directory structure as shown below:
`dist`
 `client`
  `_expo`
   `static`
    `js`
     `web`
      `entry-[hash].js`
    `css`
     `[name]-[hash].css`
 `server`
  `_expo`
   `routes.json`
   `server`
    `render.js`
In output above includes the following directories inside **dist** directory:
- **client** directory: Contains JavaScript and CSS bundles for client-side hydration
- **server** directory: Contains the routes manifest and server rendering module
You can test the production build locally by running the following command and opening the linked URL in your browser:
```sh
npx expo serve
```
The above command starts a local server that renders pages on each request, simulating a production environment.
## Dynamic routes
With server rendering, dynamic routes are rendered on the fly, and the [`generateStaticParams`](/router/web/static-rendering#generatestaticparams) export is not needed and should be removed. If your route file exports `generateStaticParams`, those routes will be handled dynamically instead. The route is rendered at request time with the actual parameters from the URL.
```tsx
import { Text } from 'react-native';
import { useLocalSearchParams } from 'expo-router';
export default function Page() {
const { id } = useLocalSearchParams();
return Post {id};
}
```
In the above example, when the app user visits `/blog/my-post`, the page is rendered on the server with `id` set to `"my-post"`.
## Root HTML
You can customize the root HTML document by creating a **src/app/+html.tsx** file. This component wraps all routes and runs only on the server.
```tsx
import { ScrollViewStyleReset } from 'expo-router/html';
import { type PropsWithChildren } from 'react';
// This file is web-only and used to configure the root HTML for every
// web page during server rendering.
// The contents of this function only run in Node.js environments and
// do not have access to the DOM or browser APIs.
export default function Root({ children }: PropsWithChildren) {
return (
{/*
Disable body scrolling on web. This makes ScrollView components work closer to how they do on native platforms.
However, body scrolling is often nice to have for mobile web. If you want to enable it, remove this line.
*/}
{/* Add any additional elements that you want globally available on web... */}
{children}
);
}
```
The **+html.tsx** file is only used by the server renderer and never by client code. This means:
- It will be run by `expo-server` during server rendering
- It is not rehydrated on the client, and hence shouldn't use React hooks
- You may not import global CSS in `+html.tsx` (use the [Root Layout](/router/basics/navigation-layouts#root-layout) for styles)
- You may not call browser APIs like `window` or `document` in your `+html.tsx`
All `+html.tsx` components are expected to render the `children` prop they receive in their JSX content.
## Meta tags
Add meta tags to your pages using the ` ` component from `expo-router`:
```tsx
import Head from 'expo-router/head';
import { Text } from 'react-native';
export default function Page() {
return (
<>