Intermediate everything in Frontend Dev, page 7
What deep selector pierces Vue scoped styles, and why use it cautiously?
This tests Vue scoped CSS encapsulation. Use :deep() to target child internals from a scoped block, but it breaks encapsulation and creates brittle coupling. A red flag is recommending deprecated /deep/ or unscoped global styles.
Compare Angular's three ViewEncapsulation modes and give a use case.
This tests style isolation tradeoffs. Emulated scopes CSS with unique attributes, ShadowDom uses native shadow roots, and None disables scoping. Switch to ShadowDom for strict boundaries or None for global themes.
How do Svelte Stores work and how do you create custom ones?
Tests Svelte store contract mastery. A strong answer defines the subscribe/unsubscribe interface, wraps writable() with custom set/update logic, subscribes via $ prefix or manually, and uses $store in templates.
Fundamental difference between Vue computed and watcher with examples
Tests derived state vs side effects in Vue reactivity. Computed returns cached derived value; watch executes callback on mutation. Example: computed filters list; watch fetches data when ID changes. Red flag: watch for template state or computed for async.
Explain Angular default change detection, zone.js, and OnPush
Deep knowledge of Angular's automatic vs explicit change detection. Explain zone.js monkey-patching async APIs to trigger default checks; contrast with OnPush requiring immutable inputs, async pipe, or markForCheck.
What's the difference between Angular property and attribute binding?
Tests whether you know Angular binds to DOM properties by default. [disabled] sets a DOM property; [attr.role] sets an HTML attribute. Use attribute binding when no DOM property exists, such as SVG attributes or role. Red flag: claiming they are equivalent.
Why does todos.push miss Svelte updates but spread works?
Tests compile-time versus runtime reactivity. Answer: Svelte's compiler instruments assignments, not method calls, so push is invisible; Vue Proxies and Angular Zone.js both intercept push to trigger updates.
How do you pass markup from a parent to a child component?
This tests declarative composition for UI reuse. A strong answer covers default and named slot syntax in Vue/Svelte (slot outlet, v-slot) or Angular ng-content with select for named projection.
Explain key or trackBy in list rendering and index key risks
Your understanding of virtual DOM reconciliation and stable element identity. A good answer covers that key binds DOM state to data identity, and that index keys break reordering by recycling wrong components.
Compare multiple boolean props versus a single status string prop
Booleans let callers pass conflicting flags like isLoading plus isError, leaking implementation priority; a single status enum makes invalid states unrepresentable.
What bindings do v-model and ngModel sugar, and why?
V-model sugars value and input; ngModel sugars [value] and (ngModelChange). This enforces one-way data flow for predictable state.
What is a SvelteKit adapter and how do adapter-static and adapter-node differ?
Tests your grasp of SvelteKit's deployment abstraction. A strong answer outlines how adapters compile the app for a target platform, contrasting adapter-static's CDN-ready HTML with adapter-node's server-side request handler for Node environments.
Describe two key Angular CLI production build optimizations
Tests whether you know architect targets and concrete production optimizations. Strong answers name two of: dead code elimination and minification, hashed filenames for cache busting, or disabled source maps.
Explain Vite dependency pre-bundling, startup speed, and CommonJS handling
This tests whether you understand Vite's ESM-first dev server constraints. Pre-bundling converts CJS/UMD to ESM and collapses multi-file ESM deps into single modules to stop 600+ request waterfalls.
How do you configure Angular CLI dev server proxying?
Tests Angular CLI proxying to bypass CORS locally. Good answer: create proxy.conf.json with target and path, register it in angular.json serve options as proxyConfig, then restart ng serve.
How does Svelte update the DOM without a Virtual DOM?
This tests compile-time versus runtime framework architecture. A strong answer says Svelte compiles components into imperative JS that surgically updates the DOM when reactive state changes. A red flag is claiming it uses a hidden VDOM or dirty checking.
Why is DI central to Angular architecture versus Vue's module system?
Tests architectural grasp of inversion of control. Angular DI enables hierarchical injectors, tree-shakable providers, and runtime substitution without direct imports unlike Vue modules. Red flag: calling DI mere convenience or claiming Vue matches Angular DI.
Compare and contrast Vue 3 and Svelte reactivity systems
Tests runtime versus compile-time trade-offs. Contrast Vue 3 Proxy interception with Svelte compile-time assignment transforms. Vue tracks dependencies dynamically during effects; Svelte resolves them at build. Red flag: claiming both use runtime Proxies.
Virtual DOM Diffing: Minimal DOM Surgery
Virtual DOM diffing finds the smallest real DOM ops to sync a lightweight tree with new state. Frameworks batch rapid UI changes instead of repainting everything. The footgun is treating the diff as free; missing keys in lists force expensive reconciliation.
Angular JIT: Runtime Template Compilation
Angular JIT ships the compiler to the browser and builds components on the fly. It speeds up development rebuilds but pushes compilation cost to runtime. The footgun is deploying it to production, bloating bundles and hiding template errors until runtime.
We are hiring for this. Every open role lists the topics its interview covers, so you can prepare for the real thing rather than guessing.
See open roles