Static Rendering
Next.js App Router supports Static Rendering (opens in a new tab), meaning your pages will be rendered at build time and can then be served statically from CDNs, resulting in faster TTFB.
Static Rendering
Export getStaticParams
from createI18nServer
:
// locales/server.ts
export const {
getStaticParams,
...
} = createI18nServer({
...
})
Inside all pages that you want to be statically rendered, call this setStaticParamsLocale
function by giving it the locale
page param:
// app/[locale]/page.tsx and any other page
import { setStaticParamsLocale } from 'next-international/server'
export default function Page({ params: { locale } }: { params: { locale: string } }) {
setStaticParamsLocale(locale)
return (
...
)
}
And export a new generateStaticParams
function. If all your pages should be rendered statically, you can also move this to the root layout:
// app/[locale]/page.tsx and any other page, or in the root layout
import { getStaticParams } from '../../locales/server'
export function generateStaticParams() {
return getStaticParams()
}
Static Export with output: 'export'
You can also export your Next.js application to be completely static using output: 'export'
(opens in a new tab) inside your next.config.js
. Note that this will disable many features (opens in a new tab) of Next.js