应优先使用 pointermove 替代 mousemove 实现高精度输入捕获，启用 getcoalescedevents() 还原原始采样点，并配合 passive: false、touch-action: none 和 will-change: transform 确保事件与渲染性能。
高精度输入硬件（如绘图板、高采样率触控屏、专业级触控板）对事件密度、坐标精度和延迟极其敏感，原生 mousemove 或 input 事件往往丢失关键帧或引入插值偏差。必须改用更底层、更高频、带原始数据的监听机制。
用 pointermove 替代 mousemove 实现设备无关的高采样捕获
pointermove 是 Pointer Events API 的核心事件，统一覆盖鼠标、触控、笔输入，并在支持设备上直接暴露硬件原始采样点（而非浏览器合成后的节流帧）。它比 mousemove 触发频率高 2–5 倍，且携带 pressure、tangentialPressure、tiltX/tiltY 等高精度笔输入字段。
- 必须显式启用：部分 Chrome/Edge 需在页面加载后调用
document.addEventListener('pointerdown', () => {}, {passive: false})才解锁全量 pointer 事件流 - 禁用 passive 模式：若需调用
event.preventDefault()（如阻止滚动干扰绘图），监听时必须传{passive: false}，否则会被静默忽略 - 避免混用：不要同时监听
mousemove和pointermove，后者会覆盖前者，且事件顺序不可靠
启用 getCoalescedEvents() 获取被合并的原始指针事件
现代浏览器（Chrome 81+、Edge 87+、Safari 16.4+）在高刷新率设备上会自动合并多个指针事件为单个 pointermove，但通过 event.getCoalescedEvents() 可还原出中间所有未被上报的原始采样点，实现亚毫秒级轨迹重建。
- 仅在
pointermove回调中调用：const coalesced = event.getCoalescedEvents(); - 每个
PointerEvent元素都含完整clientX/clientY和timestamp，可用来插值或重绘平滑路径 - 注意兼容性兜底：需先检测支持性 ——
if ('getCoalescedEvents' in event)，否则退回到单事件处理
监听 touchstart/touchmove 并禁用默认行为以绕过 iOS/Android 节流
iOS Safari 和 Android Chrome 对 touchmove 默认施加严重节流（尤其在滚动中），导致绘图断点。必须在 touchstart 阶段就调用 event.preventDefault()，并设置 {passive: false}，才能获得连续、未降频的触点流。
- 仅对目标区域启用：全局禁用
touchmove会破坏页面滚动，应只对canvas或绘图容器绑定 - 需配合 CSS：容器必须设
touch-action: none，否则浏览器仍可能拦截事件 - 压力与倾斜不可用：iOS 不暴露
force或tilt，Android 厂商适配不一；如需这些字段，必须走 Pointer Events
真正容易被忽略的是：即使启用了 pointermove 和 getCoalescedEvents()，如果元素没有设置 will-change: transform 或未启用 GPU 合成层，浏览器仍可能把绘制逻辑扔进主线程做软件合成，导致高频率事件回调被卡顿阻塞 —— 这时候你拿到的是“全量事件”，但渲染根本追不上。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
