前端同步、异步、多线程

2023-11-30 14:10:38 浏览数 (1)

浏览器是多线程的,可以同时处理很多任务

GUI渲染线程: 渲染HTML/CSS代码的,最后在页面中绘制出图形 【GPU显卡】

JS引擎线程: 渲染和解析JS的

事件触发线程: 监听事件是否触发的

定时器触发线程: 监听定时器是否到达时间的

异步HTTP请求线程: 用来从服务器获取资源文件或者数据的(link/script/img/ajax...)

WebWorker

...

JS中的同步异步编程

简单来说:

同步 sync:事情必须一件一件的去做,上一件事情没有处理完,下一件事情是无法处理的

异步 async:同时处理多件事情或者是上一件事情哪怕没有处理完,下一件事情也可以继续处理

进程:一个程序(或者浏览器打开一个页面)是开辟一个进程

线程:线程是进程中具体办事的,想同时办多件事,就需要开辟多个线程(一个进程中包含多个线程)

JS是单线程的:因为浏览器只会分配一个线程(JS引擎线程)去渲染和解析JS,所以在JS中大部分代码都是同步的

循环是同步的

避免死循环:死循环会占用JS引擎线程,导致这个线程无法再去处理其他程序了。

JS中有部分异步编程代码

异步微任务

  • requestAnimationFrame (有争议)
  • Promise.then/catch/finally
  • async/await
  • queueMicrotask
  • IntersectionObserver
  • MutationObserver
  • process.nextTick (Node) ... 异步宏任务
  • 定时器 setTimeout/setInterval
  • 事件绑定/队列
  • XMLHttpRequest(ajax)/Fetch
  • MessageChannel
  • setImmediate (Node) ...

0 人点赞