Questions
3 of 6
Basics
JSX
Virtual DOM
Reconciliation
State and Props
Components
Class Components
Function Components
Lifecycle functions
Code Sharing
Hooks
useState
useReducer
useMemo
useContext
useCallback
useEffect
Custom Hooks
New Hooks
HOC
Refs
Data Sharing
Events
Context API
Redux
Router
CSR-SSR
React APIs
Performance Optimisation
ReactDOM
Strict Mode
Security
What are Server Functions?
Difficulty: 5/10
data fetching, security, performance
Server Functions allow Client Components to call async functions executed on the server.
- 1
When a Server Functions is defined with the 'use server' directive, your framework will automatically create a reference to the server function, and pass that reference to the Client Component. When that function is called on the client, React will send a request to the server to execute the function, and return the result.
- 2
Server Functions can be created in Server Components and passed as props to Client Components, or they can be imported and used in Client Components.
Server Components can define Server Functions with the 'use server' directive:
When React renders the EmptyNote Server Function, it will create a reference to the createNoteAction function, and pass that reference to the Button Client Component. When the button is clicked, React will send a request to the server to execute the createNoteAction function with the reference provided:
Scenario Questions
0-2 years experience
- 1How would you call a server function from a client component to submit a simple contact form?
- 2What happens if you try to use window.localStorage inside a server function?
- 3If a server function throws an error, how does React surface that error to the user?
2-5 years experience
- 1You added a server function to fetch user profile data, but the component re‑renders on every keystroke in a search box. Why might that be happening?
- 2Explain the trade‑offs of storing an auth token in a server function versus keeping it in client‑side state.
- 3During debugging you notice a server function’s code appears in the client bundle. What could cause that and how would you fix it?
5-8 years experience
- 1Design a pattern for handling paginated data using server functions while keeping the UI responsive.
- 2How would you mitigate latency when a page needs to call dozens of server functions during initial load?
- 3What security considerations do you need to address when exposing a server function that accepts user‑provided filters?
8+ years experience
- 1If your organization is migrating a large codebase from client‑side data fetching to server functions, what architectural changes and cross‑team coordination would you plan?
- 2How would you evaluate the impact of server functions on edge CDN caching and overall infrastructure cost?
- 3What guidelines would you establish to decide when to keep logic client‑side versus moving it to server functions across multiple products?
Follow-up Questions
- What steps would you take to debug a server function that isn’t returning expected data?
- How would you measure the latency impact of a server function call?
- Can you think of a scenario where keeping the logic client‑side would be preferable?