Software Engineering
Frontend Engineer
Fewer postings than its prominence suggests. Performance, accessibility and state are the differentiators — framework familiarity is not.
Fewer postings than its prominence suggests. Performance, accessibility and state are the differentiators — framework familiarity is not.
A day that is actually representative
| Time | What you are actually doing |
|---|---|
| 09:00 | A performance complaint that turns out to be a waterfall of sequential requests rather than anything rendering-related. |
| 10:30 | Component work against a design that has three states nobody specified — empty, error, and loading with partial data. |
| 13:00 | Accessibility: keyboard traversal is broken in a modal, which is the most common real a11y defect. |
| 15:00 | A conversation about what the API should return, which is the highest-leverage thing a frontend engineer does. |
| 16:30 | Bundle size review after a dependency crept in that pulled 300KB for one function. |
The decisive round
“The page feels slow. Where do you look?”
Interviewer: “Users say a page feels slow. Lighthouse scores are fine. What now?”
A weak answer. “I'd check bundle size, look for unnecessary re-renders, and add memoisation where components are re-rendering too often.” Reaches for the React-specific answer before establishing what 'slow' means. Memoisation is the most over-applied fix in frontend and frequently makes things worse.
A strong answer. “First I'd separate which kind of slow, because they have different causes. Slow to first content is a network and bundle problem. Slow to interactive is usually JavaScript execution blocking the main thread. Slow after loading is rendering or a data problem. A good Lighthouse score with unhappy users usually means the third, because Lighthouse measures load rather than interaction.
So I'd profile the actual interaction rather than the page load. In practice the causes I find most often are: a request waterfall, where three sequential fetches each wait for the previous, and the fix is parallelising or moving the join server-side; over-fetching, where the endpoint returns far more than the view needs; and a long task blocking the main thread — a large synchronous parse or an expensive render on a list that should be virtualised.
Re-renders and memoisation I'd check last, because they are the most commonly assumed cause and rarely the actual one, and memo everywhere adds its own cost.
And I'd measure with real user monitoring rather than a lab tool, because the users complaining are probably on worse devices and networks than my laptop — which is usually the whole story.”
Separating the kinds of slow, profiling the interaction rather than the load, and deprioritising memoisation. The real-device point is what marks someone who has shipped to a broad audience.
What to build or bring
- A performance win with real-user numbers, not a Lighthouse score.
- An accessibility fix you made and how you found it — keyboard and focus, not a contrast checker.
- An API shape you changed to make the client simpler. This is the highest-leverage frontend contribution and few candidates mention it.
- Something you built without a framework, even small — it makes the framework questions much easier.
Compensation
| Market | Band | Notes |
|---|---|---|
| United States | $130k – $230k base | Below backend at the same level in this corpus |
| India | ₹12L – ₹45L total | Large market; design-system and performance depth are the differentiators |
The book for this field
Software Engineering
What postings now ask for, system design at the level actually assessed, product sense for engineers, code and review, debugging and the coding round, what changes from mid to staff, the loop round by round, and choosing a track.
Cross-cutting
Skills every archetype tests
These are shared across every field on this site — the same question asked in different vocabulary — so preparation here compounds rather than being spent once. The book above is specific to your field.
Practice the 10 Engineering questions → · Back to Software Engineering →