Next.js 15 RSC pattern thực chiến: 3 sai lầm thường gặp
Đừng "use client" cả page chỉ vì 1 button cần state. Server Action không phải REST API. force-dynamic là code smell, không phải fix.
Sai lầm 1: "use client" toàn page
Thấy nhiều dev khi cần 1 component có useState thì gắn 'use client' lên cả page. Hậu quả: bundle JS x3, mất SSR streaming, mất RSC benefits.
Đúng: chỉ component nào CẦN client (interaction, state, browser API) mới mark client. Server component bao ngoài, client component nested vào những chỗ tương tác.
Sai lầm 2: Server Action như REST API
Server Action là RPC, không phải REST. Đừng:
- Return raw JSON cho fetch
- Tự design URL (Next quản lý)
- Dùng cho public API
Dùng Server Action chỉ cho mutation từ form/button do user trigger. Public API → Route Handler.
Sai lầm 3: Lạm dụng force-dynamic
Mỗi khi gặp lỗi build, dev hay add export const dynamic = 'force-dynamic'. Đó là band-aid, không phải fix.
force-dynamic = mọi request render lại từ đầu. Mất hết caching benefit.
Đúng: dùng unstable_cache + revalidateTag + revalidate time-based. Chỉ force-dynamic khi page THỰC SỰ phải render mới mỗi request (vd dashboard analytics live).
Bonus: notFound() trong force-dynamic
Có bug Next 15: notFound() trong page với force-dynamic return HTTP 200 thay vì 404. Nếu gặp, bỏ force-dynamic + dùng thay thế.