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

#React

专题介绍

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

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

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

Core Web Vitals 与前端性能优化

Core Web Vitals 不只是 SEO 指标,它是真实用户体验的量化。本文讲清三大指标(LCP/INP/CLS)各自测什么、为什么重要、怎么测(Lighthouse/真实用户数据/PSI),以及针对性的优化手段(图片/字体/JS/布局稳定性/交互响应),让你的站既快又被 Google 待见。

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

Web 安全:OWASP Top 10 实战防护

不懂 OWASP Top 10,写的 Web 应用就是筛子。本文讲清最常见的 Web 漏洞:XSS、SQL 注入、CSRF、SSRF、反序列化、越权,各自的原理、现代框架的防护、以及一个核心认知——输入不可信、输出要转义、用参数化查询,把安全刻进编码习惯。

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

React 状态管理选型:从 useState 到 Zustand

状态管理是 React 永恒的话题,选择太多反而乱。本文讲清状态管理的层级(useState/useReducer/context/Zustand/Redux 各管哪层)、本地状态 vs 服务端状态(React Query/SWR)、什么场景该上全局库、什么时候 context 就够,帮你跳出"什么都上 Redux"的误区。

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

现代 CSS 布局:Flexbox、Grid 与 Container Queries

还在用 float 和 margin 居中?现代 CSS 早就不一样了。本文讲清 Flexbox(一维)与 Grid(二维)的分工、居中/等高/圣杯布局的现代写法、Container Queries(组件级响应式)、以及 CSS 的新能力(@layer/:has/逻辑属性),让你用更少的代码写出更强的布局。

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

React Hooks 深度与常见坑

Hooks 用着简单,但 useRef/ useMemo/依赖数组的细节坑了不少人。本文讲清 Hooks 的心智模型(闭包 + 依赖数组)、常见坑(stale closure/依赖遗漏/无限循环)、自定义 Hook 的抽取原则、以及 useEffect 不是生命周期,帮你真正驾驭 Hooks。

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

React 测试策略:从单元到 E2E

测试 React 不是"什么都测",而是"测对的东西"。本文讲清 React 测试金字塔:什么该单测(工具函数/hooks)、什么该组件测(用户交互)、什么该 E2E(关键流程),工具选型(Vitest/Testing Library/Playwright),以及"测行为不测实现"的核心原则。

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

CSS 架构模式:BEM、CSS Modules 与 CSS-in-JS

CSS 一多就乱:命名冲突、全局污染、优先级战争。本文讲清几种主流 CSS 架构模式:BEM(命名约定)、CSS Modules(局部作用域)、CSS-in-JS(styled-components/emotion)、以及 Tailwind/原子 CSS 的崛起,各自适用与怎么选。

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

SSO 与 OAuth 2.0 实战

认证授权是每个产品的基础,但 OAuth/OIDC/JWT/Session 的关系很多人没理清。本文讲清现代 Web 认证:Session vs JWT、OAuth 2.0 授权流程、OIDC(认证层)、SSO 实现、token 存储与安全,让你不再被这套概念绕晕。

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

设计系统与 Design Tokens

产品一大,UI 就乱——颜色字号各写各的、组件不统一。设计系统解决这个。本文讲清 Design Tokens(设计变量化的原子)、组件库分层(token→基础组件→业务组件)、主题切换、以及怎么让设计和开发用同一套语言,而不是各自为政。

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

Web 应用的分层缓存策略

缓存是性能优化的瑞士军刀,但乱用会出脏数据。本文讲清 Web 的多层缓存:浏览器(HTTP 缓存/Service Worker)、CDN、服务端(Redis/内存)、数据库(查询缓存),每一层缓存什么、失效策略、以及缓存一致性怎么保。

#Next.js #React♥ 860 评论