update: image source

Chapter2 - Web FrontEnd/2.31.md

@@ -5,7 +5,7 @@
 从安全性、高性能等原因出发，目前浏览器已经是多进程架构模式，至于演进历史，本文不再展开，感兴趣的可以查看这篇[“Electron” 一个可圈可点的 PC 多端融合方案]()文章。
 
 现在的架构设计如下：
-![最新 Chrome 进程架构图](./../assets/2020-05-07-ChromeMordernArch.png)
+![最新 Chrome 进程架构图](https://github.com/FantasticLBP/knowledge-kit/raw/master/assets/2020-05-07-ChromeMordernArch.png)
 
 一个页面最少包括：1个网络进程、1个浏览器进程、1个 GPU 进程、多个渲染进程、多个插件进程
 
@@ -47,7 +47,7 @@
 
 熟悉其他系统设计的同学可能会立马想到用**队列**来解决问题。浏览器对这个 case 也采用队列，叫做事件队列。
 
-<img src="./../assets/JSMainThreadEventLoop.png" style="zoom:30%;">
+<img src="https://github.com/FantasticLBP/knowledge-kit/raw/master/assets/JSMainThreadEventLoop.png" style="zoom:30%;">
 
 
 
@@ -88,7 +88,7 @@
 
 应对这种情况，浏览器采用异步的设计来解决，如下图
 
-<img src="./../assets/JSEventloop.png" style="zoom:40%;">
+<img src="https://github.com/FantasticLBP/knowledge-kit/raw/master/assets/JSEventloop.png" style="zoom:40%;">
 
 使用异步的方案，可以使得主线程不等待、不阻塞，高效有序的执行逻辑。
 
@@ -148,15 +148,15 @@
 
 T0 时刻：最开始的时候，主线程没有任务任务需要执行。但是主线程告诉交互线程，你需要监听用户的点击事件，点击后需要执行 callback
 
-<img src="./../assets/JS-UIClickLag1.png" style="zoom:60%;">
+<img src="https://github.com/FantasticLBP/knowledge-kit/raw/master/assets/JS-UIClickLag1.png" style="zoom:60%;">
 
 T1时刻：当用户点击后，交互线程会把 callback 封装成一个任务，添加到事件循环队列的尾部。此时主线程依旧没有任务，所以主线程事件循环将被唤醒，从事件队列的头部取出一个任务去执行。大的一个任务里包含2个子事件：修改 DOM 和 延迟3秒。修改 DOM 这句指令执行后，浏览器要想看的见，需要内部会产生一个绘制任务（硬件设备显示图形的画家算法）。绘制任务被添加到事件队列尾部后，立马执行延迟3秒的事件。
 
-<img src="./../assets/JS-UIClickLag2.png" style="zoom:60%;">
+<img src="https://github.com/FantasticLBP/knowledge-kit/raw/master/assets/JS-UIClickLag2.png" style="zoom:60%;">
 
 T2时刻：到达T2时刻后，主线程又空了，此时从事件队列中读取绘制任务。进而去显示出 DOM 文本修改后的结果（但此时前面已经等待了3秒钟，所以体感上会有一种卡顿的现象）
 
-<img src="./../assets/JS-UIClickLag3.png" style="zoom:60%;">
+<img src="https://github.com/FantasticLBP/knowledge-kit/raw/master/assets/JS-UIClickLag3.png" style="zoom:60%;">
 
 
 
@@ -198,7 +198,7 @@ T2时刻：到达T2时刻后，主线程又空了，此时从事件队列中读
 
 
 
-QA：JS 计时器准吗？
+## JS 计时器准吗？
 
 不准。存在以下几个原因：
 
@@ -208,14 +208,15 @@ QA：JS 计时器准吗？
 - 受事件循环的影响，计时器的回调函数只能在主线程空闲时运行，因此又带来了偏差
 
 
-
-
-
-
-
-
-
-
+## 计算机的时间
+没有时间，我们的生活将无序，无法度量。计算机更是如此，比如纳秒级的运算，那么计算机到底是如何感知时间的呢？
+计算机依靠**晶振**（全称是石英晶体振荡器），是一种高精度、高稳定度的振荡器。位置一般在主板上，晶振为系统提供很稳定的脉冲信号，一秒内产生的脉冲次数也被称为系统时钟频率。一个标准的脉冲信号如下：
+![](https://github.com/FantasticLBP/knowledge-kit/raw/master/assets/time-pulse.png)
+几个概念：
+- 时钟周期：这里的时钟就是晶振，也就是晶振周期/振荡周期。是计算机的最小时间单元，其他周期只能是它的倍数
+- 机器周期性：既生瑜何生亮？时钟周期太小了，小到表述很多东西不够方便。到了 CPU 操作层面来说时钟周期不好用，类似人民币，虽然早期有1分钱，但某个商品价格比较大，需要1238902分，咋感觉这个单位不那么好用了，所以设计了100百元这个度量单位。一个机器周期等于多个时钟周期，它是 CPU 的一个基本操作时间单元，比如：取指、译码、存储器读/写、运算等等操作
+- 指令周期：是 CPU 完成一条指令的时间，又称为提取-执行周期（fetch-and-execute cycle），是指 CPU 要执行一条指令经过的步骤，由若干机器周期组成。不同的机器分解指令周期的方式不同。
+- 总线周期：它是 CPU 操作指令设备的时间，由于存储器和 I/O 端口是挂接在总线上的，对它们的访问是通过总线实现的。通常将进行一次访问所需时间称为一个总线周期。这种访问速度较慢，因硬件设备发展的原因，各个设备的工作频率无法同步（周期不一致），甚至相差好几个数量级，CPU 很快，硬盘很慢，大家又需要协同工作，所以出现了**分频**的概念。将高频信号变成低频信号。