Next.js Discord

Discord Forum

Partial re-render on querying a page with a paginated dynamic component

Unanswered
Havana posted this in #help-forum
Open in Discord
HavanaOP
Hello, I wanted to ask about a partial pre-rendering pattern
when we deal with a paginated dynamic component and querying. Can we refresh dynamic part like this?
Would static part be not re-fetched?
async function OurDynamicItem({
    searchParams,
}:{
    searchParams: { [key: string]: string | string[] | undefined }
}){
    const our_hooked_search_param = searchParams["cats"];
    const our_items_data = await ourPaginatedDataMethod(our_hooked_search_param);
    return (
        <>
            </OurDataServerTranspiler
                our_transpilers_props={our_items_data}
            >
            </OurPaginatedComponentNavigationInterface>
        </>
    );
}

function Page() {
    return (
        <OurPage>
            <OurStaticItem/>
            <Suspense fallback={<OurDynamicItemSceleton/>}>
                </OurDynamicItem>
            </Suspense>
        </OurPage>
    )
}

let's say we open /cats?cats=1
can we only refresh our dynamic component by navigating /cats?cats=2

7 Replies

HavanaOP
Ah an also, the dynamic item, of course, have a default value, to be pre-generated
aardani
Isnt this too early to be trying out partial pre-render?
jokes aside, i get that the code is a pseudocode rather than a real code,
i think the searchParams still needs to come from Page() and ideally that would still be prerendered and the shell be statically generated
thats just based on my speculation only
you might want to post over at Github discussion/issue to get real answer from Vercel Staff 👍
@aardani Isnt this too early to be trying out partial pre-render? jokes aside, i get that the code is a pseudocode rather than a real code, i think the searchParams still needs to come from Page() and ideally that would still be prerendered and the shell be statically generated
HavanaOP
Ah nice, I appreciate a response
Well it is a good point that searchParams must come from a Page() rather than it's part
And well, then if we use searchParams, then page would be dynamically generated as I understand
one way, we can use layout and a parallel route. Then also instead of suspense, loading.tsx
|-
-layout.tsx
-@OurDynamicItem/
  |-
    -page.tsx
    -loading.tsx
-page.tsx
aardani
then if we use searchParams, then page would be dynamically generated as I understand
True, for now. But theres no telling that that might change in the future :))
Since you are talking about preview feature, i should be able to speculate what might change later :p
HavanaOP
function Layout({
  childer,
  OurDynamicItem
}) {
  return (
    <OurPage>
      {children} <-- static
      {OurDynamicItem} <-- dynamic with one default static item
    </OurPage>
  )
}