交互

先看效果，再看代码 我上周上线一个活动页，iOS上点按钮总要等300ms才响应——用户点完第一下没反应，下意识又点一次，结果触发了两次提交。后台直接报警，运营妹子在群里艾特我：“你那个抽奖按钮是不是卡...

history.pushState之后，后退按钮不触发popstate？我懵了两小时 今天上线前做兼容性测试，发现一个诡异问题：用户从首页点进详情页（用了 history.pushState），再点返...

优化前：卡得不行 上个月上线一个后台数据看板，用户一刷页面就卡顿，不是“加载中”慢，是整个页面直接卡住1.5秒以上——连右上角的关闭按钮都点不动。更离谱的是，有些低端安卓机上，遮罩弹出来后，底下内容还...

先看效果，再看代码 我上周在做一个拖拽排序组件时，发现 Chrome 里 shift 键按下去没反应——不是键盘事件没监听到，而是 event.shiftKey 在某些场景下死活是 false。折腾了...

项目初期的技术选型 去年下半年接了个后台运营系统重构，核心需求是「实时同步用户行为日志到 BI 看板」。一开始我真没想用消息队列——毕竟只是个内部系统，日志量预估也就每秒 30~50 条，直接写 My...

项目初期的技术选型 去年下半年接了个内部知识库系统，需求挺典型：支持富文本编辑、版本对比、协作评论、导出 PDF。一开始团队讨论用 Quill，毕竟文档多、插件熟；但第三天我就把 demo 删了——因...

我的写法，亲测靠谱 TouchMove 这玩意儿，我用过不下十个项目，从轮播图、拖拽排序、滑动删除，到自研的简易手势库，基本都绕不开它。但每次写，我都会重新翻一遍 MDN，再对着 Chrome Dev...

我的写法，亲测靠谱 先说结论：我一般不用 keydown 做输入校验，也不在它里面直接改 input 的 value。这俩操作看起来顺手，但上线后必出问题——不是光标乱跳，就是中文输入法崩掉，或者回车...

先看效果，再看代码 上周上线一个按钮音效反馈功能，用户点一下“提交”，咔哒一声，跟 iOS 点击原生按钮一模一样——不是那种干巴巴的 beep，是带点包络、有点衰减、还带点轻微低频震动感的音效。上线后...

项目初期的技术选型 上个月在做一个内部用的工单管理页，列表项需要支持快速删单。产品经理说“别点进详情再删，太慢，左滑直接删，像微信删聊天那样”。我第一反应是：又来了，这种交互看着简单，一写就掉坑里。 ...

项目初期的技术选型 去年接了个教育类小程序的H5配套页，需要在微信内置浏览器里嵌一个「课程回放」模块。不是纯视频点播，而是带章节标记、拖拽定位、倍速、字幕切换、还有个“学习进度条”要和后端同步——听起...

谁更灵活？谁更省事？ 最近在做一个移动端拖拽排序组件，需求看着简单：手指按住卡片、拖动、松手后更新顺序。但实际一上手就发现——touch事件原生写起来真他妈累。preventDefault反复加、to...

我的写法，亲测靠谱 音频可视化这事，我前后在三个项目里搞过：一个音乐播放器 Demo、一个直播后台的声波监控面板、还有一个给盲人用户做的语音反馈可视化小模块。每次上线前都得调半天——不是波形跳得太疯，...

项目初期的技术选型 上个月在做一个内部工单系统，后端推送实时状态变更（比如“客户已确认”“财务已打款”），需要在用户不聚焦页面时也收到提醒。一开始想用 WebSocket + 自定义弹窗，但发现桌面端...

优化前：卡得不行 上线前压测，我盯着消息列表滚动，手指刚划两下，页面就掉帧——肉眼可见的卡顿。发 10 条消息，UI 延迟 300ms 才渲染；翻到第 200 条历史消息，输入框直接失焦，键盘弹了又收...

先看效果，再看代码 搜索框输几个字就疯狂调接口？用户还没打完“苹果手机”，你已经发了5次请求，后端日志炸了，自己还一脸懵——别急，这事儿我上周刚干过。不是后端扛不住，是我前端没防抖。 防抖（debou...

先看效果，再看代码 我上周给一个数据看板加了个 3D 地球仪，需求就一句：“能转、能点、能显示热点城市”。没说用 Three.js，但打开 Figma 稿子一看——带光照、带纹理、带 hover 缩放...

又踩坑了，AudioContext在iOS上一碰就挂 今天上线前最后测音频可视化，结果 iOS 上点一下播放按钮——直接白屏。控制台没报错，页面静默死亡。Chrome 里跑得好好的，Safari 里连...

项目初期的技术选型 去年年底接手一个内部协作平台，类似轻量版的飞书+钉钉混合体。核心需求之一是「实时显示同事在线状态」——不是那种“最后活跃时间”，而是真·在线/离线，带心跳检测和状态同步。产品经理说...

又踩坑了，touchmove滚动失效 今天上线前测一个横向拖拽组件，结果在 iOS Safari 上死活不响应 touchmove —— 不是卡住，是压根没触发。我第一反应是：JS 报错了？赶紧打开 ...