framework
framework/react/index.md
medium
framework-react-index
React 组件 / Hook / 状态 / 错误处理 / 主题 / 布局 / 反馈 / 可靠性 / 性能 / 安全 / 新特性 / 无障碍 / 国际化 / 文件 使用约定索引
子项索引
| 子项 | 一句话 |
|---|---|
| component folder | React 组件结构 |
| hook folder | React Hooks 规范 |
| state folder | React 状态分层 |
| error-handling folder | React 错误处理 — 路由级 ErrorBoundary + 区域/widget 级错误隔离 |
| theming folder | React 主题与色板 |
| layout folder | 页面结构约定索引——栅格 Row/Col 排版 + 布局容器 Layout/Space/Flex/Divider 选型。房规：每页必须由栅格 + 布局容器组成，禁裸 div 堆砌 |
| feedback folder | React 数据反馈态使用约定:Skeleton 骨架屏加载 + Empty 空态。房规:loading 用 Skeleton 不用全屏 Spin,零数据用 Empty 并区分无数据/筛空/出错三态 |
| reliability folder | React 前端运行可靠性索引：异步竞态取消 / 副作用清理防泄漏 / 防重复提交 / chunk 加载恢复 |
| performance folder | React 前端性能优化索引：长列表虚拟化、路由/组件代码分割懒加载、Core Web Vitals 之 CLS 布局抖动治理 |
| security folder | 前端安全两类约定：XSS 与 dangerouslySetInnerHTML 消毒、token 存储与 open redirect 防护 |
| react19 folder | React 19 新特性集合：use + Suspense 取数 / Actions 表单提交 / 并发渲染调度 / React Compiler 自动记忆化 / useEffectEvent |
| a11y folder | React 无障碍约定索引：语义 HTML / ARIA 属性 / label 关联，以及键盘可达 / tab 顺序 / 焦点管理 |
| i18n folder | React 国际化文案约定索引：禁字符串拼接、复数走 ICU、locale 化数字与日期、禁硬编码、RTL 布局 |
| file folder | 浏览器侧文件处理约定 — 大文件分片上传、createObjectURL 必 revoke、Base64 vs ObjectURL 选型、流式下载 |
React · 使用约定
本层包含
| 名称 | 类型 | 一句话 |
|---|---|---|
| component | 文件夹 | 组件结构 / 命名 / 分层 / 渲染坑 / 受控 |
| hook | 文件夹 | 自定义 Hook + useEffect 边界 |
| state | 文件夹 | 状态分层选型 |
| error-handling | 文件夹 | 路由级 + 区域级 ErrorBoundary |
| theming | 文件夹 | 主题色板与 token |
| layout | 文件夹 | 栅格 + 布局容器（房规） |
| feedback | 文件夹 | 骨架屏 + 空态（房规） |
| reliability | 文件夹 | 竞态取消 / 清理泄漏 / 防重 / chunk 恢复 |
| performance | 文件夹 | 虚拟列表 / 代码分割 / Core Web Vitals |
| security | 文件夹 | XSS 消毒 / token 存储 / 跳转安全 |
| react19 | 文件夹 | use / Actions / 并发 / Compiler 新特性 |
| a11y | 文件夹 | 语义 ARIA + 键盘焦点 |
| i18n | 文件夹 | 占位符模板 / 复数 / 格式化 / RTL |
| file | 文件夹 | 分片上传 / 预览泄漏 / 流式下载 |
何时下钻
- 写新组件 / 渲染坑 / 受控输入 →
component/index.md起步 - 抽取共享逻辑成 Hook →
hook/index.md - 数据流跨多层 →
state/index.md选型 - 路由级或区域级异常处理 →
error-handling/index.md - 配色 / 暗色模式 →
theming/index.md - 搭页面布局 / 分列 / 选容器（房规）→
layout/index.md - 加载态或空数据展示（房规）→
feedback/index.md - 数据乱序 / 卸载报错 / 重复提交 / 部署后白屏 →
reliability/index.md - 列表卡顿 / 首屏慢 / 布局抖动 →
performance/index.md - 渲染用户内容 / 存登录态 / 做跳转 →
security/index.md - 用 use / Actions / 并发 / Compiler 新写法 →
react19/index.md - 无障碍语义 / 键盘焦点 →
a11y/index.md - 多语言文案 / 本地化格式化 →
i18n/index.md - 文件上传 / 图片预览 / 大文件下载 →
file/index.md