一、瀏覽器渲染頁面的原理及流程
瀏覽器將域名通過網(wǎng)絡(luò)通信從服務(wù)器拿到html文件后，如何渲染頁面呢？
1.根據(jù)html文件構(gòu)建DOM樹和CSSOM樹。構(gòu)建DOM樹期間，如果遇到JS，阻塞DOM樹及CSSOM樹的構(gòu)建，優(yōu)先加載JS文件，加載完畢，再繼續(xù)構(gòu)建DOM樹及CSSOM樹。
2.構(gòu)建渲染樹（Render Tree）。構(gòu)建渲染樹，根據(jù)渲染樹計(jì)算每個(gè)可見元素的布局，并輸出到繪制流程，將像素渲染到屏幕上。
（渲染樹（Render Tree）由DOM樹、CSSOM樹合并而成，但并不是必須等DOM樹及CSSOM樹加載完成后才開始合并構(gòu)建渲染樹。三者的構(gòu)建并無先后條件，亦非完全獨(dú)立，而是會(huì)有交叉，并行構(gòu)建。因此會(huì)形成一邊加載，一邊解析，一邊渲染的工作現(xiàn)象。）
3.頁面的重繪（repaint）與重排（reflow，也有稱回流）。頁面渲染完成后，若JS操作了DOM節(jié)點(diǎn)，根據(jù)JS對DOM操作動(dòng)作的大小，瀏覽器對頁面進(jìn)行重繪或是重排。
? 基本原理如下：
1、瀏覽器內(nèi)核拿到內(nèi)容后，渲染步驟大致可以分為以下幾步：
2、解析HTML，構(gòu)建DOM樹
3、解析CSS，生成CSS規(guī)則樹
4、合并DOM樹和CSS規(guī)則，生成render樹（DOM樹和CSSOM樹連接在一起形成render tree .‘渲染數(shù)’）
5、布局render樹（Layout/reflow），負(fù)責(zé)各元素尺寸、位置的計(jì)算
6、繪制render樹（paint），繪制頁面像素信息
7、瀏覽器會(huì)將各層的信息發(fā)送給GPU，GPU會(huì)將各層合成（composite），顯示在屏幕上
二、call,apply和bind的區(qū)別及擴(kuò)展
1、call,apply和bind的區(qū)別
它們在功能上是沒有區(qū)別的，都是改變this的指向，它們的區(qū)別主要是在于方法的實(shí)現(xiàn)形式和參數(shù)傳遞上的不同。call和apply方法都是在調(diào)用之后立即執(zhí)行的。而bind調(diào)用之后是返回原函數(shù)，需要再調(diào)用一次才行，
2、總結(jié)一下call，apply，bind方法：
a：第一個(gè)參數(shù)都是指定函數(shù)內(nèi)部中this的指向（函數(shù)執(zhí)行時(shí)所在的作用域），然后根據(jù)指定的作用域，調(diào)用該函數(shù)。
b：都可以在函數(shù)調(diào)用時(shí)傳遞參數(shù)。call，bind方法需要直接傳入，而apply方法需要以數(shù)組的形式傳入。
c：call，apply方法是在調(diào)用之后立即執(zhí)行函數(shù)，而bind方法沒有立即執(zhí)行，需要將函數(shù)再執(zhí)行一遍。有點(diǎn)閉包的味道。
d：改變this對象的指向問題不僅有call，apply，bind方法，也可以使用that變量來固定this的指向。
附菜鳥教程https://www.runoob.com/w3cnote/js-call-apply-bind.html，不明的話看一看官方的解釋，在此不做舉例了。。。
