WEB開發客戶端優化方法

1、影響網站性能的來源5%來自後端,而前端達到了95%
2、這些研究成果來自不斷的量化、性能研究和時間
具體的14條準則:
Make Fewer HTTP Requests
減少服務端的請求數量(小圖片合併成一個圖片,通過CSS定位來定位圖標,更好的利用瀏覽器的緩存功能,JavaScript儘可能合併爲一個文件,樣式表也要合併成一個文件)
Use a Content Delivery Network
儘量使用內容分發功能,通過內容靜態化,使內容儘可能的接近用戶
Add an Expires Header
文件增加一個過期頁頭
Gzip Components
使用Gzip進行頁面壓縮
Put CSS at the Top
將樣式表文件放到<head>標籤中,因爲在IE中CSS文件沒有加載完會影響頁面的展示
Move Scripts to the Bottom
將腳本文件放到頁面底部,因爲JavaScript在處理的過程中會阻塞後邊的文件
Avoid CSS Expressions
避免樣式文件過期
Make JavaScript and CSS External
將腳本和樣式文件放到外部
Reduce DNS Lookups
減少DNS的解析時間
Minify JavaScript
最小化腳本,例如混淆腳本
Avoid Redirects
避免跳轉
Remove Duplicate Scripts
移除重複腳本
Configure ETags
配置ETags
Make Ajax Cacheable
使用Ajax緩存
補充:
1、頁面採用xhtml,採用Div+Css佈局,將樣式表和xhtml文件分開,使樣式文件可以做緩存處理
2、目前大多數瀏覽器都支持Gzip,可以將文本、靜態頁面、樣式表、腳本進行壓縮,減少內存讀取時間
3、可以通過緩存服務器如squid進一步提高客戶端的訪問性能
4、限制Cookie的應用域、響應目錄和過期時間,減少Cookie的請求,一個3k的Cookie能夠增加延遲到80ms
5、頁面由2~4個不同域名的服務器提供服務能提高速度,如頁面由A提供,樣式由B提供,圖片由C提供,這樣瀏覽器可以同時從多個服務器下載文件
6、對爬蟲進行限制
7、訪問壓力過大也要考慮集羣處理
8、做好數據庫的優化工作
綜上可以看出前端的優化主要是極大的利用瀏覽器的緩存特性,從而達到幾乎本地的訪問速度,同時儘可能的降低對服務器性能的消耗,而這些前端優化是我們在日常工作中可以做到的。 
發佈了45 篇原創文章 · 獲贊 2 · 訪問量 20萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章