網(wǎng)站建設(shè)的一個重要部分是資源的加載優(yōu)化。由于網(wǎng)絡(luò)速度低、帶寬低、延遲高、移動設(shè)備內(nèi)存小、處理器性能低等原因，網(wǎng)站建設(shè)往往需要優(yōu)化前端頁面的性能，以滿足用戶對網(wǎng)頁加載的期望。前一段時間，我在相關(guān)領(lǐng)域做了一些網(wǎng)站優(yōu)化。我發(fā)現(xiàn)網(wǎng)站上的中文教程相對較少。我一步步把他們看下來，尋找需要解決的問題。因此，我整理并翻譯了一些有用的網(wǎng)站。網(wǎng)頁的加載時間受網(wǎng)絡(luò)速度的影響。通常，瀏覽器用于模擬特定的網(wǎng)絡(luò)速度進行測試，以便在優(yōu)化前和優(yōu)化后的結(jié)果之間進行更準確的比較。

1.減少請求的數(shù)量

文件資源壓縮：刪除不必要的字節(jié)，如多余的空格、換行符、縮進、注釋等。提高下載、解析和執(zhí)行速度。有許多這種類型的在線工具。合并文件：每個CSS和JS文件都是一個HTTP請求，相關(guān)的多個文件被適當?shù)睾喜⒌揭粋€文件中，以減少HTTP請求的數(shù)量。為了解決加載速度的問題，首先要做的是減少對網(wǎng)頁的請求，如css  sprite、js/css壓縮、緩存和按需加載。還有另一種方法可以將資源放在不同的子域下。例如，從靜態(tài)資源中分離圖片資源可以大大加快網(wǎng)頁加載時間，但是這種方法不適用于HTTP2連接。

2.充分利用緩存

使用緩存可以減少對服務(wù)器的請求數(shù)量并節(jié)省加載時間，因此所有靜態(tài)資源都應(yīng)該在服務(wù)器端設(shè)置緩存并盡可能使用長緩存。長緩存資源的更新可以用不同的時間戳來更新。合理設(shè)置資源的到期時間，特別是對于一些不需要改變的靜態(tài)資源，將緩存的到期時間設(shè)置得更長。

3.壓縮

網(wǎng)站壓縮后，將使搜索引擎更順暢地抓取網(wǎng)站，提高用戶體驗，從而更好地瀏覽網(wǎng)站內(nèi)容。Gzip網(wǎng)頁是作為一個整體壓縮的，目前被許多虛擬主機支持，不需要網(wǎng)站管理員操作。網(wǎng)站Gzip壓縮后，網(wǎng)頁的打開速度加快；對于網(wǎng)頁腳本資源的壓縮，可以使用網(wǎng)站管理員工具的js壓縮工具。建議網(wǎng)站不要有太多的js文件，這些文件對于搜索引擎來說很難閱讀。網(wǎng)站圖像壓縮是對網(wǎng)站不重要的圖像進行壓縮，可以大大減少虛擬主機的空間，加快網(wǎng)頁的加載速度；在網(wǎng)絡(luò)上傳輸文件時，減少資源的大小不僅可以減少存儲空間，還可以減少傳輸時間，加快網(wǎng)頁顯示速度。因此，有必要壓縮HTML、CSS、JavaScript等資源。

4.優(yōu)化JavaScript加載性能

第一個屏應(yīng)控制在1秒內(nèi)。未用于等效屏幕的資源應(yīng)在用戶需要時加載(延遲加載、上下滾動加載)；感知和不可感知的負載。隨著越來越多的應(yīng)用程序使用JavaScript技術(shù)在客戶端進行處理，JavaScript在瀏覽器中的性能成為開發(fā)人員面臨的更重要的問題。JavaScript的阻塞特性使JavaScript性能優(yōu)化變得復(fù)雜，也就是說，當瀏覽器執(zhí)行JavaScript代碼時，它不能同時做其他事情，也就是說，其他事情將被阻塞。無論當前的JavaScript代碼是嵌入的還是在外部鏈文件中，頁面的下載和呈現(xiàn)都必須停止，并等待腳本執(zhí)行完成。JavaScript執(zhí)行過程花費的時間越長，瀏覽器等待響應(yīng)用戶輸入的時間就越長。

5.CDN加速

通過CDN加速是一種成本相對較高的優(yōu)化方法，因此這些優(yōu)化方法將其置于所有優(yōu)化方法的末尾，但它是一種非常有效的優(yōu)化方案。CDN的全稱是Content Delivery Network，即內(nèi)容分發(fā)網(wǎng)絡(luò)。CDN加速主要是為了加速靜態(tài)資源，比如網(wǎng)站上上傳的圖片和媒體，以及一些導(dǎo)入的Js、css等文件。CDN加速需要依賴各種網(wǎng)絡(luò)節(jié)點，例如，100個CDN服務(wù)器分布在全國各地。當從上海訪問時，資源將從更近的節(jié)點返回，該節(jié)點是核心。CDN服務(wù)器通過緩存或主動抓取主服務(wù)器的內(nèi)容來存儲資源。

對于移動產(chǎn)品來說，如何優(yōu)化網(wǎng)站的負載無疑非常重要，但性能也是用戶體驗中不可或缺的一部分。當用戶可以在1 ~ 2秒內(nèi)打開手機頁面并看到信息顯示，或者可以開始下一步操作時，用戶會覺得速度還是可以接受的。如果頁面在2 ~ 5秒后變得可用，用戶的耐心將逐漸喪失。如果一個界面不能顯示超過5秒甚至更長時間，用戶基本上是無法忍受的。也許有些用戶會退出并重新進入，但更多的用戶會放棄直接使用它。對于網(wǎng)站開發(fā)者來說，提高用戶體驗是網(wǎng)站的核心價值，而提高網(wǎng)站的加載速度是更基本的用戶體驗。