網站建設中很重要的一塊是資源的加載優化。網站建設由于網速低帶寬，高延遲，移動設備小內存，低處理器性能的原因，因此很多時候不得不通過優化前端頁面的性能來滿足用戶對網頁加載的預期。前段時間做了相關方面的網站優化，發現網上的中文教程比較少，都是照著網站上一步一步看下來，找問題來解決，因此將部分有用的網頁整理翻譯了一下。網頁加載時長受到網速影響，一般采用瀏覽器模擬一個特定網速進行測試，這樣優化前與優化后的結果會有一個較準確的對比。

1、減少請求數

文件資源壓縮：將多余的空格、換行符、縮進、注釋等不必要的字節去掉從而提高下載、解析、執行速度，這一類的在線工具比較多。合并文件：每一個CSS、JS文件都是一個HTTP請求，適當將相關的多份文件合并成一個文件以減少HTTP的請求數。解決加載速度這個問題，首先要減少網頁的請求，例如css sprite、js/css壓縮、采用緩存、按需加載。還有一種方法，將資源放在不同的子域名下，比如將圖片資源與靜態資源分開可以大大加速網頁加載時間，但這個方法對HTTP2的連接不適用。

2、充分利用緩存

使用緩存可以減少向服務器的請求數，節省加載時間，所以所有靜態資源都要在服務器端設置緩存，并且盡量使用長Cache。長Cache資源的更新可使用不同時間戳來更新。合理設置資源的過期時間，尤其對一些靜態的不需要改變的資源，將其緩存過期時間設置得長一些。

3、壓縮

網站進行壓縮后，會讓搜索引擎在抓取網站時更加順利，提高用戶體驗，以便更好地瀏覽網站內容。Gzip網頁整體壓縮，目前很多虛擬主機都支持，不需要站長操作。網站Gzip壓縮之后網頁的打開速度加快；網頁腳本資源的壓縮，可借助站長工具的js壓縮工具，建議網站的js文件不宜過多，搜索引擎很難讀懂這類文件；網站圖片壓縮，對網站不重要的圖片進行壓縮，可極大減少虛擬主機的空間，加快網頁的加載速度；減少資源大小不僅可以減少存儲空間，還可以在網絡傳輸文件時減少傳輸時間、加快網頁顯示速度。因此要對HTML、CSS、JavaScript等資源進行代碼壓縮。

4、優化JavaScript加載性能

首屏應該盡量控制在1秒之內。對于相當屏幕不用的資源應該放到用戶需要的時候再加載(延遲加載、上拉滾屏加載);可感知和不可感知的加載。隨著越來越多的應用使用JavaScript技術在客戶端進行處理，從而使JavaScript在瀏覽器中的性能成為開發者所面臨的最重要的問題。JavaScript性能優化又因JavaScript的阻塞特性變得復雜，也就是說當瀏覽器在執行JavaScript代碼時，不能同時做其他事情，即其他事情都會被阻塞。無論當前JavaScript代碼是內嵌還是在外鏈文件中，頁面的下載和渲染都必須停下來等待腳本執行完成。JavaScript執行過程耗時越久，瀏覽器等待響應用戶輸入的時間就越長。

5、CDN加速

通過CDN來加速是一項相對而言成本比較高的優化手段，所以這些把它放在所有優化方法的最后，但它是一項非常有效的優化方案。CDN的全稱是Content Delivery Network，即內容分發網絡。CDN加速主要是加速靜態資源，如網站上面上傳的圖片、媒體，以及引入的一些Js、css等文件。CDN加速需要依靠各個網絡節點，例如100臺CDN服務器分布在全國范圍，從上海訪問，會從最近的節點返回資源，這是核心。CDN服務器通過緩存或者主動抓取主服務器的內容來實現資源儲備。

怎么實現網站的加載優化，對于一個移動產品，功能無疑很重要，但是性能同樣是用戶體驗中不可或缺的一環。當用戶能夠在1～2秒內打開一個移動頁面并看到信息的展示，或者能夠開始進行下一步的操作時，用戶會覺得速度還是可以接受的；如果頁面在2～5秒后才進入可用的狀態，用戶的耐心會逐漸喪失；如果一個界面超過5秒甚至更久才能顯示出來，用戶基本是無法忍受的，也許有一部分用戶會退出重新進入，但更多的用戶會直接放棄使用。對于網站的開發人員來說，提升用戶體驗是一個網站的核心價值，其中提高網站的加載速度是最基本的用戶體驗。