TRADEOFF BATTLES
Practice the interview questions where reasoning matters more than a single right answer
AI can help with syntax and boilerplate, but interviews still test whether you understand system behavior, constraints, and tradeoffs. These battles train you to pick a direction, defend it under pushback, and compare your reasoning with a stronger interview answer.
Not started
Object vs Map for keyed JavaScript collections
A dashboard keeps adding, removing, counting, and iterating items by id. Would you store that data in a plain object or a Map?
Not started
Promise.all vs sequential awaits in JavaScript
A page needs several independent requests before it can render. Would you run them with Promise.all or await them one by one?
Not started
Props drilling vs Context for shared React UI state
Theme, current user, and permissions are needed in several deep React components. Would you keep passing props or introduce Context?
Not started
useState vs useReducer for growing React component state
A React settings panel started simple, then gained validation, loading, error, reset, and success flows. Would you keep useState or move to useReducer?
Not started
Async pipe vs manual subscribe for Angular UI data
An Angular page needs to show live user data, loading states, and refreshed values from Observables. Would you bind with the async pipe or subscribe manually in the component?
Not started
Props and emits vs provide and inject for Vue component communication
A Vue page has nested UI wrappers and deep child components that need shared context and user actions. Would you use props and emits or switch to provide and inject?
Not started
SSE vs WebSocket for a live operations dashboard
A support dashboard needs live status updates, but most user actions are still normal HTTP writes. Which transport would you defend in an interview?
Not started
Context vs Zustand vs Redux for a growing React dashboard
You need shared state for filters, optimistic updates, background refetches, and multiple teams. Which state approach would you defend in an interview?
Not started
Reactive forms vs template-driven forms for a growing Angular workflow
A small signup form turned into a dynamic multi-step workflow with validation rules, saved drafts, and tests. Which form approach would you defend?
Not started
watch vs watchEffect for Vue reactive side effects
A Vue feature triggers side effects from several reactive inputs and needs cleanup for stale work. Would you use watch or watchEffect?
Not started
localStorage vs sessionStorage for browser persistence
A web app needs to remember some client-side UI state. Would you persist it in localStorage or sessionStorage?
Not started
Mutation vs immutable copy for shared JavaScript state
A UI updates nested client-side state and also needs undo, predictable re-renders, and easy debugging. Would you mutate existing objects or create immutable copies?
Not started
setTimeout vs requestAnimationFrame for UI updates
A browser UI needs smooth visual updates while the user drags and scrolls. Would you schedule that work with setTimeout or requestAnimationFrame?
Not started
Controlled vs uncontrolled inputs in React forms
A React form now needs instant validation, disabled submit rules, formatted input, and reset behavior. Would you keep inputs controlled or let the DOM manage them?
Not started
Derive in render vs store derived state in React
A React filter panel needs visible results, a count badge, and a disabled Apply button. Would you compute these from current state or store them separately?
Not started
Lift state up vs keep state local in React
A filter drawer, results header, and product grid now need to reflect the same selection state. Would you lift state up or keep it local in each component?
Not started
useEffect vs event-handler logic in React
A React save flow needs a request, success toast, analytics event, and modal close after the user clicks Save. Would you run that logic in useEffect or keep it in the event handler?
Not started
@Input/@Output vs shared service for Angular component communication
An Angular page has a parent container and a few child UI components that need to send user actions upward and receive current state downward. Would you use @Input/@Output or a shared service?
Not started
Pure pipe vs component method in an Angular template
An Angular list template needs to format and derive display values for many rows. Would you use a pure pipe or call a component method from the template?
Not started
Route resolver vs fetch in ngOnInit for Angular page data
An Angular route needs page data before rendering some parts of the screen. Would you load it with a resolver or fetch it in ngOnInit?
Not started
Computed vs method in a Vue template for derived UI
A Vue template needs derived values like filtered rows, counts, and summary text from reactive state. Would you use computed properties or call methods in the template?
Not started
ref vs reactive for Vue state shape
A Vue component manages several related form and filter fields. Would you keep each value in its own ref or group them in a reactive object?
Not started
v-if vs v-show for Vue visibility toggles
A Vue screen hides and shows UI sections based on user interaction. Would you use v-if or v-show?
Not started
Debounce vs throttle for a live search box
A search input should feel responsive without spamming requests on every keypress. Which timing strategy would you defend in an interview?
Not started
Event delegation vs direct listeners for a dynamic action list
A list keeps adding, removing, and reordering rows with action buttons. Which event binding strategy would you defend in an interview?
Not started
Feature service state vs NgRx Store for a shared Angular workbench
Several Angular screens now share filters, selections, optimistic actions, and restore-on-navigation behavior. Which state approach would you defend?
Not started
Computed vs watch for a filterable Vue catalog
A Vue catalog page needs filtered results, a count badge, and a URL-sync side effect. Which approach would you defend for derived UI state?
Not started
Local component state vs extracted composable for Vue feature logic
A Vue feature has search, selection, sorting, loading, and retry logic. Would you keep that state inside the component or extract it into a composable?
Not started
Props and emits vs v-model for a Vue custom input API
A Vue custom form component needs to send value changes back to its parent. Would you design it around explicit props and emits or expose a v-model API?
Not started
Web Worker vs main thread for heavy browser compute
A browser app parses large local data, builds a search index, and recomputes facets while the UI must stay responsive. Would you keep that work on the main thread or move it to a Web Worker?
Not started
CSR vs SSR vs RSC for a React product experience
A React commerce page needs SEO, fast first render, large product data, faceted filters, and client-side interactions. Would you defend CSR, SSR, or RSC?
Not started
Feature service with signals or RxJS vs NgRx Store for a large Angular product surface
A multi-screen Angular product surface has optimistic updates, websocket refreshes, draft restore, route re-entry, and several teams touching the same state graph. Would you keep state in a feature service with signals or RxJS, or move the core shared state into NgRx Store?
Not started
Composable vs Pinia store for a shared Vue product surface
A multi-screen Vue product surface has optimistic updates, background refreshes, draft restore, and several teams touching the same shared state graph. Would you keep the core logic in composables or move it into a Pinia store?