Implement Full-text search dashboard in nextjs with server Components
Unanswered
mta posted this in #help-forum
mtaOP
Hey guys,
I am building a dashboard that requires fast full-text search capabilities (filtering, scoring, and real-time matching). I'm planning to connect the Next.js frontend to a backend utilizing Elasticsearch.
For the UI, should I fetch data directly via Server Components using searchParams, or is it better to use client-side fetching with debouncing for a smoother dashboard experience? Any tips on optimizing layout shifts and loading states for data-heavy search dashboards?
I am building a dashboard that requires fast full-text search capabilities (filtering, scoring, and real-time matching). I'm planning to connect the Next.js frontend to a backend utilizing Elasticsearch.
For the UI, should I fetch data directly via Server Components using searchParams, or is it better to use client-side fetching with debouncing for a smoother dashboard experience? Any tips on optimizing layout shifts and loading states for data-heavy search dashboards?
2 Replies
mtaOP
@Siberian
@mta Hey guys,
I am building a dashboard that requires fast full-text search capabilities (filtering, scoring, and real-time matching). I'm planning to connect the Next.js frontend to a backend utilizing Elasticsearch.
For the UI, should I fetch data directly via Server Components using searchParams, or is it better to use client-side fetching with debouncing for a smoother dashboard experience? Any tips on optimizing layout shifts and loading states for data-heavy search dashboards?
both ways are fine. I like to do a combination of it:
- filtering/searching/... via client component and
- initial data from server component.
- filtering/searching/... via client component and
- initial data from server component.
nuqs helps to keep an eye on the searchParams and like that it works pretty nicely - without layout shifts ^^