
11.3 手写 useDebounce / useThrottle
防抖(debounce)是「停止触发 N 毫秒后才执行」,节流(throttle)是「每 N 毫秒最多执行一次」;在 React 里封装成 Hook 的关键是「用 useRef 存定时器/时间戳」「清理函数里清掉」「用 useRef 保存最新回调」。

防抖(debounce)是「停止触发 N 毫秒后才执行」,节流(throttle)是「每 N 毫秒最多执行一次」;在 React 里封装成 Hook 的关键是「用 useRef 存定时器/时间戳」「清理函数里清掉」「用 useRef 保存最新回调」。

手写 useEffect 的核心是「用 Object.is 逐个比较依赖数组」——不同则「先执行上次的清理函数,再执行本次的 effect」;所有 effect 都在「组件渲染完成后统一执行」。

压缩、裁剪、加水印、抠图、拼接都在本地完成。不限张数、不限次数,图片不会传到服务器。

手写 useState 的关键是「用模块级数组 + 游标,按调用顺序存取每个 Hook 的状态」,并在 setState 后「触发组件重新渲染」——这正好解释了「为什么 Hooks 不能写在条件里」。

React Native 不是「把 React 跑在浏览器里」,而是「换掉渲染器(react-dom → 原生组件)+ 换掉宿主环境(DOM → Native)」——所以「React 的心智模型(组件/状态/Hooks/单向数据流)完全通用」,但「没有 DOM、没有 CSS、没有 URL」意味着 W…

构建与 CI 的加速只有三条路——「少做(缓存命中就不干活)、做快(换更快的工具、把类型检查拿出来)、并行(拆 job、分片、并行任务图)」;而这三条的前提都是「先量出来慢在哪」——不测量的优化基本等于乱猜。

设计稿到代码的正确流程是「先把设计稿里的『值』对齐到 token,再写组件」——因为设计稿是静态且不完整的(没有 hover/disabled/loading/空态/长文本/小屏),所以「逐像素还原」是错的目标,「用 token 把它翻译成一致的实现,并把设计稿的缺失项补全」才是对的。

无障碍的第一原则是「能用原生 HTML 就用原生 HTML」(语义、键盘、屏幕阅读器全都白送),第二原则是「键盘能完成一切操作且焦点始终可见可知」——ARIA 只是「原生表达不了时的补丁」,而不是「装饰性的属性堆砌」。

PWA 的本质是「用 manifest 声明『我是一个应用』 + 用 Service Worker 拦截网络请求」,它的价值是「可安装、离线可用、后台能力(同步/推送)」;而最容易被做坏的恰恰是更新机制——「缓存优先」会让用户永远看到旧版本,所以「版本更新 + 提示刷新」必须一开始就设计好。

微前端解决的是「多个团队/多套技术栈的应用要合成一个站点」的组织问题,而不是技术问题——它的真正难点全在「隔离(JS 沙箱 + 样式隔离) 与 共享(依赖、状态、路由)」这两件事上,而「依赖共享(尤其是 React 版本)」是最容易翻车的地方。

Monorepo 的价值是「原子提交 + 共享代码 + 统一工具链」,代价是「构建与 CI 的复杂度」;所以它的核心不是「把所有代码放一起」,而是「依赖声明清楚(pnpm workspace)+ 任务图与缓存(Turbo/Nx)+ 类型可解析(project references)+ 版本可追溯(c…
最新评论
读过书不知道欧·亨利的人少。教科书上选文有
这小生活不错呀
不错,必须顶一下!
看着你还在坚持,很好
看来忙了也没时间更新博客了
NIce。学习了。。。。
网站不错!!!!
简洁实用,好文章!