#Subpage gets rendered/executed on the server even if the root layout does not render any children.

4 messages · Page 1 of 1 (latest)

fallow tundra
#

I have a Layout on / , I also have a page at /some-other-route.
My layout has a blocker for unauthenticated users. So if authentication is not given the Layout renders a LoginPage and does not render or include the children at all.

However, I just realised that when I navigate to /some-other-route my page.tsx under /some-other-route actually executes on the server (console logs, executes fetches), even if my RootLayout does not render the children at all.

Why is that?
Does Next.js render from bottom to top or from top to bottom?
Are there common practices for stuff like that? I don't want my subpage to execute on the server if it is not being rendered.

// Layout at /
const Layout = (props) => {
     return (<div>This is a totally empty layout without any children</div>)
}
export default Layout

// page at /some-other-route
const Page = (props) => {
     console.log("This message gets actually logged on the server")
     return (<div>This does not get rendered but still executes on the server when navigating to /some-other-route</div>)
}
export default Page
flat pebbleBOT
#

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

empty stone
fallow tundra