Questions
3 of 33
1Explain server-side rendering (SSR) in Next.js.
2List the benefits of Server-Side Rendering in Next.js.
3What are server components?
4How to use server components in next js?
5What is the React Server Component Payload (RSC)?
6Describe how server components are rendered.
7Describe server rendering strategies
8How can you keep Server-only Code out of the Client Environment
9What are the issues of using context provider at the root of the application?
10List dynamic functions available to server components.
11List all Dynamic APIs.
12How do we opt for Static Rendering, Dynamic Rendering and Streaming?
13Explain the difference between SSR, SSG, ISR, and CSR in Next.js. When would you choose each?
14How does getServerSideProps work internally? What is its execution context?
15What are the performance trade-offs of SSR vs SSG in a high-traffic production app?
16How does Next.js handle hydration? What is a hydration mismatch, and how do you debug it?
17What happens when getServerSideProps throws an error? How do you handle it gracefully?
18How would you architect a Next.js app that needs both personalised (SSR) and cacheable (SSG) pages at scale?
19Explain the App Router vs Pages Router SSR model differences. How does React Server Components change the SSR paradigm?
20How do React Server Components (RSC) differ from traditional SSR? Can they be used together?
21How does streaming SSR work in Next.js 13+? What role does Suspense play?
22How would you implement partial hydration or Islands Architecture in Next.js?
23Explain how Next.js handles data fetching waterfall problems in SSR and how you'd mitigate them.
24How would you implement partial hydration or Islands Architecture in Next.js?
25How do you implement caching strategies for SSR responses in Next.js? (CDN, Cache-Control, stale-while-revalidate)
26How would you reduce TTFB (Time to First Byte) in an SSR-heavy Next.js app?
27What's the difference between fetch caching in the App Router vs traditional getServerSideProps?
28How do you avoid redundant database/API calls across multiple server components on the same page?
29How do you securely handle authentication in SSR? What are the risks of passing tokens via cookies vs headers?
30How do you prevent sensitive server-side data from leaking to the client bundle?
31How would you implement role-based rendering on the server without exposing protected routes to the client?
32How do you debug SSR-only issues that don't appear in local development?
33How can we control dynamic rendering behaviour in next js?
nextjsnextjs
Basics
Project Structure
Runtime
Compiler
SSG
SSR
CSR
Routing
Route Handlers
Route Groups
Dynamic Routes
Parallel Routes
Intercepting Routes
Middleware
Server Actions
APIS
Data Fetching
Caching
Clients
Optimisation
i18n
Security
Architecture
Deployment
Accessibility
03 / 33

What are server components?

Difficulty: 5/10
server components, data fetching, rendering

Server Components allow developers to better leverage server infrastructure. For example, you can move data fetching to the server, closer to your database, and keep large dependencies that previously would impact the client JavaScript bundle size on the server, leading to improved performance.

React Server Components allow you to write UI that can be rendered and optionally cached on the server. In Next.js, the rendering work is further split by route segments to enable streaming and partial rendering, and there are three different server rendering strategies:
  1. 1

    Static Rendering

  2. 2

    Dynamic Rendering

  3. 3

    Streaming

Scenario Questions

0-2 years experience

  1. 1You need to display a list of products that comes from an internal API and you don't want the API key exposed to the browser. How would you implement this using Next.js Server Components?
  2. 2If you add a console.log inside a Server Component and it never appears in the browser console, where would you look for the output and why?

2-5 years experience

  1. 1During a feature rollout, a page that uses a Server Component suddenly shows a 500 error only in production. What steps would you take to debug the issue?
  2. 2You have a page that mixes Server and Client Components. The client component needs data fetched in the server component. How would you pass that data without violating the Server Component constraints?

5-8 years experience

  1. 1Our team is considering moving a heavy data‑processing component from the client to a Server Component to improve performance. What trade‑offs should you evaluate regarding latency, caching, and SEO?
  2. 2Explain how you would design a fallback strategy for a Server Component that depends on an external API which may time out, ensuring the page still renders gracefully.

8+ years experience

  1. 1We have a legacy monolith that renders most UI on the client. How would you plan a phased migration to Next.js Server Components across multiple squads while minimizing disruption?
  2. 2At scale, what architectural considerations arise when many pages rely on Server Components that perform expensive database queries, and how would you mitigate potential bottlenecks?

Follow-up Questions

  • How does using a Server Component affect the size of the client bundle?
  • What happens if you accidentally import a client‑only hook inside a Server Component?
  • Can you mix Server and Client Components in the same page, and how?
Share

Share via WhatsApp, X, Facebook, LinkedIn or copy link. Open Graph preview enabled.