web性能提升

優化TCP性能

將服務器內核升級到最新版本(Linux:3.2+)

1.增大TCP的初始擁塞窗口

把服務器的初始cwnd值增大到RFC 6928新規定的10段（IW10），是提升用戶體驗以及所有TCP應用性能最簡單的方式

2.慢啓動重啓

在連接空閒時禁用慢啓動可以改善瞬時發送數據的長TCP連接的性能。

3.窗口縮放

啓用窗口縮放可以增大最大接受窗口的大小，可以讓高延遲的連接達到更好的吞吐量。

4.TCP快速打開

在某些條件下，允許在第一個SYN分組中發送應用程序數據。TFO（TCP Fast Open，TCP快速打開）是一種新的優化選項，需要客戶端和服務器共同支持。爲此，首先要搞清楚你的應用程序是否可以利用這個特性。

4.1 減少傳輸冗餘的數據

4.2壓縮要傳輸的數據

4.3把服務器放到離用戶最近的地方（cdn）

4.4盡最大可能重用已建立的TCP連接。

 

 

性能打點（可參考Navigator Timing）

兼容性 https://caniuse.com/#search=nav-timing

function init() {
performance.mark("startTask1")
applicationCode()
performance.mark('endTask1')
logPerformance()
}


function logPerformance() {
   let perfEntries = performance.getEntriesByType('mark');
   for(let i = 0;i<perfEntries.length;i++){
        console.log(`Name: ${perfEntries[i].name},Type: ${perfEntries[i].startTime},Ducation: ${perfEntries[i].duration}`)
    }
   console.log(performance.timing);
}

預加載以觸發瀏覽器爲我們採用的優化機制

1.預解析特定的域名
<link rel="dns-prefetch"  href="//hostname_to_reslove.com">
2.預取得頁面後面要用的關鍵性資源
<link rel="subresource"  href="javascript/myApp.js">
3.預取得將來導航要用到的資源
<link rel="prefetch"  href="//xxx.big.jpeg">
4.根據對用戶下一個目標的預測，預渲染特定的頁面
<link rel="prerender"  href="//hostname_to_reslove.html">

warning: 注意各大瀏覽器的兼容性

 

參考

1.web性能權威指南