執行環境 頁面載入 效能優化 安全性

2021-09-08 07:00:48 字數 1673 閱讀 9111

–瀏覽器可以通過訪問鏈結來得到頁面內容

–通過繪製和渲染,顯示出頁面最終樣子

整個過程我們需要考慮

-頁面載入

-效能優化

-安全性

頁面載入

載入資源的形式

-輸入url(或頁面跳轉)載入html

載入乙個資源的過程

-瀏覽器根據dns伺服器得到網域名稱的ip位址

-向這個ip的機器傳送http(s)請求

-伺服器收到請求後處理並返回

-瀏覽器拿到返回的內容進行渲染

瀏覽器渲染頁面的過程

-根據html結構生成dom tree

-根據css生成cssom

-將dom和cssom整合生成rendertree

-根據rendertree開始渲染和展示

-遇到時會執行並阻止渲染

window.onload和domcontentloaded

效能優化

從大方向原則來說

-多使用記憶體、快取等其他方法

-減少cpu計算、減少網路

從**入手

-載入頁面和靜態資源

-靜態資源的壓縮合併

-靜態資源快取

-使用cdn讓資源載入更快(cdn能找到就近的伺服器去請求資源)

-使用ssr後端渲染,資料直接載入到html中而不用去請求ajax

-頁面渲染

-css放前,js放後面

-減少dom查詢,對dom查詢做快取

-減少dom操作,多個操作盡量合併在一起執行

-事件截流

-盡早操作(如domcontentloaded)

-資源合併:

如請求a.js、b.js、c.js合併請求abc.js (用構建工具)

-快取 通過鏈結名稱控制快取

-cdn

-ssr後端渲染(vue、react),其實jsp、php、asp都屬於後端渲染

-懶載入

個自定義屬性裡面,當需要的時候img.src=img.getattribute(自定義屬性)

-快取dom查詢

未快取for(let i = 0;i

-事件截流

-domcontentloaded
安全性

一般來說安全問題有專門人員做

前端安全問題頭哪些??

-xxs跨站請求攻擊

-如在某部落格寫文章時偷偷插入一段,**中獲取cookie傳送到自己的伺服器,別人檢視文章時,該指令碼就會執行,瀏覽者的cookie會傳送到攻擊者的伺服器

-解決:

·前端替換關鍵字,例如《替換為< >替換為》

·後端替換

-xsrf跨站請求偽造

-已登陸某購物**,付費介面是xx.com/pay?id=100,且沒有任何驗證,然後收到乙個郵件,隱藏了乙個

-解決·增加驗證流程(指紋,密碼,簡訊驗證碼...)

安全性與效能隔離

保證分布式計算的安全性,使攻擊程序無法訪問資源 1.rpc鑑別訊息是否合法 capability訪問控制 任意兩個角色間有金鑰,程序通訊前先對金鑰 動態token 口令 程序級沙箱隔離 無法看到該使用者組不需要的資源 2.效能隔離,三種虛擬化方法的比較 虛擬機器 kvm 完全虛擬化,隔離最好 資源配...

登入頁面安全性的研究

1 登入時對使用者名稱 密碼 驗證碼的合法性驗證 2 連續登入失敗後的處理策略 比如 連續失敗3次,鎖定賬號一段時間 3 使用者名稱的規則 4 密碼策略 比如 長度限制 字元限制 不能與賬號相同等 5 密碼輸入框不允許貼上複製 6 使用者登入密碼是否是可見 7 是否有密碼過期策略 8 密碼是否採取符...

web頁面載入效能優化之 gzip

web專案頁面載入效能優化可以通過開啟服務端的gzip功能來實現,目前大部分客戶端瀏覽器request內建 content encoding gzip 屬性,如果沒有可以在request中配 置加上。伺服器端tomcat 和weblogic 配置方式分別如下 1.tomcat伺服器在server.x...