浏览器中 Javascript 的加载原理

在讲这个问题之前,先来补充几个知识点,如果对此已经比较了解可以直接跳过。

大多数浏览器的组件构成如图

浏览器中 Javascript 的加载原理_第1张图片

在最底层的三个组件分别是网络,UI后端和js解释器。作用如下:

  1. 网络- 用来完成网络调用,例如http请求,它具有平台无关的接口,可以在不同平台上工作。
  2. UI 后端- 用来绘制类似组合选择框及对话框等基本组件,具有不特定于某个平台的通用接口,底层使用操作系统的用户接口。
  3. JS解释器- 用来解释执行JS代码。

大多数浏览器(比如chrome)让一个单线程共用于执行javascrip和更新用户界面。这个线程通常被称为“浏览器UI线程”, 每个时刻只能执行其中一种操作,这意味着当Javascript代码正在执行时用户界面无法响应输入,反之亦然。这样做是因为javascript代码的作用就是操作DOM更新用户界面,用同一个线程来做负责这两件事情可以更高效

浏览器UI线程的工作基于一个简单的队列系统,任务会被保存到队列中直到进程空闲。一旦空闲,队列中的下一个任务就被重新提取出来并运行。这些任务要么是运行javascript代码,要么执行UI更新,包括重绘和重排。

重点再强调下,javascript是单线程运行,千万别被setTimeout()和setInterVal()这种函数迷惑而误以为它是多线程。

ok,基础点讲解完毕,让我们进入正题,来讲解在浏览器中javascript的执行原理

一般而言,

你可能感兴趣的:(JavaScript)