CodeNodeX AI
注册写作
首页/标签/React

#React

专题介绍

这里聚合 CodeNodeX AI 社区中与 React 相关的技术文章和讨论，覆盖概念解释、工具对比、工程实践、常见问题和独立开发经验。

如果你正在研究 React，建议先阅读高质量长文，再参与帖子讨论，形成从理解到实践的完整路径。

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

React 自定义 Hooks 架构：提取、组合与测试

Hooks 不只是 useState/useEffect——自定义 Hooks 是 React 的"复用单元"。本文讲清什么时候提取自定义 Hook（重复逻辑/副作用/状态逻辑）、Hook 组合（Hook 调 Hook）、依赖与 stale closure、测试 Hooks（renderHook + act），以及"别过度抽象 Hook"。

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

视觉回归测试：截图对比与噪声控制

功能测试不抓"布局塌了/颜色变了/字号错了"——这些只有视觉回归能抓。本文讲清 VRT 原理（截图+像素对比+diff）、工具选型（Playwright screenshots/Chromatic/Percy）、阈值调优、CI 集成，以及"别让 VRT 成噪声制造机"。

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

React Ref 模式：forwardRef、useImperativeHandle 与 Ref 转发

Ref 不只是"引用 DOM"——在组件库里它决定 API 体验。本文讲清 useRef（值容器/不触发重渲染）、forwardRef（转发 ref 给子组件）、useImperativeHandle（暴露受控 API）、ref callback，以及 React 19 的 ref as prop（不用 forwardRef 了）。

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

CSS 暗色模式实现：prefers-color-scheme 与 class 切换

暗色模式不是简单反转颜色——要处理系统偏好跟随、手动切换、持久化、闪烁(FOUC)、图片/图标适配。本文讲清 prefers-color-scheme 媒体查询、class 切换策略、localStorage 持久化、防闪烁脚本、CSS 变量主题系统，给一套完整的暗色模式方案。

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

React 错误追踪：Sentry 集成实战

用户遇到白屏但你不知道——Sentry 在用户遇到错误前就帮你抓到。本文讲清前端错误追踪：Sentry SDK 集成、Error Boundary 捕获、source map 上传（生产定位到源码行）、release 追踪、性能监控、隐私脱敏。

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

Web 可访问性测试工具链

a11y 不靠人肉测——有一套成熟的自动化工具。本文讲清四层 a11y 测试：lint(eslint-plugin-jsx-a11y)、自动扫描(axe-core/Lighthouse)、E2E 集成(@axe-core/playwright)、屏幕阅读器实测(VoiceOver/NVDA)，以及 CI 门禁配置。

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

Web Push 与 Service Worker：浏览器原生推送

Web Push 让你的网站能像 App 一样推送通知——即使用户没开网页。本文讲清 Web Push 的三件套（VAPID 密钥 + Push API + Service Worker）、订阅/发送/接收流程、权限请求体验、以及"用户没开浏览器也能收到推送"的原理。

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

React Suspense 与 Streaming SSR

传统 SSR 等所有数据返回才发 HTML——慢接口拖累全页。Streaming SSR 边渲染边发，Suspense 标记"这里先给 loading，数据好了再流式替换"。本文讲清 Streaming SSR 的原理、Suspense 在 SSR 的角色、Next.js App Router 的流式渲染、选择性 hydration，以及它怎么让 LCP 不再被最慢的组件阻塞。

#Next.js #React♥ 1950 评论