問題背景
在開發好頁面后，如何讓頁面更快更好的運行，是區分一個程式猿技術水平和視野的一個重要指標，所以面試時，面試官總會問你一個問題，如何進行性能優化呢？
性能優化是什么
從前端的角度來說，性能優化可以分為兩個方向，從用戶角度來看，一個是頁面加載的很快，另一個是頁面使用起來很流暢，因此，對性能優化的探索，我們可以分為頁面加載時間跟頁面運行效率兩個方向來進行研究
從瀏覽器打開到頁面渲染完成，花費了多少時間
瀏覽器決議->查詢快取->dns查詢->建立鏈接->服務器處理請求->服務器發送回應->客戶端收到頁面->決議HTML->構建渲染樹->開始顯示內容(白屏時間)->首屏內容加載完成(首屏時間)->用戶可互動(DOMContentLoaded)->加載完成(load)如果我們要進行加載時間的優化，我們需要從這里的每一個步驟都去思考，去總結，而避免東湊一點，西湊一點，
頁面加載時間監控
在對這些環節進行優化之前，我們需要知道如何監控這些環節花費了多少時間，
可以獲取到很多頁面加載相關的資料，比較常用的有
- DNS決議時間： domainLookupEnd - domainLookupStart
- TCP建立連接時間： connectEnd - connectStart
- 白屏時間： responseStart - navigationStart
- dom渲染完成時間： domContentLoadedEventEnd - navigationStart
- 頁面onload時間： loadEventEnd - navigationStart
如果不使用該API，可以以服務器渲染回傳的時間，或是SPA路由跳轉離開的時間為起點，domContentLoaded，load等事件為結束點進行記錄，或是直接上google analytics，方法很多，就不細說了，
服務器部分優化要點
后端部分可以對快取，dns查詢時間，鏈接時間，處理請求時間，回應時間等進行優化，
dns查詢時間可以使用httpdns或是dns預加載，域名收斂等手段優化，
建立連接的重點是長連接和鏈接復用，keep-alive，long-polling，http-straming，websocket或是自己寫過別的協議，更好的是直接上http2，為了優化鏈接的環節，前端這里還需要對資源使用cdn，雪碧圖，代碼合并等手段，
服務器處理請求這里可以優化的點也不少，值得注意的就是移動端訪問PC端頁面需要跳轉到移動端頁面時，要再服務器端使用302跳轉，不要在前端進行跳轉，還有就是啟用hsts，要求瀏覽器在之后的訪問使用https，減少無謂的http跳轉https，同時還可以防止ssl剝離攻擊，提升安全性，
服務器發送回應環節，可以使用Transfer-Encoding=chunked，多次回傳回應，具體操作查詢bigpipe，還有就是減小cookie的體積等等，
推薦閱讀：
swoole通往大神之路——swoole任務中心說明及行程任務架構搭建
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/88104.html
標籤：PHP
上一篇：swoole怎么連接資料庫
下一篇：查看壓縮檔案的資訊