页面从输入 URL 到页面加载显示完成
這題勝在區分度高，知識點覆蓋廣，再不懂的人，也能答出幾句， 而高手可以根據自己擅長的領域自由發揮，從URL規范、HTTP協議、DNS、CDN、數據庫查詢、 到瀏覽器流式解析、CSS規則構建、layout、paint、onload/domready、JS執行、JS API綁定等等；
詳細版:
1、瀏覽器會開啟一個線程來處理這個請求，對 URL 分析判斷如果是 http 協議就按照 Web 方式來處理;
2、調用瀏覽器內核中的對應方法，比如 WebView 中的 loadUrl 方法;
3、通過DNS解析獲取網址的IP地址，設置 UA 等信息發出第二個GET請求;
4、進行HTTP協議會話，客戶端發送報頭(請求報頭);
5、進入到web服務器上的 Web Server，如 Apache、Tomcat、Node.JS 等服務器;
6、進入部署好的后端應用，如 PHP、Java、JavaScript、Python 等，找到對應的請求處理;
7、處理結束回饋報頭，此處如果瀏覽器訪問過，緩存上有對應資源，會與服務器最后修改時間對比，一致則返回304;
8、瀏覽器開始下載html文檔(響應報頭，狀態碼200)，同時使用緩存;
9、文檔樹建立，根據標記請求所需指定MIME類型的文件（比如css、js）,同時設置了cookie;
10、頁面開始渲染DOM，JS根據DOM API操作DOM,執行事件綁定等，頁面顯示完成。
簡潔版:
1、瀏覽器根據請求的URL交給DNS域名解析，找到真實IP，向服務器發起請求；
2、服務器交給后臺處理完成后返回數據，瀏覽器接收文件（HTML、JS、CSS、圖象等）；
3、瀏覽器對加載到的資源（HTML、JS、CSS等）進行語法解析，建立相應的內部數據結構（如HTML的DOM）；
4、載入解析到的資源文件，渲染頁面，完成。
總結：
1、瀏覽器地址欄輸入url
2、瀏覽器會先查看瀏覽器緩存--系統緩存--路由緩存，如有存在緩存，就直接顯示。如果沒有，接著第三步
3、域名解析（DNS）獲取相應的ip
4、瀏覽器向服務器發起tcp連接，與瀏覽器建立tcp三次握手
5、握手成功，瀏覽器向服務器發送http請求，請求數據包
6、服務器請求數據，將數據返回到瀏覽器
7、瀏覽器接收響應，讀取頁面內容，解析html源碼，生成DOm樹
8、解析css樣式、瀏覽器渲染，js交互
。。。。。。。。。。。。
1、瀏覽器先檢查URL，先判斷協議，再對URL進行安全檢查，最后調用瀏覽器內核的loadURL方法
2、瀏覽器內核先查看緩存，然后設置HTTP協議，最后發送http請求
3、通過DNS拿到請求服務器IP地址，然后調用socket API對數據進行底層協議的封裝，將http數據包裝TCP/UDP包頭，在封裝IP包頭
4、將封裝好的數據包從本級網卡發送到服務器
5、服務器接收到瀏覽器請求后進行處理，然后返回html文件
6、瀏覽器接收到html文件，可能需要解壓（涉及編碼格式）
7、瀏覽器開始載入html代碼，發現<head>標簽內有一個<link>標簽引用外部css文件
8、瀏覽器又發出css文件的請求，等待服務器返回這個css文件；附：在下載css文件的過程中，不會堵塞頁面HTML加載和渲染
9、瀏覽器又發現一個<script>標簽引用外部js文件，發出js文件請求，服務器返回這個js文件；附件：在下載js文件過程中，會堵塞頁面HTML的加載和渲染，即為默認的同步腳本
10、瀏覽器執行返回的js文件腳本，此時頁面的HTML加載和渲染都被堵塞
11、瀏覽器進入<body>，此時已經有了外部css文件，一邊加載HTML，一邊渲染；
12、遇到<img>標簽的時候，瀏覽器向服務器發送請求，不用等圖片下載完，繼續加載和渲染后面的HTML
13、當服務器返回圖片的時候，由于圖片大小會影響后面的文檔排版，所以瀏覽器會回頭重新渲染<img>標簽后的所有HTML
14、遇到嵌入<script>時，瀏覽器會停止頁面的加載和渲染，改去執行<script>中的腳本，如果腳本中有改變DOM樹的代碼，那么瀏覽器會重新渲染被改變部分的html
15、直到最后解析到文檔最后，瀏覽器加載頁面才算完成。
總結
以上是生活随笔為你收集整理的页面从输入 URL 到页面加载显示完成的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： vue使用总结-生命周期篇
- 下一篇： 201621123053 张雨阳软工作业