Hi，我是浪哥，一個外貿建站老司機。
講真，這樣的一幕是否多次發生在你的生活中：
正網上衝浪調研客戶，點擊進入窗口後一片空白，左下角顯示「正在建立安全連結」、「正在等待伺服器響應」。
10秒後：
20秒後：
1分鐘後：
我想大部分人在等待了十秒後，就會因為沒有耐心而點擊窗口標籤的小叉叉。 有人會覺得浪哥就是鋼鐵直男——「你也太小看我的耐心了」，那我們來看幾組研究結果。
根據Microsoft Corp.的一項最新研究，人們通常會在8秒後對一件事情失去注意力。
另外，更有研究表明，40%的用戶會放棄一個需要加載三秒以上的網站。
而BBC官網每多加載一秒，就有10%的用戶會離開。
現在我腦海裡只有火雲邪神的忠告：
天下武功，唯快不破！
所以這次浪哥想跟大家聊聊網站用戶體驗中超超超重要的一點——網站加載速度，以及如何優化它！
1.多1秒鐘的等待，就有7%的客戶離開
不是浪哥誆你，根據Akamai research在2017年的一份調研報告，每1秒鐘的加載延遲，會造成7%的轉化下降。
客戶明明已經點擊進來了，卻被攔在大門口，我心裡那揪心的啊！
其實在日常工作中呢，我也留意到很多外貿老友對網站速度是有追求的，但是能道出其所以然的少之又少，這次給大家好好捋捋。
啥是網站加載時間？
通俗來講，一個網站的加載時間就是新窗口彈出來，到你能看見這個頁面的內容所用的時間。
所以更精準的說法應該是「網頁加載時間」。
前段時間谷歌的Webmaster Central Blog公開一則關於「評估網頁體驗」的最新消息——Chrome小組正式發布Core Web Vitals這一概念。
可以看到，在這一最新的評估準則裡，Load Time（加載時間）被放在了首位。
心裡毫無波瀾？
那現在我開始說人話：谷歌認為，一個網站的加載速度非常重要！如果你在這方面做得差，谷歌是不會給你糖吃的。
這當然不是谷歌以及眾多搜尋引擎單方面的任性，搜尋引擎的這一要求是完全基於「提高整體用戶體驗」的。
我剛剛有講到一個數字，人們現在的注意力通常在8秒，而且這個數字會越來越小。
所以是否能在8秒內留住用戶，是一個頁面首先要面臨的挑戰。
但是，如果你的網站甚至不能在8秒內加載出來，你的用戶會.....
有朋友可能會要問，那多長時間加載出來比較好呢？
目前咱們業內比較受認可的一個「良好的網頁加載速度」指標，是不超過2秒。
這是什麼概念？就是你......即刻收藏本篇文章所需要的時間啊！
有朋友會說，浪哥，2秒未免強人所難，怎麼做到啊？
浪哥在這裡對有效的測速和提速方法進行了總結，確保你在做優化時不用再去譁啦啦翻網頁讀資料。
2.測速工具無需多，幾個經典的就夠用
不管你的網站加載需要10秒還是100秒，一定有明確的原因。而要掃清這些障礙，首先要知道障礙在哪裡。
以下是四款廣受好評的測速工具薦：
1. Pingdom（https://tools.pingdom.com/）
高人氣！傻瓜式操作，數據報告不錯！
Pingdom的界面簡潔、易於上手，同時提供全球5大洲7個不同城市的測速點。此外，Pindom提供的反饋不比其他測速工具少，你可以了解網站的網頁打開時間、網頁大小、頁面請求數、加載表現評級等多方面信息，同時還會得到一份網頁加載過程的錄像。
2. GTmetrix（https://gtmetrix.com/）
專業又免費，開發都愛它！
相對Pingdom而言，GTmetrix的功能更廣泛一些，在Pingdom的基礎之上免費提供瀏覽器選擇、onload time/full load time選擇歷史數據、自動監控等功能。但是因為數據量的增加，想要讀懂這些數據並得出正確的結果也並不容易，所以GTmetrix更適合有一定建站基礎知識的朋友。
3.PageSpeed Insights(https://developers.google.com/speed/pagespeed/insights/)
官方的，才最放心！
谷歌的PS Insights提供網頁端和移動端兩種測速結果，一般默認的是行動裝置的測速結果。谷歌除了會給出實測數據外，還會給出優化建議和診斷結果。所以浪哥建議，不管你之前用的什麼測速軟體進行測試並做了優化，最後都來谷歌跑一跑，看看它的評估側重在哪些方面！
4. Uptrends（https://www.uptrends.com/tools/website-speed-test）
有針對性，也有深度！
除了提供10個不同城市的測速點，Uptrends在測速之前提供桌面設備或行動裝置的選項，同時還可以選擇瀏覽器、屏幕大小、手機網絡等。它的篩選步驟更多，說明Uptrends更適合用於對有固定受眾的網頁進行測速，同時得到的結果相比其他測速工具，也更有針對性。
3.客觀看待測試數據，提速更重要
下面推薦一些提速方法，各取所需。
① 更換高效的主機
主機性能跟不上，是拖累網站速度的主要原因。幾款外貿網站常用的主機：
Siteground（https://www.siteground.com/）WP Engine（https://wpengine.com/）HostGator（https://www.hostgator.com/）
② 緩存插件
緩存可以幫助網站提速2到5倍，推薦的WP緩存插件：
WP RocketWP Super CacheW3 Total CacheAutoptimizeWP Fastest Cache
③ 優化圖片及圖庫
圖片在一個網站中所佔的成分比我們想像的要大很多，它也是拖慢網站速度的重要原因，所以這裡浪哥建議：
1) 選擇合適的圖片格式（png—高畫質體積大；jpg—體積小畫質一般）
2) 選擇合適的圖片尺寸（「合適」是指，如果要求是600*600像素，就不要用更大或更小的圖）
3) 壓縮圖片後再上傳（試一下https://tinypng.com/，簡單好用）
4) 使用WP的圖片優化插件——Smush
5) 使用WebP格式——谷歌專門開發的一種旨在加快圖片加載速度的圖片格式。
④ 不要直接上傳音頻或視頻
音頻或視頻可以增加頁面的表現力，帶來很好的效果，但因為其數據過大也會影響到網頁的速度，所以善用音頻和視頻託管服務能帶來不錯的效果——將文件先上傳到YouTube、Vimeo、SoundCloud等第三方平臺，再將連結複製過來網站後臺即可。
⑤ 控制插件數量
對於WordPress網站通常有許多功能豐富的插件供選擇，但切記，雖然豐富的功能從理想狀態來說能給用戶良好的體驗，但過多的插件會拉慢網站速度，同時還會帶來安全問題哦！
下面這一部分建議，是給有一定建站知識的朋友或開發人員：
⑥ 優化代碼
源碼壓縮（刪除不必要的空格、評論和基於文本的資源中的其他內容）；通過 GZIP 壓縮文本（在壓縮較大文件時往往可實現高達 70-90% 的壓縮率）。
⑦ 使用CDN
CDN的使用可以縮短用戶和伺服器之間的距離，減少延遲。在追求經濟實用的基礎上，可以善用各大企業提供的服務，比如騰訊雲、阿里雲等。
推薦工具：MaxCDN（https://www.stackpath.com/maxcdn/）
⑧ JS優化
將JS腳本置於頁面底部使用外部JavaScript和CSS（提升腳本文件和樣式表的復用性、減頁面體積）刪除重複腳本減少JS對DOM的訪問
⑨ 頁面內容優化
減少http的請求次數和DNS的查詢次數避免頁面跳轉、重定向（301）網站儘量緩存Ajax減少DOM元素的數量
4.最後的話
浪哥小結：用戶多的是備胎，不缺你一個蝸牛網站。
相信大家對目前的線上環境都深有體會——內容越來越豐富、選擇越來越多、用戶的注意力很難持續地集中在一個目標上，所以搶在用戶目光離開之前留住他們，是任何成功的網站或平臺最首先要考慮的事。
天下武功唯快不破，就算網站內容再優秀，也耐不過加載速度慢這個硬傷。
所以浪哥還是一再囑咐——切記要做好速度優化，把用戶的三分鐘熱度給拿捏死了。
原作者：浪哥
原出處：邦閱網