长任务：
提示：理解长任务
浏览器执行耗时操作超过50ms就是长任务
JavaScript 单线程
同步任务：同步任务指的是，在主线程上排队执行的任务，只有前一个任务执行完毕，才能执行后一个任务。
异步任务：异步任务指的是，不进入主线程，而进入任务队列的任务，只有“任务队列”通知主线程，某个异步任务可以执行了，该任务才会进入主线程执行。
事件循环
- 所有的同步任务都在主线程上执行，形成了一个执行栈。
- 主线程外，还存在一个“任务队列”。只要异步任务有了运行结果，就在“任务队列”中放置一个事件
- 一旦执行栈中的所有同步任务执行完毕，系统就会读取“任务队列”，看看里面有哪些事件，哪些对应的异步任务，于是结束等待状态，进入执行栈，开始执行
- 主线程不断重复上面的第三步、这个过程就是事件循环
异步任务又分为宏任务、微任务
懒得写-------
出现长任务的原因：
例如： 要执行一个运算量很大的函数，他要加载一个 loading，页面中也不会立刻出现 loading 动画，出现动画的时候是运算函数执行完毕之后。
解决方案：
- 通过 Web Worker 开辟一个新线程，在 Web Worker 中执行耗时操作 需要请点击最详情
- 时间切片，将耗时操作分批次处理 需要请点击查看最详情
Web Worker：
核心思想：可以将一些耗时的数据处理操作从主线程中剥离，使主线程更加专注于页面渲染和交互 Worker 线程和主线程都通过 postMessage() 方法发送消息，通过 onmessage 事件接收消息。在这个过程中数据并不是被共享的，而是被复制的
- 懒加载
- 处理页面有计算密集型的任务
- 文本分析
- 流媒体数据处理
- canvas 图形绘制
- 图像处理
需要注意的点
- 有同源限制
- 无法访问 DOM 节点
- 运行在另一个上下文中，无法使用Window对象
- Web Worker 的运行不会影响主线程，但与主线程交互时仍受到主线程单线程的瓶颈制约。换言之，如果 Worker 线程频繁与主线程进行交互，主线程由于需要处理交互，仍有可能使页面发生阻塞
- 共享线程可以被多个浏览上下文（Browsing context）调用，但所有这些浏览上下文必须同源（相同的协议，主机和端口号）
|