html頁面渲染的原理和優化

2022-08-12 21:33:15 字數 530 閱讀 3844

乙個html網頁載入的大概過程

1.使用者輸入**,(假定是第一次訪問),瀏覽器向伺服器發出請求,伺服器返回html檔案;

2.瀏覽器開始載入html**,發現head標籤內有乙個link標籤引用外部css檔案,那麼瀏覽器發出css檔案的請求,等待伺服器返回css檔案;

3.瀏覽器繼續載入裡面的**,並且css**已經拿到手了,開始渲染介面了。

5.瀏覽器發現了一行js**的的**,立刻執行js,js指令碼執行了這條語句,它命令瀏覽器隱藏掉某個,由於少了乙個元素,瀏覽器不得不從新進行重新渲染這部分**。

6.終於等到的歸來,瀏覽器淚流滿面。

7.等等,還沒完。使用者點選了一下介面中的換膚按鈕,js讓瀏覽器換了一下的css標籤,於是瀏覽器召集了在座的各位<div><span><ul><li>們,「大夥兒收拾收拾行李,咱得重新來過……」,瀏覽器向伺服器請求了新的css檔案,重新渲染頁面。

js的阻塞特性:

js的優化:

1.要使用高效的選擇器。

2.將選擇器儲存為區域性變數

3先操作再顯示。

Html頁面渲染

瀏覽器與伺服器的互動 瀏覽器的主要功能是將使用者選擇的web資源呈現出來,它從伺服器請求資源,並將得到的資源 html,pdf,image等等 顯示在瀏覽器視窗。那麼從使用者敲入url到完整渲染出來,經歷了什麼過程呢?也就是說整個瀏覽器的工作流程是怎樣的呢?整個過程大致如下 1.輸入url,瀏覽器根...

html渲染順序和優化

部落格已經遷移到 html渲染順序 4 js,css如果有重定義,後定義函式覆蓋前定義函式 js載入 2 所以,js可以非同步載入,也可以寫在html文件的最下面。加快html頁面載入速度 1.頁面 a.刪除不必要的注釋和空格 b.將inline 內嵌 寫在html內 css,js外鏈的形式匯入 c...

頁面渲染原理

渲染引擎 渲染引擎可以顯示html xml文件及,它也可以借助外掛程式 一種瀏覽器擴充套件 顯示其他型別資料,例如使用pdf閱讀器外掛程式可以顯示pdf格式。不同的瀏覽器有不同的渲染引擎 trident mshtml 核心 ie,maxthon,tt,the world,360,搜狗瀏覽器等 gec...