前端技术文章
-
WebTransport 的双向流和 Datagram 都能承载实时数据，但可靠性、顺序性和消息边界完全不同。本文用一个实时面板的取舍场景说明两者适合什么数据，并给出可靠流的 framing 写法与兼容检查清单。440 收藏 -
用 Web Streams 组装生产、转换和消费管道时，关键不是手工堆积缓存，而是让下游需求通过队列和 pipe 链路传回 source，并用 AbortController 统一处理取消、超时和资源释放。175 收藏 -
Vue 3 中直接解构 reactive 对象的 primitive 属性会断开响应式连接。本文用排障手册的方式解释原因，并给出 toRefs、toRef 与保留 state.field 三种处理选择。496 收藏 -
Vue 3 中监听 reactive 对象的单个字段时，应把字段访问放进 getter，而不是直接传当前值。本文结合一次表单联动排障，讲清 getter、deep、immediate 和 Options API 点号路径的取舍。297 收藏 -
React Suspense 遇到多个独立数据源时，关键不是把所有请求都塞进一个组件，而是提前并行创建稳定的 Promise，再按内容块设置 Suspense 边界。本文说明请求瀑布的成因、缓存读取、依赖顺序、刷新和错误处理。368 收藏 -
TypeScript 中，外部输入优先使用 unknown 并通过类型守卫收窄；any 只适合被限制在遗留适配层。本文从接口响应、运行时风险和渐进迁移三个角度说明怎样选择。230 收藏 -
开启 TypeScript noUncheckedIndexedAccess 后，数组下标读取会带上 undefined。本文按规则、循环、索引判断和迁移边界说明怎样选择 for-of、边界检查、默认值与非空断言。435 收藏 -
Vite 的 import.meta.env 主要在开发服务器启动或生产构建阶段读取并静态替换，浏览器运行时不能直接改写已经打包的值。本文解释构建期配置与运行时配置的边界，并给出外置 config.js 的落地方式。413 收藏 -
Vite 依赖预构建异常时，先区分 node_modules/.vite 文件系统缓存和浏览器强缓存，再用日志、Network 和 --force 选择最小恢复动作。236 收藏 -
Lit 的 updateComplete 适合等待当前组件完成一次响应式更新，但默认不等待子组件。本文从事件派发、DOM 测量和测试三个场景说明使用方式，并比较 getUpdateComplete、requestAnimationFrame 与 ResizeObserver 的边界。425 收藏 -
D3 的 scaleBand 与 scalePoint 都能把离散分类映射到连续坐标，但前者给图元分配带宽，后者只给出中心位置。本文用柱形图、折线图和散点图比较两者的适用场景，并说明 padding、bandwidth、step 与分类轴刻度的边界。271 收藏 -
D3 data join 默认按位置匹配，列表重排后容易让 DOM 节点状态跟错对象。本文用稳定且唯一的 id 作为 key，说明 update、enter、exit 的对应关系，以及排序、重复 key 和 DOM 顺序的边界。185 收藏 -
解释SolidJS createMemo的纯计算约束，结合报价预览组件区分派生值、createEffect外部同步与用户事件，并说明相等判断、状态回写和清理边界。308 收藏 -
SolidJS 的 createStore 可以用 setStore 路径语法定位嵌套对象和数组元素，本文用一个表单状态示例说明局部更新、条件批量更新以及 produce 的适用边界。130 收藏 -
对比Alpine.js的$watch与x-effect，通过组件示例解释显式监听、自动依赖、首次执行、新旧值，以及深层对象回写风险和副作用隔离。297 收藏