Next.js Discord

Discord Forum

Next 13 layout file: dynamic or static?

Unanswered
Oriental Scops-Owl posted this in #help-forum
Open in Discord
Oriental Scops-OwlOP
If i built an app with Next 13 using the app folder, and had my header component inside of a layout.ts module (root app level), would the page content still be static if the header is dynamic?

i am trying to cache only parts of my application (the main content), and not the header.

would this be possible with Next 13 ?

14 Replies

Giant panda
I'm guessing the header component is a client component?
A route is either dynamically rendered or statically rendered
So if page is dynamic and layout is static, then route becomes dynamic.

If page static and layout dynamic, route becomes dynamic

If page static and layout static, then route becomes static
Oriental Scops-OwlOP
@alfon gotcha.. yeah i have a next 11 app right now with redux. i have a top header bar with dynamic content i need to load after the cached page is served with getStaticProps... any suggestions? everything keeps pointing me back to SWR which might would work if i had access to redux state inside of an /api route
i just need to somehow render the one part of the page (the header) with the user information after the cached page is served.
As in, i can see that many people can use redux with nextjs but i cant provide further detail on how to do it since i do not have experience with the 'pages' dir.

However i believe what ure trying to do is possible aha
Balinese
@alfon will dynamic imports be supported inside of layout that is being used for server side rendering? I would like todo this. Should I just move the dynamic import into the page file that is being used serverside or would that also not work? I am upgrading my code base to use next 13.4.*
@alfon idk why you need dynamic imports in server components
Balinese
well I am serverside rendering company/information for many companies then I want to load a user specific component for list of companies. The companyList component allows the user to run crud operations on a list of companies and allows them to navigate the company/information pre rendered pages.
sooo i dont get which part needs a dynamic import
please open up a new post thread since its not related to the original thread