CodeNodeX AI
注册写作
首页/分类/Web 开发

Web 开发

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

专题

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

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

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

React 设计模式:组件抽象的艺术

组件怎么拆、状态怎么管、逻辑怎么复用——这些是"设计模式"决定的。本文讲清 React 常用模式:容器/展示分离、自定义 Hook(逻辑复用)、Render Props、Compound Components、Provider 模式,以及每个模式解决什么问题。

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

Web Workers:浏览器的多线程

JS 是单线程,重计算会冻 UI。Web Worker 开一个后台线程跑 JS,不阻塞主线程。本文讲清 Web Worker 的原理(postMessage 通信)、适用场景(大计算/图像/加密/JSON 解析)、Shared Worker/Service Worker 的区别,以及 Comlink 让 Worker 更易用。

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

Next.js App Router 深度:路由、布局与数据流

App Router 是 Next.js 的核心,但它的嵌套布局/并行路由/拦截路由/动态段很多人没用透。本文讲清 App Router 的文件约定(layout/page/template/loading/error)、并行路由与拦截路由的高级用法、Server/Client 组件数据流,以及从 Pages Router 迁移的关键差异。

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

React 组件的可访问性实战

语义 HTML 不够——自定义 React 组件(模态框/Dropdown/Tab/Toast)需要手动处理 a11y:焦点管理、键盘导航、ARIA、屏幕阅读器通知。本文讲清这些常用组件的 a11y 模式,让你写的自定义交互组件也能被所有人用。

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

Web 性能监控(RUM):从采集到告警

Lighthouse 只在开发时跑,生产用户的真实体验谁管?RUM(Real User Monitoring)采集真实用户的 LCP/INP/CLS 和 JS 错误。本文讲清 RUM 的采集(web-vitals 库)、上报、看板、告警,以及把"实验室快"变成"用户也快"。

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

CSS Grid 精通：从二维布局到实战

Flexbox 是一维的，Grid 是二维的——真正的页面布局该用 Grid。本文讲清 Grid 的核心概念（行/列/区域/轨道）、fr 单位与 minmax、grid-template-areas 语义化布局、响应式 Grid（auto-fit/auto-fill）、Grid vs Flexbox 的取舍，带你从"能用 Grid"到"精通 Grid"。

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

React 并发特性深入：Suspense、Transitions 与 useDeferredValue

React 18+ 的并发渲染不是"多线程"，是"可中断渲染"。本文讲清三个核心并发特性：Suspense（声明式加载状态）、useTransition（把重更新标为低优先级不阻塞输入）、useDeferredValue（延迟昂贵计算），以及它们怎么让 React 应用在不牺牲响应性的前提下做更多事。

#Next.js #React♥ 1560 评论