工程笔记
写给真正
交付技术栈的人
关于 React、Node.js、TypeScript 与 AI 的文章。有译文正文时显示译文。没有时显示英文，并注明这一点。
标签：Component Design
从JSX到普通对象：React元素、组件和属性的工作原理
了解 JSX 编译后的结果，为何组件本质上只是函数，以及属性、子元素、默认值、展开运算和插槽是如何基于这一核心概念衍生出来的。
阅读约 9 分钟利用四种命名过的React架构模式来操控AI编码代理
学习四种 React 模式（片段组合、自定义钩子、多态组件、还原器），以及如何在提示词中为它们命名，从而获得更整洁的 AI 生成代码。
阅读约 12 分钟复制与耦合：决定何时需要存在共享代码
了解为何合并相似的 React 组件或 NestJS 服务可能比直接复制成本更高，以及如何通过三个问题来判断何时该使用抽象层。
阅读约 12 分钟可复用React组件反噬：属性爆炸问题及解决方案
看看过早的重用是如何将一个简单的 React 组件变成一个充满冗余属性的负担，以及如何通过复制、复合组件和“三原则”来避免这种情况。
阅读约 9 分钟以责任而非复用来设计前端组件
了解为何按照明确的所有权和责任来组织前端组件——而非追求最大程度的代码复用——能更便于隔离和维护功能变更。
阅读约 14 分钟减少 React 的属性钻取问题及“上帝组件”现象
学习七种具体的重构模式，通过隔离状态、数据获取、权限控制和加载逻辑来拆分臃肿的 React 组件，而不仅仅是简单分割文件。
阅读约 15 分钟利用组合式组件与插槽解决 React 属性过载问题
了解为何配置繁重的 React props 会带来维护负担，以及控制反转、组合模式和插槽机制如何打造真正可复用的组件。
阅读约 11 分钟
常见问题
关于这些文章
是。每篇都是为本站准备的英文原创改写。结构与代码跟随来源；正文重写并做过重合检查。
英文是来源。只有存在该语言的正文译文时才显示其他语言。缺失或空白的译文仍是英文，包括在本地化网址上。
草稿经编辑后进入发布队列。站点导入只收录新的或有变更的 slug，不会重复添加。
示例仅供说明。上线前请核对技术栈与许可。若需交付，请发来简报。