一笤虫、瀏覽器渲染頁面的原理及流程
瀏覽器將域名通過網(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對(duì)DOM操作動(dòng)作的大小，瀏覽器對(duì)頁面進(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ū)別
它們?cè)诠δ苌鲜菦]有區(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對(duì)象的指向問題不僅有call吨凑，apply，bind方法户辱，也可以使用that變量來固定this的指向鸵钝。
附菜鳥教程https://www.runoob.com/w3cnote/js-call-apply-bind.html，不明的話看一看官方的解釋庐镐，在此不做舉例了恩商。。必逆。
