成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

從輸入URL地址到顯示完整的頁面Webkit都做了哪些事情

468122151 / 3152人閱讀

摘要:從輸入地址到顯示完整的頁面都做了哪些事情從輸入地址到獲取到數(shù)據(jù)的流程輸入地址如。從獲取到數(shù)據(jù)到顯示最終完整頁面的流程在輸入之后,依賴網(wǎng)絡模塊,資源加載器加載網(wǎng)頁只要是能夠解析的,都會把輸入的地址資源當成解析。

從輸入URL地址到顯示完整的頁面Webkit都做了哪些事情 從輸入地址到獲取到數(shù)據(jù)的流程

1、輸入URL地址,如:http://www.yejm16361.com/demo...。

2、DNS解析URL地址中的域名返回IP地址(如果是主機名是IP地址就跳過該步驟)。

3、 建立TCP連接,這就是經(jīng)典的TCP連接中的三次握手,總的來說作用就是為了在不可靠信道上能夠可靠的傳輸

4、瀏覽器向 web 服務器發(fā)送一個 HTTP 請求命令,如:GET/demo/index.html HTTP/1.1。

5、瀏覽器向 web 服務器發(fā)送請求頭信息。

6、Web服務器應答,如:HTTP/1.1 200 OK,包含應答協(xié)議版本號和狀態(tài)碼。

7、Web服務器發(fā)送應答頭信息。

8、Web服務器向瀏覽器發(fā)送數(shù)據(jù)。

9、Web服務器關(guān)閉TCP連接(如果瀏覽器或者服務器在其頭信息加入了這行代碼:Connection:keep-alive就延時跳過該步驟,超時仍然會關(guān)閉TCP連接,超時時間一般是5秒或15秒)。

從獲取到數(shù)據(jù)到顯示最終完整頁面的流程

1、在輸入URL之后,依賴網(wǎng)絡模塊,webkit資源加載器加載HTML網(wǎng)頁(只要是webkit能夠解析的,都會把輸入的URL地址資源當成HTML解析)。

2、加載完HTML網(wǎng)頁之后,就會調(diào)動HTML解析器解析構(gòu)建節(jié)點

3、解析期間如果遇到link節(jié)點,就會調(diào)用資源加載器異步加載,完成之后用css解析器解析執(zhí)行;如果是行內(nèi)樣式,會立即交給CSS解析器解析執(zhí)行。這里CSS解析器,解析結(jié)果會生成一個css rule tree(css規(guī)則樹)。

4、解析期間如果遇到script節(jié)點,就調(diào)用javascript解析器解析并執(zhí)行,這里注意的是如果是src腳本,那么在設(shè)置了H5新加的async屬性的時候會異步加載加載并執(zhí)行,否則會同步加載解析并執(zhí)行,且阻塞dom樹的創(chuàng)建;如果是行內(nèi)腳本,那么無論怎么設(shè)置都會立即解析并執(zhí)行,且阻塞dom樹的創(chuàng)建。這里Javascript腳本執(zhí)行主要是通過DOM API和CSSOM API來操作DOM樹和CSS規(guī)則樹。

5、解析期間如果遇到節(jié)點會依賴其他資源,如:圖片,視屏,語音等,webkit會調(diào)用相應的加載器利用網(wǎng)絡模塊,去異步加載解析

6、等到所有的同步和異步資源解析完成之后,瀏覽器引擎會把DOM樹中無需渲染的節(jié)點(如display:none修飾的節(jié)點)不放進Rendering Tree(渲染樹)中,并把CSS規(guī)則樹中的樣式附加給渲染樹相應的dom節(jié)點,然后計算每一個dom節(jié)點的位置,這也就是layout(布局)和reflow(重排,回流)過程。

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://m.hztianpu.com/yun/84712.html

相關(guān)文章

  • 【前端】輸入頁面地址展示頁面信息 瀏覽器和服務器做了什么

    摘要:很久以前理解過一個從在瀏覽器地址欄輸入,經(jīng)常建站但是不明白原理,總結(jié)一下。瀏覽器地址欄輸入瀏覽器會先查看瀏覽器緩存系統(tǒng)緩存路由緩存,如有存在緩存,就直接顯示。 很久以前理解過一個URL從在瀏覽器地址欄輸入,經(jīng)常建站但是不明白原理,總結(jié)一下。 showImg(https://segmentfault.com/img/bVbj2Rv?w=512&h=502); 1、瀏覽器地址欄輸入url ...

    Atom 評論0 收藏0
  • 輸入 url 頁面展現(xiàn)短短幾秒內(nèi)瀏覽器究竟做了什么?

    摘要:在上述過程再細化為瀏覽器搜索自己的緩存。至此,瀏覽器已經(jīng)得到了域名對應的地址。具體過程如下在中這一過程如下首先是字節(jié)流,經(jīng)過解碼之后是字符流,然后通過詞法分析器會被解釋成詞語,之后經(jīng)過語法分析器構(gòu)建成節(jié)點,最后這些節(jié)點被組建成一棵樹。 面試的時候,我們經(jīng)常會被問從在瀏覽器地址欄中輸入 url 到頁面展現(xiàn)的短短幾秒內(nèi)瀏覽器究竟做了什么?那么瀏覽器到底做了啥? 瀏覽器的多進程架構(gòu)一個好的程...

    dackel 評論0 收藏0
  • 輸入 url 頁面展現(xiàn)短短幾秒內(nèi)瀏覽器究竟做了什么?

    摘要:在上述過程再細化為瀏覽器搜索自己的緩存。至此,瀏覽器已經(jīng)得到了域名對應的地址。具體過程如下在中這一過程如下首先是字節(jié)流,經(jīng)過解碼之后是字符流,然后通過詞法分析器會被解釋成詞語,之后經(jīng)過語法分析器構(gòu)建成節(jié)點,最后這些節(jié)點被組建成一棵樹。 面試的時候,我們經(jīng)常會被問從在瀏覽器地址欄中輸入 url 到頁面展現(xiàn)的短短幾秒內(nèi)瀏覽器究竟做了什么?那么瀏覽器到底做了啥? 瀏覽器的多進程架構(gòu)一個好的程...

    2json 評論0 收藏0
  • 輸入 url 頁面展現(xiàn)短短幾秒內(nèi)瀏覽器究竟做了什么?

    摘要:在上述過程再細化為瀏覽器搜索自己的緩存。至此,瀏覽器已經(jīng)得到了域名對應的地址。具體過程如下在中這一過程如下首先是字節(jié)流,經(jīng)過解碼之后是字符流,然后通過詞法分析器會被解釋成詞語,之后經(jīng)過語法分析器構(gòu)建成節(jié)點,最后這些節(jié)點被組建成一棵樹。 面試的時候,我們經(jīng)常會被問從在瀏覽器地址欄中輸入 url 到頁面展現(xiàn)的短短幾秒內(nèi)瀏覽器究竟做了什么?那么瀏覽器到底做了啥? 瀏覽器的多進程架構(gòu)一個好的程...

    tigerZH 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<