2022-06-01 分類(lèi): 網(wǎng)站建設(shè)
創(chuàng)新互聯(lián)分享了14條網(wǎng)站性能改進(jìn)的原則,單獨(dú)每次讀取原理,與樣品。大部分的這些原則是非常實(shí)用,適合網(wǎng)站架構(gòu)師,前端工程師。前端工程師的重要性要居于其中很多。
結(jié)構(gòu)要求,等待響應(yīng)需要時(shí)間,所以請(qǐng)求的數(shù)量,越少越好。下降的整體思路是結(jié)合資源,減少請(qǐng)求的數(shù)量通過(guò)根據(jù)文檔的減少頁(yè)面數(shù)量。
1. Image Map
通過(guò)設(shè)置usemap屬性,可以使用標(biāo)記標(biāo)簽圖像分割的多個(gè)區(qū)域,來(lái)指向不同的鏈接。而不是使用多個(gè)形象建設(shè)鏈接分別減少請(qǐng)求的數(shù)量。
2. CSS Sprite(CSS貼圖整合/貼圖拼合/貼圖定位)
通過(guò)設(shè)置元素background-position的css樣式來(lái)設(shè)置。常用的界面圖標(biāo)。一個(gè)典型的可以參考以上小按鈕TinyMCE編輯器。許多個(gè)小圖從一個(gè)統(tǒng)一的大圖來(lái)設(shè)置不同的偏移量分離而來(lái),這個(gè)接口加載事實(shí)上只要請(qǐng)求許多按鈕一次更大的(請(qǐng)求),從而減少HTTP請(qǐng)求。
3. Inline Image(內(nèi)聯(lián)圖片)
在Inline Image的SRC的內(nèi)聯(lián)圖像不是外部圖像文件中指定的URL,但是直接的將圖片信息直接的導(dǎo)入。如數(shù)據(jù):SRC = " data:image/gif;base64,R0lGODlhDAAMAL...”有用在某些特殊情況下(如一個(gè)小圖片僅用于當(dāng)前頁(yè)面)。
為你的網(wǎng)站提供各種線路(例如,國(guó)內(nèi)電信、聯(lián)通、移動(dòng)),設(shè)置多個(gè)位置(北、南、西),可以快速訪問(wèn)所有用戶(hù)。
對(duì)于一些不是頻繁更新資源的(比如一個(gè)靜態(tài)圖片)有更長(zhǎng)的Expires標(biāo)題信息,這些資源緩存后,未來(lái)不能重復(fù)傳播了很長(zhǎng)一段時(shí)間。
使用Gzip壓縮HTTP消息,減小體積,減少傳輸時(shí)間。
加載樣式表,這個(gè)頁(yè)面呈現(xiàn)渲染是從早期開(kāi)始,給用戶(hù)的感覺(jué)頁(yè)面加載速度更快。
原因同5,首先,處理頁(yè)面,頁(yè)面渲染就可以早些時(shí)候完成,腳本邏輯執(zhí)行將在后期,因此,給用戶(hù)頁(yè)面加載速度就會(huì)更加的快速。
不簡(jiǎn)單的JS邏輯,DOM查找,選擇操作將降低處理效率。
這似乎是與合并的想法原則1相反,但事實(shí)上不是這樣:考慮每一頁(yè)介紹了常見(jiàn)的JavaScript資源(如jQuery或ExtJS JavaScript庫(kù)),單在一個(gè)頁(yè)面性能的情況下,內(nèi)聯(lián)JavaScript(嵌入HTML頁(yè)面加載速度比拓展。但是如果有很多頁(yè)介紹常見(jiàn)的JavaScript資源,所以?xún)?nèi)聯(lián)的解決方案將導(dǎo)致重復(fù)傳輸(因?yàn)橘Y源嵌入在每個(gè)頁(yè)面,所以每次你打開(kāi)一個(gè)頁(yè)面的這一部分資源轉(zhuǎn)移,導(dǎo)致浪費(fèi)網(wǎng)絡(luò)資源)。但是這種資源拓展參考可以解決這個(gè)問(wèn)題。
1. 使用Keep-Alive保持連接
如果連接斷開(kāi),然后下一個(gè)連接執(zhí)行DNS查找,即使對(duì)應(yīng)的域名,IP映射緩存,搜索也需要一些時(shí)間
2. 減少域名
新域名請(qǐng)求每次都應(yīng)該要通過(guò)不同的DNS查找,DNS緩存卻不能發(fā)揮作用。所以你應(yīng)該試著組織網(wǎng)站統(tǒng)一域名下,避免使用太多的子域名
使用JS壓縮工具壓縮你的JS吧,效果使很不錯(cuò)的。根據(jù)jQuery兩個(gè)不同的發(fā)行版本就能發(fā)現(xiàn)他們之間的區(qū)別:
http://code.jquery.com/jquery-1.6.2.js 閱讀版jQuery代碼,230KB
http://code.jquery.com/jquery-1.6.2.min.js 壓縮版jQuery代碼(用于實(shí)際部署),89.4KB
重定向意味著在實(shí)際訪問(wèn)你想看到首頁(yè)加入輪額外的HTTP請(qǐng)求(客戶(hù)端發(fā)起HTTP請(qǐng)求→HTTP服務(wù)器返回重定向響應(yīng)→客戶(hù)端對(duì)新URL發(fā)起請(qǐng)求→HTTP服務(wù)器返回內(nèi)容,下劃線部分為額外的請(qǐng)求),因此消耗更多的時(shí)間(也對(duì)人的感覺(jué)反應(yīng)慢)。所以,除非必要,不要使用重定向。幾個(gè)“必要”:
1. 避免URL失效
遷移后的舊網(wǎng)站,為了避免舊URL失敗,往往舊URL的請(qǐng)求重定向到一個(gè)新系統(tǒng)相應(yīng)的地址。
2. URL美化
可讀性好的URL和實(shí)際資源URL之間的轉(zhuǎn)換,比如,谷歌工具欄,用戶(hù)記住http://toolbar.google.com這豐富的語(yǔ)義地址在人類(lèi)身上,但很難記住,真正的源地址http://www.google.com/tools/firefox/toolbar/FT3/intl/en/index.html。所以有必要保持前,將被重定向到后者根據(jù)前者要求。
不要一個(gè)頁(yè)面重復(fù)的使用相同的版本。B和C都依賴(lài)于一個(gè)腳本,例如,在頁(yè)面中使用B和C可能存在反復(fù)的引用。解決方案,對(duì)于簡(jiǎn)單的網(wǎng)站依賴(lài)手動(dòng)檢查,消除重復(fù)的介紹,對(duì)于復(fù)雜的網(wǎng)站你需要網(wǎng)站建設(shè)知識(shí)建立自己的版本的依賴(lài)管理/控制機(jī)制。
除了last - modified ETag是另一個(gè)HTTP緩存。由hash方法確定資源是否被修改。但是在某種程度上說(shuō)還是存在一定的問(wèn)題:
1. 不一致:不同的Web服務(wù)器(Apache,IIS等)ETag格式定義是不同的
2. ETag的計(jì)算是不穩(wěn)定的(由于考慮過(guò)多因素),例如:
1) ETag在不同的服務(wù)器上,具有相同的資源,大型Web應(yīng)用程序通常由多個(gè)服務(wù)器提供服務(wù),這將導(dǎo)致服務(wù)器上的客戶(hù)端緩存資源顯然仍然有效,當(dāng)下一次請(qǐng)求B被認(rèn)定為失敗由于不同的ETag,導(dǎo)致相同的重復(fù)傳播資源。
2) 資源不變,是其他因素導(dǎo)致的變化,比如配置文件變化,使ETag的變化。直接后果是系統(tǒng)更新后端緩存失效,導(dǎo)致運(yùn)輸數(shù)量、網(wǎng)站性能下降。
Ajax是一個(gè)異步請(qǐng)求,異步請(qǐng)求將不會(huì)阻止你現(xiàn)在操作,當(dāng)請(qǐng)求完成時(shí),你可以立即看到結(jié)果。但異步不代表可以瞬時(shí)完成,也不代表可以寬容需要無(wú)限的時(shí)間完成。所以對(duì)于Ajax請(qǐng)求的性能也需要注意。
網(wǎng)頁(yè)題目:高性能網(wǎng)站建設(shè)原則
網(wǎng)頁(yè)路徑:http://muchs.cn/news35/162285.html
網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專(zhuān)注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營(yíng)銷(xiāo)seo公司;服務(wù)項(xiàng)目有網(wǎng)站建設(shè)等
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容