首页/分类/Web 开发

Web 开发

Next.js、React、TypeScript、前端工程化

专题

本专题收录 Web 开发 方向的文章和社区讨论,重点关注真实工程场景、工具选择、实践路径和风险边界。

页面会持续更新,适合作为学习路线、选型参考和技术复盘入口。

@admin·1 分钟阅读·Web 开发

本地开发依赖就绪合同:从端口已开到能力可用

本地服务启动成功,不代表数据库迁移、鉴权范围和消息主题已经可用。本文用版本化能力探针、稳定窗口与失败分类,把“等一会再刷新”改造成可验证且可回退的开发启动门。

#TypeScript #DevOps #开源♥ 1140 评论
@admin·3 分钟阅读·Web 开发

CORS 与 CSP:Web 安全的两道防线

CORS 和 CSP 名字像但完全不同:CORS 管跨域请求,CSP 管页面能加载什么。本文讲清 CORS 的预检/简单请求/凭证、CSP 的指令(restrict 来源/禁内联)、两者各自的坑,以及上生产必配的一套安全 header。

#React #DevOps♥ 1190 评论
@admin·4 分钟阅读·Web 开发

Feature Toggle 模式:解耦部署与发布

代码部署 ≠ 功能发布——Feature Toggle 让你把代码部署上去但功能关着,想开再开。本文讲清 Toggle 的四种类型(release/experiment/ops/permission)、实现粒度(配置/数据库/专用服务)、Toggle 的生命周期(别忘了清理)、以及"Toggle 不是免费的"代价。

#TypeScript #DevOps♥ 1200 评论
@admin·5 分钟阅读·Web 开发

React 表单最佳实践

表单是前端最繁琐的活——验证、错误提示、动态字段、提交。本文讲清 React 表单的完整实践:React Hook Form vs Formik、zod 校验、受控 vs 非受控、Server Actions 提交、以及复杂数据(数组/嵌套)怎么处理,让你的表单既简洁又健壮。

#React #TypeScript♥ 1220 评论
@admin·3 分钟阅读·Web 开发

PWA 渐进式 Web 应用

PWA 让 Web 应用拥有原生 app 的能力——离线、安装到桌面、Push 推送、后台同步。本文讲清 PWA 的三大核心(Service Worker/Manifest/Web Push)、实现步骤、以及 2026 年的平台支持现状(iOS 终于支持 Push 了)。

#React #TypeScript♥ 1240 评论
@admin·3 分钟阅读·Web 开发

API 限流策略深入:算法与实现

限流不只"每分钟 N 次"——用什么算法(固定窗/滑动窗/令牌桶/漏桶)、按什么维度(IP/用户/API key)、存哪(内存/Redis)、超限返回什么(429/Retry-After),都有讲究。本文讲清四种限流算法的对比与实现,给一份生产级限流方案。

#DevOps♥ 1250 评论
@admin·3 分钟阅读·Web 开发

React 虚拟化:大列表性能优化

渲染 10000 条数据卡死?虚拟列表只渲染可视区域的几行,滚动时动态替换。本文讲清虚拟化的原理(窗口计算/DOM 复用)、react-window 和 TanStack Virtual 的用法、什么场景该虚拟化、以及它的代价(搜索/无障碍/动态高度)。

#React #TypeScript♥ 1270 评论
@admin·4 分钟阅读·Web 开发

Web Components:框架无关的组件标准

React/Vue 各自有组件,但换框架就白写。Web Components 是浏览器原生的组件标准——Custom Elements + Shadow DOM,跨框架复用。本文讲清 WC 的核心 API、和 React/Vue 组件的区别、什么时候值得用(组件库/微前端),什么时候别用。

#React #TypeScript♥ 1300 评论
@admin·4 分钟阅读·Web 开发

React 数据获取:从 fetch 到 React Query

useEffect+fetch 看着简单,坑极多(竞态/重复请求/无缓存/无重试)。本文讲清 React 数据获取的演进:useEffect(反模式)→ React Query/SWR(服务端状态库)→ Server Components(RSC 服务端获取),各自该用在哪,以及 RSC 和 RQ 不是替代是互补。

#Next.js #React♥ 1330 评论
@admin·4 分钟阅读·Web 开发

WebAssembly:在浏览器跑接近原生的性能

JS 太慢的场景(图像/视频/3D/加密/大计算),WebAssembly 让浏览器跑 C/Rust 编译的代码,接近原生速度。本文讲清 WASM 是什么、和 JS 的关系(互补不替代)、怎么用(Rust 编译 wasm + JS 调用)、适合什么(WASM 的甜区)不适合什么。

#AI #TypeScript♥ 1350 评论
@admin·4 分钟阅读·Web 开发

React 代码分割与懒加载

全打包成一个 JS,首屏加载几 MB?代码分割按路由/组件拆成小 chunk,用到才加载。本文讲清 React.lazy + Suspense 的用法、Next.js 自动分割、路由级 vs 组件级分割、预加载策略,以及分割的度(太多 chunk 反而慢)。

#Next.js #React♥ 1380 评论
@admin·3 分钟阅读·Web 开发

Web Vitals:实验室数据 vs 现场数据

Lighthouse 跑分高但用户还觉得慢?实验室(模拟)和现场(真实用户)差距可能很大。本文讲清两种数据的区别、为什么以现场为准(真实设备/网络/行为)、怎么收集现场数据(CrUX/web-vitals 库/RUM),以及两种数据各自的用途。

#Next.js #React♥ 1410 评论