網站建設的一個重要部分是資源的加載優化。由于網絡速度低、帶寬低、延遲高、移動設備內存小、處理器性能低等原因,網站建設往往需要優化前端頁面的性能,以滿足用戶對網頁加載的期望。前一段時間,我在相關領域做了一些網站優化。我發現網站上的中文教程相對較少。我一步步把他們看下來,尋找需要解決的問題。因此,我整理并翻譯了一些有用的網站。網頁的加載時間受網絡速度的影響。通常,瀏覽器用于模擬特定的網絡速度進行測試,以便在優化前和優化后的結果之間進行更準確的比較。
1.減少請求的數量
文件資源壓縮:刪除不必要的字節,如多余的空格、換行符、縮進、注釋等。提高下載、解析和執行速度。有許多這種類型的在線工具。合并文件:每個CSS和JS文件都是一個HTTP請求,相關的多個文件被適當地合并到一個文件中,以減少HTTP請求的數量。為了解決加載速度的問題,首先要做的是減少對網頁的請求,如css sprite、js/css壓縮、緩存和按需加載。還有另一種方法可以將資源放在不同的子域下。例如,從靜態資源中分離圖片資源可以大大加快網頁加載時間,但是這種方法不適用于HTTP2連接。
2.充分利用緩存
使用緩存可以減少對服務器的請求數量并節省加載時間,因此所有靜態資源都應該在服務器端設置緩存并盡可能使用長緩存。長緩存資源的更新可以用不同的時間戳來更新。合理設置資源的到期時間,特別是對于一些不需要改變的靜態資源,將緩存的到期時間設置得更長。
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秒甚至更長時間,用戶基本上是無法忍受的。也許有些用戶會退出并重新進入,但更多的用戶會放棄直接使用它。對于網站開發者來說,提高用戶體驗是網站的核心價值,而提高網站的加載速度是最基本的用戶體驗。
1、凡本網注明“來源:***(非盈科互動)”的作品,均轉載自其它媒體,轉載目的在于傳遞更多的信息,并不代表本網贊同其觀點和對其真實性負責。
2、如因作品內容、版權和其它問題需要同本網聯系的,請在30日內進行。
為了更好的發揮盈科互動新聞資訊平臺價值,促進諸位自身發展以及業務拓展,更好地為企業及個人提供服務,盈科互動誠征各類稿件,歡迎實力來稿。
地址:武漢市解放大道1328號中原大廈1806室
E-mail:wuhan1806@163.com;QQ:6686935