陌上寒

陌上人如玉
公子世无双
一七令 · 雪

最新发布

11.10 手写简易 diff-陌上寒

11.10 手写简易 diff

手写简易 diff 的目标是「理解 React 如何把两棵 vnode 树变成最小的 DOM 操作」——核心是「同层比较 + type 不同直接重建 + 用 key 匹配同一层数组」,把 O(n³) 降到 O(n)。

赞(0)陌上寒陌上寒11-手写实现 阅读()去评论
11.9 手写 Error Boundary-陌上寒

11.9 手写 Error Boundary

Error Boundary 只能由类组件实现——依赖 static getDerivedStateFromError(渲染降级 UI)与 componentDidCatch(上报),并要提供「重置」能力;用「包装组件 + 函数式 fallback」可以让使用方是函数组件。

赞(0)陌上寒陌上寒11-手写实现 阅读()去评论
11.8 手写无限滚动-陌上寒

11.8 手写无限滚动

无限滚动的推荐实现是「用 IntersectionObserver 观察一个列表底部的「哨兵元素」」——它比监听 scroll 事件更高效(不读布局、不频繁触发),配合 rootMargin 还能「提前触发」实现无感加载。

赞(0)陌上寒陌上寒11-手写实现 阅读()去评论
11.6 手写虚拟列表-陌上寒

11.6 手写虚拟列表

虚拟滚动的核心是「只渲染可视区域内的几十个元素」,用「占位元素撑起总高度」+「translateY 偏移渲染层」——公式是「startIndex = floor(scrollTop / rowHeight)、visibleCount = ceil(containerHeight / rowHeigh…

赞(0)陌上寒陌上寒11-手写实现 阅读()去评论
11.3 手写 useDebounce / useThrottle-陌上寒

11.3 手写 useDebounce / useThrottle

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

赞(0)陌上寒陌上寒11-手写实现 阅读()去评论
11.2 手写 useEffect-陌上寒

11.2 手写 useEffect

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

赞(0)陌上寒陌上寒11-手写实现 阅读()去评论
《百年孤独》读后:孤独是重复,遗忘才是终点-陌上寒

《百年孤独》读后:孤独是重复,遗忘才是终点

读完《百年孤独》,我最大的感受不是魔幻,而是一种缓慢的、几乎让人窒息的现实感。马尔克斯写的是布恩迪亚家族七代人的兴衰,也是马孔多从建立到被飓风抹去的历史。但真正让我放不下的,不是那些飞毯、升天和预言,而是一个反复出现的动作:重复。人一旦无法...

赞(0)陌上寒陌上寒随笔 阅读()去评论