手機成都網(wǎng)站建設(shè)網(wǎng)頁打開速度提升的方法

2024-01-05    分類: 網(wǎng)站建設(shè)

1,建一個快速打開的手機網(wǎng)站,就得砍掉非核心體驗的過程,減少依賴文件:更少的文件意味著更少的http請求與更快的加載時間。

降低圖片大小:適應(yīng)與調(diào)整高分辨率圖片,在額外的下載時間中占居榜首,占用了寶貴的內(nèi)存與處理資源。

減輕客戶端負擔:最佳實踐是重新思考你的javascript,并使之降低到最小尺寸。

2,減少依賴文件

如果你想為移動端用戶隱藏圖片,display:none與visibility:hidden是不能阻止文件下載的,測試下面的代碼:

<div style="display:none;">

<img src="logo-none.png" />

</div>

<div style="visibility:hidden;">

<img src="logo-hidden.png" />

</div>

另外替代方案是利用css加載背景圖片,之后利用media query媒體查詢來通過條件隱藏圖片。(成都網(wǎng)站建設(shè)

3,保持最小數(shù)量的外聯(lián)樣式表

不管怎么樣,樣式表都會被加載,你需要把這些文件合并在一個文件里,減少http請求。另一種方法,你可以通過后端處理,通過判斷設(shè)備來自動插入樣式表。

4,利用CSS3代替圖片

圓角,陰影,漸變填充等,這些樣式不需要使用圖片,可以減少http請求,加快加載時間CSS3可以減少http請求,但增加了處理負荷,我們創(chuàng)建了一系列的html文件,每個文件包含一個基本的css3特性,參考下面的圖表,你可以發(fā)現(xiàn)css3帶來的處理時間很小,但不能不考慮,特別注意box-shadow對處理時間的影響大。

5,字體圖標

字體圖標是利用字體文件來包含符號和圖表(如Wingdings或Webdings 都是某種圖標字體),可以用來代替加載一個圖像文件,Wingdings和Webdings有點過氣了,現(xiàn)在有其他更專業(yè)的Web字體可用的,可以通過font-face加載。單獨的Web字體,對于所有圖標來講,HTTP請求的數(shù)量可以減少到一個,如果Web字體使用數(shù)據(jù)URI嵌入頁面,HTTP請求可以減少到零,這正是WordPress使用的技術(shù),這是他們樣式表中嵌入的web字體:WordPress訪問所有這些圖標,不會有任何額外的HTTP請求,因為圖標通過數(shù)據(jù)URI,以Web字體的方式嵌入到WordPress的樣式表中。

7,避免內(nèi)聯(lián)iframe

每一個內(nèi)聯(lián)框架都會生成一個HTTP請求,這是在iframe內(nèi)沒有另外依賴資源的情況下,這是我們做一個快速測試,比較一個iframe只含有文本。包含一個iframe增加了將近0.2秒的加載時間,為了保證web站點加載迅速,最好不要使用iframe。

8,減少客戶端處理:

Javascript對加載時間的影響,在移動端較小的內(nèi)存,cpu及緩存下會表現(xiàn)得更明顯,通常我們要重新思考javascript的使用,并保持其在最小尺寸。

本文標題:手機成都網(wǎng)站建設(shè)網(wǎng)頁打開速度提升的方法
標題鏈接:http://www.muchs.cn/news41/312141.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供電子商務(wù)、網(wǎng)站改版、虛擬主機用戶體驗、企業(yè)建站、服務(wù)器托管

廣告

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

成都定制網(wǎng)站建設(shè)