html注意

1. 減小http請求數
   • 雪碧圖合併
   • js合併 （通常合併到3~5個，css相似）
   • css合併
2. 減小DNS查找次數
   • 不要在一個網站中有太多域
   • 用到CDN靜態服務器
   • DNS預解析

1.  
   // DNS 預解析
2.  
   <mate http-equiv="x-dns-prefetch-control" content="on"/>
3.  
   <link rel="dns-prefetch" href="http://bdimg.share.baidu.com" />
4.  
   <link rel="dns-prefetch" href="http://nsclinck.baidu.com" />

1. 儘可能免去沒必要要的跳轉，好比index跳轉到home
   • 瀏覽器會把用戶指向到Location中執行的URL中。
   • 301（永久移到新位置）和302（暫時移到新位置）都不會被緩存，除非加一個額外的頭選項，Expires或則Cache-Control來指定它緩存。
   • meta元素的刷新標籤和JS也能夠實現URL的跳轉，可是若是必需要跳轉最好的方法就是使用3XXHTTP狀態碼，爲了確保後退正確使用。
2. 可緩存的AJAX
   • 就是咱們進行一次AJAX請求後，把資源進行緩存。
   • 由於「異步」並不意味着「即時」
   • add an expires or a cache-control header
   • Nginx靜態文件設置緩存
   • 其它幾條一樣適用ajax：
     • gzip壓縮文件
     • 減小DNS查找數
     • 精簡JS
     • 避免跳轉
     • 配置ETags（這個也是後端來配置的，前端設置cache爲true，緩存多久是經過請求報頭設置的，前端經過beforSend裏設置setRquestHeader，後端在response.expires裏設置）link，若是不設置，後端直接吐就行
     • 注意：並非前端在ajax裏面設置cache:true就能夠緩存了的，http1.0裏面沒實現，在2.0裏面實現了。
   • 並且若是設置ajax請求的話儘可能設置成get。16：15
3. 推遲加載內容
   • 滑動加載
   • 移動端 模板（先吐最重要的）+異步加載 由於在移動端上發ajax比較耗時，這個就須要模板和後端共同配合把它吐出來，pc就無所謂了
4. 預加載
   • 頁面預加載link
   • 有幾種預加載方法：
     • 無條件預加載：觸發onload事件時，直接加載額外的頁面內容。預加載學好比
     • 有條件預加載：根據操做去預加載相應的內容。
     • 有預期的加載：從新設計過的頁面加載很慢，由於以前有過完整的緩存，這時就能夠在新站訪問以前就加載一部份內容來避免這種結果的出現。
5. 減小DOM元素數
6. 根據域名劃分頁面內容
   • 因爲DNS查找，確保使用的域名數在2~4個之間。
7. 使iframe的數量減小
   • 優勢：一、解決加載緩慢的第三方內容如圖標和廣告等的加載問題。二、並行加載腳本
   • 缺點：一、即時內容爲空，記載也須要時間。二、會阻止頁面加載。三、沒有語義
8. 不要出現404錯誤
9. 使用內容分發網絡
   • CDN
   • 上線個人css、js、img不能和你的代碼放到一塊兒，必定要放到靜態服務器上，讓用戶最快的訪問到
10. 爲文件頭指定Expires或cache-Control
    • 對於靜態內容：設置文件頭過時時間Expires的值爲「Never expire」（永不過時）
    • 對於動態內容：使用恰當的cache-Control文件頭來幫助瀏覽器進行有條件的請求
    • Etag是能夠動態調的更加靈活，而這個是設了多久就是多久，記得加上版本號。
11. Gzip壓縮文件內容 gzip
12. 配置ETag
13. 儘早刷新輸出緩存（模板加載完就用flush吐出，如今經常使用中間層來作。後臺只去作和數據庫有關的東西）
14. 使用GET來完成AJAX請求
    • 由於post會分兩步走，先發送文件頭，再發送數據，並且post
    • get直接放到URL上發走了,IE上URL請求不能超過2k
    • 可是一個有趣的不一樣是，get意味着獲取數據，post意味着發送數據
15. 把樣式表置於頂部
16. 避免使用css表達式
17. 使用外部js、css文件
18. 削減JS和CSS
19. 用<link>代替@import
    • 應爲import是串行的，會阻塞
20. 避免使用濾鏡
    • IE屬性獨有的AlphaImageLoader，用於修正7.0如下版本
21. 把腳本置於底部
22. 剔除重複腳本
    • 兩個jQuery.js
23. 減小DOM訪問
    • 取到一個button元素，儘可能把它緩存起來
24. 開發智能事件處理程序
    • 使用代理，用DOMready代替onload
25. 減小cookies體積
26. 對於內容頁面使用無cookie域名
27. 優化圖像（壓縮）
    • 使用imagemagick獲取多少種顏色，嘗試把gif壓縮成png，除了動畫用gif
28. 優化CSS Spirite
29. faicon.ico要小並且可緩存
    • 最好小於1k，給它設置Expires文件頭作緩存
30. 保持單個內容小於25k
31. 打包組件成複合文本
    • js和css寫在一塊兒，*.jscss 如今網絡發展已經用的很少了