Frontend Engineer OOPS Concepts Interview Guide

Choose composition when the relationship is about using a capability rather than being substitutable for the base type. Delegate behind a small interface and keep invariants local. Inheritance can be appropriate, but test that derived behavior honors the expectations of callers using the base abstraction.

Check your understanding: Replace the implementation behind an interface and run the same contract tests.

Common trap: Using inheritance only to avoid copying a few lines.

Concept reference: Dev.java: language, collections and JVM learning paths

Not necessarily. Encapsulation protects meaningful invariants and exposes valid operations, rather than merely making fields private. Model state transitions so callers cannot construct invalid combinations, and keep representation details from leaking through mutable references.

Check your understanding: Attempt an invalid transition through the public API.

Common trap: Equating private fields with a complete domain model.

Concept reference: Dev.java: language, collections and JVM learning paths

Look for implementers that must provide meaningless operations or callers that depend on methods they never use. Split responsibilities around real usage while avoiding one interface per line of code. Test consumers against alternate implementations to expose hidden assumptions.

Check your understanding: Implement a second legitimate provider without no-op methods.

Common trap: Designing an interface from one implementation’s internals.

Concept reference: Dev.java: language, collections and JVM learning paths

A placeholder disappears as the user types and is not a dependable substitute for a programmatically associated label. Give each control a persistent label and connect instructions and validation messages to it. Test the form with keyboard input, zoom and a screen reader, not only by looking at the desktop layout.

Check your understanding: Submit an invalid field and verify that its name and error can both be found.

Common trap: Judging accessibility from visual appearance alone.

Concept reference: W3C WAI: labeling form controls

Find the first element whose dimensions exceed the viewport. Inspect fixed widths, intrinsic image sizing, long strings and minimum sizes in flex or grid children. Fix the responsible constraint instead of hiding the entire overflow, which can make content or focus indicators inaccessible.

Check your understanding: Test long content at a narrow width and at increased text zoom.

Common trap: Using overflow:hidden on the whole page as the fix.

Concept reference: MDN: the CSS cascade

Cover the user journey: selecting an item, entering details, receiving validation, retrying a failure and seeing a confirmed outcome. Prefer resilient role and label locators. Keep unrelated third-party behavior controlled in tests and retain a smaller integration check for the actual boundary.

Check your understanding: Verify keyboard completion and failure recovery, not a pixel-perfect snapshot alone.

Common trap: A suite that passes while the primary action cannot be used.

Concept reference: Playwright: reliable browser tests

First, identify technical constraints and define measurable service objectives. Next, trace state, rendering and network work from user action to painted result. Contrast architectural trade-offs across reuse, clarity, extensibility and accidental complexity, explicitly mitigate the risk of a partially deployed reader cannot understand the new representation, and confirm system stability using a compatibility contract, expand-and-contract rollout and rollback rehearsal.

Common trap: Reaching for a specific library or framework before defining constraints, failure envelopes, and automated verification criteria.

Prioritise the failure mode exhibiting the highest user blast radius and lowest observability. Formulate an explicit containment boundary, implement idempotent retries with jitter, and establish an automated rollback threshold. Verify resilience through semantic validation results, quarantine records and a replay verification.

Common trap: Relying on passive monitoring dashboards without defining explicit error-budget alerts, rollback triggers, and verified recovery procedures.

Structure the response using Context-Decision-Tradeoff-Result: articulate the business and technical constraints, compare viable alternatives, explain the implementation (trace state, rendering and network work from user action to painted result), and document the accepted trade-off. Provide concrete proof: a focused unit test, dependency boundary and refactoring comparison.

Common trap: Speaking only in high-level abstractions or team accomplishments without detailing your direct implementation decisions, trade-offs, and measured results.

Formulate a falsifiable hypothesis from observable telemetry before altering configurations. Then inspect the interaction trace, render causes, network waterfall and accessibility tree. Isolate the defect to the smallest reproducible boundary, validate root cause with evidence, and confirm full resolution using a before-and-after latency profile plus an explicit rollback threshold.

Common trap: Applying speculative fixes or restarting services blindly without establishing an observable signal connected to a falsifiable hypothesis.

Produce a performance profile and keyboard-accessible regression test. Document baseline assumptions, technical mechanism (trace state, rendering and network work from user action to painted result), rejected alternatives, bounded failure envelopes, and deterministic pass criteria. Supply reproducible verification via a trace, a minimal reproduction and a regression test.

Common trap: Presenting architecture diagrams or slides lacking automated unit/integration tests, observable metrics, or automated rollback configurations.