tezvyn:

🌐Frontend Dev

Frontend web development and UI engineering

1156 bites

More in Frontend Dev — page 20

What is the fundamental difference between window and document?
TypeScript & Web APIs2 min read

What is the fundamental difference between window and document?

WHAT IT TESTS: Your mental model of the browser runtime layers. ANSWER OUTLINE: Window is the browser tab and global scope; document is the object-oriented DOM representation of the loaded page.

TypeScript & Web APIs2 min read

What is a type predicate? Write a custom type guard for User.

Tests if you know a type predicate is a compile-time narrowing hint requiring runtime validation. Great answers define parameter is Type, validate every User property, and demonstrate narrowing. Red flag: omitting runtime checks or using as casting.

TypeScript & Web APIs2 min read

Create a generic getProperty using generics and keyof

Whether you can constrain a generic key with keyof and return the exact property type. Use T for the object and K extends keyof T for the key, returning T[K]. RED FLAG: Using string for the key allows invalid properties and erases the return type.

TypeScript & Web APIs2 min read

Key differences: type alias vs interface for object shapes

Tests your grasp of TypeScript extensibility and declaration merging. Contrast interfaces' extends and open merging against type aliases' unions, intersections, and primitives; prefer interfaces for public APIs and types for unions or mapped types.

TypeScript & Web APIs2 min read

How do you type and guard a string-or-string-array argument?

Tests union typing and runtime narrowing. Annotate as `string | string[]`, then branch with `Array.isArray()`. Strong answers note `typeof` returns `"object"` for arrays and that assertions bypass safety.

TypeScript & Web APIs2 min read

Explain the difference between any and unknown, and demonstrate type-safe narrowing

This tests your grasp of TypeScript top types: any disables checking while unknown forces narrowing. A strong answer defines both, accepts unknown, and uses typeof or a type guard before operating. Red flag: saying they are equivalent or relying on as casts.

TypeScript & Web APIs2 min read

What is noImplicitAny and why is it best practice?

WHAT IT TESTS: Your grasp of TypeScript's silent any fallback and safety loss. ANSWER OUTLINE: State that noImplicitAny errors when inference fails, forcing explicit types instead of plain any. RED FLAG: Calling it stylistic or ignoring runtime risks.

TypeScript & Web APIs2 min read

Explain what TypeScript's type inference is and show an inferred variable declaration

This tests whether you understand TypeScript deduces types without annotations. A strong answer defines inference as deriving types from values and gives an example like let x = 3 inferring number. A red flag is claiming explicit types are required.

TypeScript & Web APIs2 min read

Declare a string name and an array of lucky numbers in TypeScript

WHAT IT TESTS: Primitive and array type annotations in TypeScript. ANSWER OUTLINE: Declare the name with a lowercase string type and the lucky numbers as number[] or Array<number>. RED FLAG: Using uppercase String or Number, or omitting the array type.

TypeScript & Web APIs2 min read

Ambient Module Declarations: Compile-Time Trust Falls

Ambient module declarations are compile-time trust falls: you tell TypeScript the shape of code it cannot see. Use them for untyped npm packages, CSS imports, or CDN scripts.

TypeScript & Web APIs2 min read

ES Modules in TypeScript: The Compile-Time Contract

TypeScript ES modules are a compile-time target, not a runtime guarantee. Configure this when targeting modern browsers or Node with native ESM. The footgun is omitting .js extensions in imports, which it requires in ESM output even for .ts source files.

Worker postMessage: The Structured Clone Pipe
TypeScript & Web APIs2 min read

Worker postMessage: The Structured Clone Pipe

Worker postMessage moves data between threads via structured cloning. Use it to offload heavy work without blocking the UI. The message argument is mandatory, so omitting it is an error and you must pass null when there is no data.

Runtime Response Validation with Schema Libraries
TypeScript & Web APIs2 min read

Runtime Response Validation with Schema Libraries

TypeScript types evaporate at runtime, so a fetch response typed as User[] can be null or malformed. Schema libraries like Zod give static types and runtime guards from one contract. The footgun is using as instead of parse, silently reintroducing crashes.

Kent C. Dodds Fixes Accidental Monorepo with Workspaces
React & Next.js2 min read

Kent C. Dodds Fixes Accidental Monorepo with Workspaces

Kent C. Dodds consolidated four deployable apps into a proper npm workspace, deleting three nested lockfiles and adding minimal Nx caching. The migration exposed hardcoded paths and invalid package aliases that broke production once Node enforced package…

Cloudflare Sandboxes Cut Container Heartbeat Plumbing
React & Next.js2 min read

Cloudflare Sandboxes Cut Container Heartbeat Plumbing

Kent C. Dodds replaced Cloudflare Containers with Sandboxes, deleting heartbeat and shutdown logic for his FFmpeg pipeline. PR #729 uses one-shot exec() inside the existing queue worker, cutting deploy surface and eliminating long-lived service orchestration.

Kent C. Dodds Adds SQLite FTS5 to Vector Search
React & Next.js86 sec read

Kent C. Dodds Adds SQLite FTS5 to Vector Search

Kent C. Dodds added SQLite FTS5 to Vectorize embeddings after semantic search missed exact matches like "React Testing Library." The hybrid pipeline uses Reciprocal Rank Fusion. If your search fails on API names, add BM25 backup, not bigger embedding models.

React & Next.js89 sec read

Vercel Connect replaces env tokens with runtime OIDC

Vercel Connect Public Beta replaces static env tokens with short-lived, task-scoped credentials exchanged at runtime via OIDC. Agents request least-privilege access per job instead of holding long-lived shared secrets, eliminating manual rotation when…

React & Next.js2 min read

Vercel ships AI Gateway, Workflow SDK, and Sandbox for agents

Vercel Agent Stack unifies hundreds of models, durable workflows, and isolated microVMs for production agents. One endpoint routes across providers, checkpoints resume failed runs, and sandboxes isolate unreviewed code.

React & Next.js2 min read

Vercel Ship 2026: agent stack, eve framework, and microservices

Vercel Ship 2026 unveils open-source eve framework and Vercel Services for microservices July 1. Vercel is repositioning as agentic infrastructure with Connect credentials and expanded Python backends. Evaluate if your next agent deploys here instead of AWS.

Next.js 16.2 brings 67-100% faster server Fast Refresh
React & Next.js2 min read

Next.js 16.2 brings 67-100% faster server Fast Refresh

Next.js 16.2 Turbopack brings Server Fast Refresh to Node.js, cutting reload times 67-100% and compile times 400-900%. Only changed modules reload, not whole chains. WASM Workers, SRI, and dynamic import tree shaking land; upgrade to cut dev latency.