I have also tried both vercel and amplify

once the user clicks on /about for example in nav

there is a few second delay

then the page loads

then every page after that is instant

where as before with pages router, all pages would be instant

maybe im missing something

upon looking at the network tab it looks like the delay is loading in the pages with ?rsc=xxxx

for the first time

do you have any fetching in root layout?

yeah for the nav & footer, should i move the fetching them into seperate client components?

//=================================================
//F E T C H N A V D A T A
const fetchNavData = await fetch(
${process.env.NEXT_PUBLIC_BACKEND_URL}/wp-json/menus/v1/menus/main
);

const navData = await fetchNavData.json();
//=================================================

//=================================================
//F E T C H O P T I O N S D A T A
const fetchOptionsData = await fetch(
${process.env.NEXT_PUBLIC_BACKEND_URL}/wp-json/options/v1/all
);

const optionsData = await fetchOptionsData.json();

//=================================================

i have these two in the layout, passing the props to the nav and footer component wrapping the children

are the nav and footer server or client component?

they are currently server

try moving the fetch to the component and wrap it with Suspense

so it doesn't block the request until the fetching finish

Thanks for your help

it turns out you can't statically generate dynamic content within the layout

what i had to do was move my nav & footer into my [page].js and wrapped the pagebuilder, this fixed my issue and made the nav and footer static with isr