Free · no sign-up · no time limit
Ready-made multiple-choice practice quizzes, hand-checked. Take any free quiz online — every answer comes with an explanation, and every quiz page has a full answer key to revise from.
Free · no sign-up · no time limit
Ready-made multiple-choice practice quizzes, hand-checked. Take any free quiz online — every answer comes with an explanation, and every quiz page has a full answer key to revise from.
IT
Evaluate your knowledge of Modern Frontend Architecture, SSR, SSG, Hydration mechanics, Islands Architecture, and Module Federation. Answer each question to see whether you got it right, with an explanation every time.
A free 16-question multiple-choice practice test on IT. Each question has one correct answer and a short explanation, and the full answer key below the player doubles as a study sheet. No account, no time limit — take it as often as you like.
This is a free, 16-question multiple-choice quiz. Answer each question to see whether you got it right, with an explanation for every answer. There is no sign-up and no time limit — take it as many times as you like, and use the answer key above to revise before or after.
Correct answer: BThe browser must download, parse, and execute the entire JavaScript bundle to attach event listeners to an already-rendered HTML DOM
Hydration requires the browser to parse and execute large JS bundles to attach event listeners and reconstruct state for server-rendered HTML, blocking interaction during the process.
Correct answer: BIt renders the page mostly as static HTML, hydrating only isolated interactive components ('islands') independently
Islands Architecture keeps the bulk of the page pure static HTML and selectively hydrates only the specific interactive components, reducing the client JavaScript footprint.
Correct answer: BAllowing a JavaScript application to dynamically import and execute modules from a completely independent remote build at runtime
Module Federation enables JavaScript applications to dynamically load code from independent remote builds at runtime, facilitating decoupled micro-frontend architectures.
Correct answer: BResuming execution directly from server-serialized state and HTML without needing to execute a full client-side hydration phase
Resumability serializes the application state directly into the HTML; the browser does not need to re-execute component trees on load, downloading and running code only upon actual interaction.
Correct answer: ASSG renders HTML at build time; SSR generates HTML dynamically on the server at request time for each incoming request
SSG generates static HTML files ahead of time during the CI/CD build phase, while SSR executes rendering dynamically on the server upon every user request.
Correct answer: BUpdating individual static pages in the background after deployment without needing to rebuild the entire website
ISR allows static pages to be regenerated in the background on-demand as requests come in, combining the speed of static sites with dynamic freshness.
Correct answer: BThe visual stability of the page by quantifying unexpected layout movements during page load
CLS measures visual stability, calculating how often elements shift unexpectedly during rendering (e.g., from un-dimensioned images or injected ads).
Correct answer: BComponents that execute strictly on the server, producing a stream of virtual DOM instructions without adding to client JS bundle size
RSCs run exclusively on the server, accessing backend data directly and emitting a serialized virtual DOM tree that adds zero bytes to the client JavaScript bundle.
Correct answer: BThey introduce isolation boundaries that complicate deep linking, responsiveness, modal dialogs, and cross-frame state sharing
While iframes offer strong style and script isolation, they introduce routing desynchronization, layout sizing challenges, accessibility hurdles, and state sharing friction.
Correct answer: BTo encapsulate component styles and markup in an isolated subtree, preventing global CSS leakage
The Shadow DOM encapsulates an element's internal DOM tree and scoped CSS, preventing styles defined inside from leaking out and global page styles from bleeding in.
Correct answer: BThe process of eliminating unused, dead code from the final bundle using static ES module (import/export) analysis
Tree shaking relies on the static structure of ES modules (import/export) to trace active code paths and discard unused exports from production bundles.
Correct answer: BStreaming chunks of server-rendered HTML progressively over a single connection, allowing fast parts of the page to render before slow data loads
Streaming SSR flushes initial HTML layout immediately, followed by deferred script tags and HTML chunks as slower async components resolve on the server.
Correct answer: BThe overall responsiveness of a page by measuring the latency of all user interactions (clicks, taps, keypresses) throughout the visit
INP evaluates overall page responsiveness by measuring the time between user interactions (clicks, keystrokes) and the next visual frame update across the whole visit.
Correct answer: BAllowing browsers to resolve bare module specifiers (e.g., 'import lodash') directly to specific URLs without bundler translation
Import maps allow native browser ES module imports to resolve bare package names (like import React from 'react') to designated remote or local URLs without a build step.
Correct answer: AA Service Worker acts as a programmable network proxy intercepting HTTP requests; a Web Worker executes general-purpose background compute tasks
Service Workers act as network proxies to manage caching, offline modes, and push events; Web Workers run general background CPU compute tasks without network interception capabilities.
Correct answer: BIt breaks JavaScript bundles into separate files loaded on demand only when the user navigates to a specific route
Route-based code splitting ensures users download only the JavaScript needed for their current page, deferring code for other routes until navigation occurs.