機構(gòu)組織網(wǎng)站建設虛擬展廳博物館展廳設計數(shù)字博物館建設展廳空間設計北京展廳設計產(chǎn)品展廳設計企業(yè)展廳設計公司展廳設計
手機網(wǎng)站建設網(wǎng)頁打開速度提升的方法
2019.03.29
1，建一個快速打開的手機網(wǎng)站，就得砍掉非核心體驗的過程，
減少依賴文件：更少的文件意味著更少的http請求與更快的加載時間。
降低圖片大?。哼m應與調(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媒體查詢來通過條件隱藏圖片。
3，保持最小數(shù)量的外聯(lián)樣式表
不管怎么樣 ，樣式表都會被加載，你需要把這些文件合并在一個文件里，減少http請求。
另一種方法，你可以通過后端處理，通過判斷設備來自動插入樣式表 (這種方式在wordpress的響應式網(wǎng)站中使用過)。
另一種方案可以使用內(nèi)部樣式，亞馬遜獨立的移動產(chǎn)品頁面有一個6KB大小的外部樣式表，連同一些內(nèi)部樣式，這只需要通過一個額外的HTTP請求來下載所有的頁面樣式，亞馬遜的桌面版本并不是很高效，帶有9個外部樣式表，總共40KB。
4，利用CSS3代替圖片
圓角，陰影，漸變填充等，這些樣式不需要使用圖片，可以減少http請求，加快加載時間
CSS3可以減少http請求，但增加了處理負荷，我們創(chuàng)建了一系列的html文件，每個文件包含一個基本的css3特性，參考下面的圖表，你可以發(fā)現(xiàn)css3帶來的處理時間很小，但不能不考慮，特別注意box-shadow對處理時間的影響最大。
5，DATAURI來代替圖片與WEB字體文件
Data uri方案可以不使用任何額外資源就可以向html及css中插入內(nèi)容，這個技術(shù)可以在web頁面中插入任何內(nèi)容，通常被用于插入圖片及web字體文件，這個技術(shù)最大的好處是可以減少http請求。
Data uri使用很簡單，你可以按照下面的格式，使用base64編碼過的數(shù)據(jù)直接插入html與css中代替圖片文件。
6，字體圖標
字體圖標是利用字體文件來包含符號和圖表(如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的樣式表中。
同時，字體圖標可以使用CSS3關鍵幀動畫(這很有用，比如“加載”圖標(小菊花))，主要的缺點是，字體圖標做成的CSS sprites只能是某個純色，亞馬遜的css雪碧圖包括彩色圖標，因此它不能使用這種技術(shù)。
7，避免內(nèi)聯(lián) iframe：
每一個內(nèi)聯(lián)框架(iframe)都會生成一個 HTTP 請求，這是在 iframe 內(nèi)沒有另外依賴資源的情況下，這是我們做一個快速測試，比較一個 iframe 只含有文本。包含一個 iframe 增加了將近 0.2s 的加載時間，為了保證 web 站點加載迅速，最好不要使用 iframe。當然這個在移動端網(wǎng)站應該是非常少使用的，子凡經(jīng)常見到的就是在 PC 端用這個的還挺多的。
8，減少客戶端處理：Javascript 對加載時間的影響，在移動端較小的內(nèi)存，cpu 及緩存下會表現(xiàn)得更明顯，通常，我們要重新思考 javascript 的使用，并保持其在最小尺寸。
9，手機網(wǎng)站建設其他應該注意的地方等。
400-7808-893 / 010-64913142
我想要個更針對我需求的方案
也許您需要專業(yè)的服務，歡迎來電咨詢
您的需求，是我們前進最大的動力
關于我們
北京分形科技有限公司成立于2003年，是一家以AI為核心驅(qū)動力，提供網(wǎng)絡品牌策劃、AI互聯(lián)網(wǎng)服務、WEB3服務、AI人工智能解決方案的綜合服務商
我們一直秉承的經(jīng)營理念：責任、熱情、品質(zhì)、包容
主要業(yè)務范圍：AI互聯(lián)網(wǎng)服務（網(wǎng)站建設,網(wǎng)站群,短視頻社交平臺,APP,小程序）AI人工智能行業(yè)解決方案（智慧博物館,智慧公園,智慧景區(qū),智慧社區(qū),智慧醫(yī)療,智慧校園,）IoT智能物聯(lián)產(chǎn)品（智能步道,AR太極,AI健身,AI導覽,AI單車,智慧樹）WEB3（區(qū)塊鏈,元宇宙,NFT數(shù)字藏品）
版權(quán)所有：北京分形科技有限公司
Copyright 2003-2023 m.mendezelectric.com All Rights Reserved. 北京分形科技有限公司
京ICP備05007162號-1