Type a compose function using generics and overloads
It tests your ability to type higher-order pipelines where each function's output feeds the next input. Use function overloads with chained generics for each arity so TypeScript infers the composed parameter and return types.
Optimize a canvas with thousands of moving objects
Tests GPU-bound vs CPU-bound bottleneck diagnosis. Strong answers: batch draw calls to cut JS-to-GPU overhead, and render to a smaller back buffer to reduce fill-rate cost.
Explain the difference between microtask and macrotask queues
WHAT IT TESTS: Your event loop mental model and starvation hazards. ANSWER OUTLINE: Macrotasks like setTimeout run one per tick; microtasks like Promises drain fully after each task before rendering.
What is the exact output and event sequence of this code?
Tests event loop priority between sync, microtasks, and macrotasks. A strong answer gives Start, End, Promise, Timeout; explains Promise.then is a microtask and setTimeout is a macrotask, microtasks draining before the next macrotask.
How do you derive a PATCH payload type from UserProfile?
Tests knowledge of TypeScript utility types for APIs. A great answer uses Partial<UserProfile> to make all fields optional in one line and connects it to PATCH subset semantics. Red flag: manually rewriting properties as optional or confusing PUT with PATCH.
How do you type a custom property on global window in TypeScript?
Tests declaration merging and global scope augmentation in TypeScript. Strong answer: declare global in a .ts file, a .d.ts with interface Window, or scoped declare const window. Red flag: any or ts-ignore instead of interface merging.
How do you globally add a property to a third-party ButtonProps interface?
Tests TypeScript declaration merging and module augmentation. A strong answer uses a .d.ts file that declares the same module and interface name to merge the missing property globally. Red flag: suggesting edits inside node_modules or local wrapper types.
How do you write a minimal dom-utils.d.ts for a JS function?
Tests bridging untyped JavaScript into TypeScript via ambient module declarations. A strong answer declares a module matching the file path and exports the function with a typed signature. Red flag: suggesting rename to .ts or using any.
How do you add TypeScript types for a library without bundled types?
This tests the DefinitelyTyped @types workflow. Install @types/package as a dev dependency via npm or yarn, skipping it when the library already bundles .d.ts files. A red flag is suggesting manual declarations or extra tooling before checking DefinitelyTyped.
Explain TypeScript Project References in a monorepo and their configuration
This tests monorepo build scaling. Good answers: split into composite projects with references arrays, use tsc --build for incremental compilation, and consume .d.ts outputs for boundaries. Red flag: calling it path mapping or omitting --build.
How do you configure a dual ESM/CommonJS package?
WHAT IT TESTS: Node.js conditional exports and the dual-package hazard. ANSWER OUTLINE: Use exports.require for .cjs and exports.import for .mjs, keep type unset or explicit, and compile separate artifacts.
How would you structure TypeScript code and exports for effective tree-shaking?
Tests ES module semantics and sideEffects for library authors. Great answers: emit ESM, set sideEffects:false, avoid stateful barrel files, and preserve import syntax. Red flag: saying ESM alone guarantees tree-shaking without mentioning side effects.
How do modern build tools handle TypeScript vs tsc?
WHAT IT TESTS: separating transpilation from type checking for speed. Great answer: fast native tooling strips TS per-file on demand via native ESM; browser loads only visited modules; tsc/ts-loader check/bundle the whole graph upfront.
What problem does esModuleInterop solve for CommonJS imports?
Tests CommonJS-to-ESM interop. A strong answer covers: default imports for CommonJS modules; runtime helpers checking __esModule and wrapping exports; and implicit allowSyntheticDefaultImports. Red flag: claiming it is purely type-level with no emit impact.
How would you use tsconfig.json to enable shorter path aliases?
This tests TypeScript module resolution. A strong answer sets compilerOptions.baseUrl, maps paths like @/* to src/*, and warns bundlers need matching aliases. A red flag is omitting baseUrl or claiming paths alone changes runtime resolution.
What is tsconfig strict, and which sub-flag to relax for legacy?
Tests strict as a master switch and migration pragmatism. Strong answers name strictNullChecks or noImplicitAny as the first to relax in legacy code, trading null-safety for fewer errors. Red flag: disabling strict entirely instead of a targeted sub-flag.
In WebGL, what is the difference between attributes and uniforms?
Tests per-vertex versus per-draw-call data flow. Attributes vary per vertex from buffers; uniforms are constant per draw call. Cite vertex positions as attributes and an MVP matrix as uniform.
Use MediaRecorder to capture a canvas stream and download as WebM
Tests MediaRecorder lifecycle and blob assembly. Answer: canvas.captureStream() into new MediaRecorder with video/webm, start(), collect chunks via dataavailable, stop(), then build a Blob and object URL for download.
Explain the roles of vertex and fragment shaders in WebGL
WHAT IT TESTS: GPU pipeline separation between geometry transform and pixel color. ANSWER OUTLINE: vertex shaders write gl_Position per vertex; fragment shaders write gl_FragColor per pixel. RED FLAG: swapping their outputs or claiming CPU/DOM access.
Which video event signals completion, and how do you track playback time?
Tests HTMLMediaElement events and UI performance. Answer: use ended for replay; read currentTime on timeupdate but throttle updates or use requestAnimationFrame. Red flag: setInterval polling, currentTime===duration checks, or unthrottled state writes.