JS长任务拆分核心是主动管理主线程控制权归属时机与粒度：确保单次执行≤50ms，按任务性质选用setTimeout、requestIdleCallback或Web Worker分片，宏任务锚定切片边界，微任务衔接批内操作，配合动态粒度校准与DOM优化。

JS 长任务拆分的核心设计思想不是“把大任务切成小块”，而是**主动管理主线程控制权的归属时机与粒度**：确保单次同步执行 ≤50ms，为浏览器留出渲染、响应输入和驱动动画的空隙。调度算法的关键不在“快”，而在“准”——在正确的时间点、用正确的机制、让出恰好的控制权。

以 50ms 为硬边界，按任务性质动态选型

不同任务对调度敏感度差异极大，不能统一用 setTimeout 拆分：

• 海量 DOM 渲染（如万级列表）：优先用 requestIdleCallback + 可视区判断，每轮处理 ≤2ms，按“天”“行”“单元格”等逻辑块切片，避免滚动中卡顿
• 启动期初始化（如 SPA 加载）：分离三类任务——根节点挂载等必须同步；埋点 SDK、非首屏预加载走 requestIdleCallback({ timeout: 2000 })；本地大数据索引则用 setTimeout 分片，每批 300 条后让权
• 纯计算密集型（如 JSON 转树、坐标批量转换）：禁用 for 循环到底，改用 chunked 分片 + setTimeout 锚定宏任务边界；若完全无 DOM 依赖，直接移交 Web Worker

宏任务打底、微任务衔接、idle 补位的三层调度协作

三者不是替代关系，而是分层协作：

dmap-jsapi-skill

DMap GL地图JSAPI（dmapgl）开发指南。用于编写、审查、调试 DMap 地图 API 代码，涵盖地图初始化、覆盖物渲染、图层管理、事件处理、控件交互等任务。当用户提及 dmap、dmapgl、jsapi‑gl 或相关地图开发需求时自动触发。

下载

• 宏任务（setTimeout/setImmediate）：唯一能真正释放渲染权的手段，作为主切片锚点。例如“处理完一批数据 → setTimeout 启动下一批”
• 微任务（queueMicrotask）：用于批内快速串联，比如“校验→格式化→暂存到数组”，全程不释放主线程，但零延迟衔接，不可用于跨批调度
• requestIdleCallback：最贴合浏览器调度意图的方式，自动避开高优帧；必须配合 deadline.timeRemaining() > 1 判断，并设 { timeout: 2000 } 防止饥饿

切片粒度需动态校准，而非固定值

静态分 100 条/批在低端机可能超时，在高端机又浪费空闲资源：

• 冷启动参考 navigator.deviceMemory 和 navigator.hardwareConcurrency 设初始批大小（如 2GB 内存 → 初始 30 条）
• 每轮用 performance.now() 打点，若连续两次耗时 >2ms，自动将批大小 ×0.7
• 监听 scroll 或 visibilitychange 事件，高频滚动时临时收紧粒度至原 1/3
• 设硬边界：最小不小于 10 条，最大不超过 200 条，防震荡或过度调度

配套轻量优化决定拆分是否真正生效

只拆任务不优化周边，性能提升会大打折扣：

• DOM 批量插入统一走 DocumentFragment，避免反复 layout 触发
• 禁止在循环中读取 offsetHeight、getBoundingClientRect() 等强制重排属性；位置计算尽量前置缓存
• 交互监听器（如按钮 click、拖拽）延迟绑定，用 IntersectionObserver 在元素入视口后再挂载
• 状态必须持久化：索引、中间结果、中断标志存在闭包或对象中，不可依赖局部变量重置