Next.js Discord

Discord Forum

Lazy loading server components

Unanswered
Simon Knittel 🍹 posted this in #help-forum
Open in Discord
Is it possible to lazy load server components? I'm having a modal with data from the database. The common way of loading data into the modal would be either
A) Do a client-side request to an API/Route handler (via tRPC, SWR, fetch or similar) the moment the modal opens
B) Pass the data from the server component into the client component on page load
I wonder if you can somehow have a server component (modal content) get lazily requested/rendered via a client component (modal itself).

2 Replies

Vespid wasp
I have the same question
Siberian Flycatcher
Hi. Try putting the modal state in the URL. Then conditionally render the modal based on params or searchParams. This way, you will only load modal data when it's needed.