Nextjs app router server action performance
Unanswered
bscdev#1145 posted this in #help-forum
Hello Everyone, I would like to know in detail does a nextjs server action method could handle large numbers of requests (heavy traffic).
For example, I have an ecommerce application built with nextjs server actions. In home page all products are displayed with pagination(10 products each page and total 10 pages are there) and products are fetched from database via server action function. Does this function will perform well during heavy traffic.
I am asking this question because load test(20 concurrent requests and 200 requests) results a bit high latency (mean latency: 1108.4 ms and total time 14.185 s)for home page. If i increase requests then load test terminates immediately by its own. However I am fetching only 100 products in the homepage. So do I need to segregate nodejs backend ? Please advise.
For example, I have an ecommerce application built with nextjs server actions. In home page all products are displayed with pagination(10 products each page and total 10 pages are there) and products are fetched from database via server action function. Does this function will perform well during heavy traffic.
I am asking this question because load test(20 concurrent requests and 200 requests) results a bit high latency (mean latency: 1108.4 ms and total time 14.185 s)for home page. If i increase requests then load test terminates immediately by its own. However I am fetching only 100 products in the homepage. So do I need to segregate nodejs backend ? Please advise.
14 Replies
@bscdev#1145 Hello Everyone, I would like to know in detail does a nextjs server action method could handle large numbers of requests (heavy traffic).
For example, I have an ecommerce application built with nextjs server actions. In home page all products are displayed with pagination(10 products each page and total 10 pages are there) and products are fetched from database via server action function. Does this function will perform well during heavy traffic.
I am asking this question because load test(20 concurrent requests and 200 requests) results a bit high latency (mean latency: 1108.4 ms and total time 14.185 s)for home page. If i increase requests then load test terminates immediately by its own. However I am fetching only 100 products in the homepage. So do I need to segregate nodejs backend ? Please advise.
Do not fetch data with server actions. Why? Server actions are queued and run sequentially, you can’t run them in parallel.
But if you use server actions for mutation (as it should be used), there is no significant difference in terms of performance between server actions and traditional route handlers.
But if you use server actions for mutation (as it should be used), there is no significant difference in terms of performance between server actions and traditional route handlers.
@joulev Thanks for your reply. How do you recommend to fetch data in nextjs?. May I fetch data in a server component from database direcily like below or I have to use api route to fetch data from database.
const blogs= await Blog.find() What about in creating or updating datas using POST, PATCH method, can I use server actions for them? Please advise.@bscdev#1145 <@484037068239142956> Thanks for your reply. How do you recommend to fetch data in nextjs?. May I fetch data in a server component from database direcily like below or I have to use api route to fetch data from database. `const blogs= await Blog.find()` What about in creating or updating datas using POST, PATCH method, can I use server actions for them? Please advise.
for data fetching you can use server side fetching or client side fetching.
server side fetching with server components
client side fetching with api routes + swr/rq
mutations should use server actions.
server side fetching with server components
client side fetching with api routes + swr/rq
mutations should use server actions.
In Both options which one is powerful 1.server side fetching with server components
2.client side fetching with api routes + swr/rq
2.client side fetching with api routes + swr/rq
@joulev Thank you so much for your advise. I will follow your recommendations.
I believe fetching in server components is better as it would also automatically handle caching
@Riday 💙 Thank you for your reply. I have one last query , usually fetching in server component instantly displays data. How should we handle loading or if data is not available. In client side showing loading is very easy using react query or sw. But for a server component, is it a good practice to fetch data using react prefetchQuery over there and then pass data to child components using HydrationBoundary(it provides loading , error ,data in child components) OR simply fetching in server component is much faster. What you recommend.
@bscdev#1145 <@477719130099941378> Thank you for your reply. I have one last query , usually fetching in server component instantly displays data. How should we handle loading or if data is not available. In client side showing loading is very easy using react query or sw. But for a server component, is it a good practice to fetch data using react prefetchQuery over there and then pass data to child components using HydrationBoundary(it provides loading , error ,data in child components) OR simply fetching in server component is much faster. What you recommend.
Check this - https://app-router.vercel.app/streaming
You can check the code and docs to see how it works
@Riday 💙 Thanks for your Help and Support. I really appreciate you. I will follow your recommendations. Thank again.
@Riday 💙 One last help. Where do I find code to see how they have implemented. https://app-router.vercel.app/streaming/node/product/1
Click on home in that section and you'll get docs / code
@Riday 💙 Thank you.