為了更好地提升用戶的瀏覽體驗，《移動落地頁體驗白皮書4.0》中規(guī)定：頁面的首屏內容應在1.5秒內加載完成。百度搜索對用戶行為的研究表明，頁面首屏的加載時間在1.5秒以內的頁面，會帶給用戶流暢快捷的極速體驗。近期我們發(fā)現有部分站點移動端頁面首屏打開速度多于1.5秒，為了方便開發(fā)者對頁面進行優(yōu)化，技術特地總結了問題的主要原因以及優(yōu)化方法給大家進行參考。

　　1、清除不必要的資源，避免進行不必要的下載

站點應當定期審核網頁上的資源是否是必需的，并評估該資源的價值與性能影響。網頁中往往會包含一些冗余資源，影響網頁性能的同時還無法給網頁帶來價值，可以考慮清除不必要的資源，避免不必要的資源下載帶來性能上的消耗。

　　清除阻塞渲染的JS和CSS

如果要以最快速度完成首屏渲染，需要大限度地減少網頁上關鍵JS/CSS子資源的數量，并盡可能清除這些資源，大限度地減少下載量。

　　2、使用代碼拆分減少JS負載

有的網站可能將所有的JS組合成一個大型的組合包，以這種方式加載的話頁面性能會受到影響。長時間運行的JS可能會阻塞主線程，這時可以考慮使用requestAnimationFrame() 或 requestIdleCallback() 來進行優(yōu)化。

根據不同的業(yè)務需求，開發(fā)者可以將JS中首屏的關鍵代碼拆分出來，這樣可以提前加載執(zhí)行首屏中必需的少量JS代碼，從而縮短頁面的加載時間，其余的可以按需加載或者置后加載，同時建議開發(fā)者將JS優(yōu)先放在首屏渲染完成之后，放在body閉標簽前面。

　　3、優(yōu)化阻塞渲染的JS

JS允許我們修改網頁的同時也會阻止DOM構建，阻塞網頁渲染。默認情況下，JS的執(zhí)行會阻塞內核渲染：無論我們使用外鏈還是內嵌JS，當遇到文檔中的JS腳本時，它將暫停 DOM 構建，將控制權移交給 JS，腳本執(zhí)行完畢后再繼續(xù)構建 DOM，處理剩余的HTML文檔。如果是外鏈JS文件，瀏覽內核需停下來，等待從磁盤、緩存或遠程服務器中獲取JS腳本，這就可能給關鍵渲染路徑增加數十到數百毫秒的延遲。

為了實現好性能，可以讓頁面的JS進行異步執(zhí)行，建議優(yōu)先考慮使用defer的方式，其次是async方式，并去除關鍵渲染路徑中任何不必要的JS。

　　(1)優(yōu)化JS的使用方式，優(yōu)先使用異步JS資源

默認情況下，JS資源會阻塞解析，強制等待CSSOM并暫停DOM的構建，繼而大大延遲首屏渲染的時間。異步JS資源則不會阻塞文檔解析器，如果腳本可以使用defer/async 屬性，也就意味著它并非是首屏渲染所必需的，可以考慮在首屏渲染后異步加載腳本。

　　(2)延遲解析加載JS

為了大限度減少內核渲染網頁的工作量，建議開發(fā)者延遲所有非必需的、對構建首屏渲染無關緊要的JS腳本，將JS優(yōu)先放在body閉標簽處。

　　(3)避免長時間運行的JS

運行時間長的JS會阻塞構建 DOM、CSSOM以及網頁的渲染，所以任何對首屏渲染無關緊要的初始化邏輯和功能都應延后執(zhí)行。如果需要運行較長的初始化序列，請考慮將它們拆分為若干個階段，以便瀏覽內核可以間隔處理其它的渲染任務。

　　4、優(yōu)化阻塞渲染的CSS

默認情況下，關鍵CSS子資源是會阻塞內核渲染的，請務必精簡網頁的CSS資源，同時需要將CSS盡快地完成下載，關鍵CSS子資源優(yōu)先放在head標簽內，以便縮短首屏渲染的時間。

　　(1)優(yōu)化CSS的使用方式

CSS是構建渲染樹的必備元素，首次構建網頁時，確保將任何非必需的CSS資源都標記為非關鍵資源(比如print)，并應確保盡可能減少關鍵CSS子資源的數量。

　　(2)將關鍵CSS放在文檔head標簽內

盡早在HTML文檔內指定所有必需的關鍵CSS資源，以便瀏覽內核盡早發(fā)現link標記并發(fā)出CSS請求下載。

　　(3)避免使用CSS import指令

一個樣式表可以使用CSS import指令從另一個樣式表文件導入規(guī)則。不過應避免使用這些指令，因為它們會在關鍵路徑中增加往返次數從而影響首屏渲染性能。

以上就是《如何優(yōu)化SEO網站的頁面性能?》的全部內容，僅供站長朋友們互動交流學習，SEO優(yōu)化是一個需要堅持的過程，希望大家一起共同進步。

網頁題目：【網站優(yōu)化】如何優(yōu)化SEO網站的頁面性能?
轉載來源：http://www.rwnh.cn/news47/126847.html

成都網站建設公司_創(chuàng)新互聯，為您提供自適應網站、全網營銷推廣、電子商務、手機網站建設、網站收錄、云服務器

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯