React & Next.js
Rendering, hooks, state ownership, performance, and server boundaries.
Props vs state: what is the difference?
Props are values a parent supplies to a component, while state is data React remembers for a component across renders. Both influence the UI, but a component should not change its received props directly. State updates request a new render so the screen can reflect the new data.
What causes a re-render? Does it always change the DOM?
Rendering means React calls components to calculate the next UI description. Committing is the later step where React applies needed changes to the host environment, such as the browser DOM. A component can render again without causing any DOM change if the calculated output is effectively the same.
What are reconciliation, Fiber and keys?
Reconciliation is how React matches elements from the previous and next render to decide what to keep, update or replace. Fiber is the internal representation that helps React organize that work. Keys supply identity among siblings, allowing React to preserve the right state as a list changes.
Controlled vs uncontrolled input?
A controlled input takes its displayed value from React state, with changes flowing through an event handler. An uncontrolled input keeps its current value in the DOM until the application reads it. Controlled inputs make coordinated validation and UI changes convenient, while uncontrolled inputs can keep simple forms less state-heavy.
Why should I use a functional state update?
A functional state update supplies a function that receives the pending previous state and returns the next state. It is useful when several updates may be queued or a callback holds an older render's value. React can apply these updater functions in order without each relying on the same captured value.
Difficulty is an editorial estimate. Completion means you chose to mark a question as understood.