I am wondering what is the best and recommended way to fetch data after the initial render.

For example, a search, pagination, and other related uses cases.

The approach suggested on the new NextJS Learn page is modify the search params, this will trigger a server side rendering of the component.

The problem I see here is that request will fetch all the output of the rendered page, while with an api call we could return only a json of the documents needed.

Is this overhead of data not relevant? What about large pages?

What is the recommended approach and where is heading the community on this?

Thanks