What are Fragments and why use them?
Quick answer
Fragments (<>…</>) group multiple elements without adding an extra DOM node like a wrapper <div>.
In detail
A component must return a single root. Wrapping siblings in a <div> works but pollutes the DOM and can break CSS (fl/grid layouts, tables). A Fragment groups children with no extra element. Use the long form <React.Fragment key={id}> when you need a key, e.g. in lists.
1function Row() {
2 return (
3 <>
4 <td>Name</td>
5 <td>Email</td>
6 </>
7 ); // no wrapper <div> breaking the <tr>
8}Why interviewers ask this: Tests practical knowledge of clean markup.
This is 1 of 118+ questions in the React Interview Kit
Get every question with detailed answers, follow-ups and real code — plus coding challenges and a last-minute revision sheet. One-time payment, instant access.
⚡ Get the React Interview Kit → ₹399