Next.js、React、TypeScript、前端工程化
This collection features articles and community discussions in the Web 开发 space, focusing on real-world engineering scenarios, tool selection, practical paths, and risk boundaries.
The page is continuously updated and serves as a learning roadmap, technology selection reference, and technical review entry point.
CORS and CSP sound similar but serve different purposes: CORS governs cross-origin reads, while CSP controls what a page may load. This guide covers simple requests, preflights, credentials, CSP source and inline-script restrictions, common pitfalls, and a production-ready set of security headers.
Code deployment is not feature release. Feature Toggles let you deploy code with functionality disabled and enable it when needed. This article covers four Toggle types (release, experiment, ops, and permission), implementation tiers, lifecycle cleanup, and the real costs of conditional complexity.
Forms are frontend's most tedious work: validation, error messages, dynamic fields, and submission. This article covers complete React form practices: React Hook Form vs. Formik, Zod validation, controlled vs. uncontrolled inputs, Server Actions, and handling complex array and nested data.
PWAs give web applications native capabilities such as offline access, desktop installation, Push notifications, and background synchronization. This article explains their three core components, implementation steps, and platform support in 2026, including Web Push on iOS.
Rate limiting is more than 'N requests per minute' — which algorithm (fixed window/sliding window/token bucket/leaky bucket), which dimension (IP/user/API key), where to store (memory/Redis), and what to return when exceeded (429/Retry-After) all matter.
Rendering 10,000 records freezes the page? A virtual list renders only the rows in view and swaps them dynamically as you scroll. This article explains window calculation and DOM reuse, how to use react-window and TanStack Virtual, when virtualization makes sense, and its tradeoffs for search, accessibility, and dynamic heights.
React and Vue components are tied to their frameworks. Web Components use browser-native Custom Elements, Shadow DOM, and HTML Templates for cross-framework reuse. This guide explains their APIs, tradeoffs, best use cases, cases to avoid, and how Lit improves the development experience.
`useEffect + fetch` looks simple, but it is full of traps: races, duplicate requests, no cache, and no retries. This article traces React data fetching from `useEffect` to React Query/SWR and Server Components, explaining when to use each and why RSC and RQ complement rather than replace each other.
When JavaScript is too slow for image and video processing, 3D, cryptography, or heavy computation, WebAssembly lets browsers run code compiled from C or Rust at near-native speed. This article explains what WASM is, how it complements JavaScript, how to use it, and where it does and does not fit.
Bundle everything into one JS file and make users download several MB before first paint? Split code by route or component into small chunks and load them only when needed. Learn React.lazy + Suspense, Next.js automatic splitting, route- vs component-level splitting, preloading, and why too many chunks can be slower.
A high Lighthouse score does not guarantee a fast user experience. This article explains the gap between simulated lab data and real-user field data, why field results are authoritative, how to collect them with CrUX, the web-vitals library, and RUM, and when to use each data source.
Adding use client at the top of a page pulls static conversations, Markdown dependencies, and tool panels into the client graph. This article defines a boundary inventory, cold-start fixture, and rollback-ready hydration gates for Next.js 16.2.6.