yahoo開發(fā)的網(wǎng)頁評分插件YSlow的評分規(guī)則是什么，相信很多沒有經(jīng)驗的人對此束手無策，為此本文總結(jié)了問題出現(xiàn)的原因和解決方法，通過這篇文章希望你能解決這個問題。

創(chuàng)新互聯(lián)專注于崇仁網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供崇仁營銷型網(wǎng)站建設(shè)，崇仁網(wǎng)站制作、崇仁網(wǎng)頁設(shè)計、崇仁網(wǎng)站官網(wǎng)定制、成都微信小程序服務(wù)，打造崇仁網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供崇仁網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。

YSlow是yahoo美國開發(fā)的一個頁面評分插件，非常的棒，從中我們可以看出我們頁面上的很多不足，并且可以知道我們改怎么卻改進(jìn)和優(yōu)化。
仔細(xì)研究了下YSlow的評分規(guī)則。
YSlow的評分規(guī)則：

1. Make fewer HTTP requests 盡可能少的http請求。。我們有141個請求（其中15個JS請求，3個CSS請求，47個CSS background images請求），多的可怕。思考了下，為什么把這個三種請求過多列為對頁面加載的重要不利因素呢，而過多的IMG請求并沒有列為不利因素呢？
發(fā)現(xiàn)原來這些請求都是可以避免的。
15個JS和3個CSS完全可以通過特殊的辦法進(jìn)行合并（這個技術(shù)部已經(jīng)幫我們解決了，實在是太感謝了，嘿嘿。），這樣合并以后，一般情況下頁面上只會出現(xiàn)一個JS和一個CSS（對JS的封裝得有一定的要求）。
但是47個CSS background images請求改怎么解決呢？為什么頁面上的純IMG請求時合理的，而CSS background images請求過多就是不利因素了呢。這個我想了很久，總算明白，原來是這樣的：
一般頁面上的ICON，欄目背景啊，圖片按鈕啊，我們都會用圖片CSS背景來實現(xiàn)，而一般這個圖片CSS背景用到的圖片都是比較小的，所以完全可以把這些圖片合并成一個相對比較大的圖片，這樣頁面上只會出現(xiàn)一個CSS background images請求，最多也就2-3個。后來仔細(xì)看了下雅虎美國的頁面，他們的確也是這樣做的，雖然這樣做需要花一定的時間來有規(guī)則的合并這些ICON，欄目背景，圖片按鈕，以方便CSS調(diào)用，但是這樣做絕對是合算的，而且是有必要的，YSlow也是極力推薦的。
2.Use a CDN 這項我們的評分是F級，最低。說實在的，我剛開始什么是CDN都不知道。后來查了GOODLE才知道。CDN的全稱是Content Delivery Network，即內(nèi)容分發(fā)網(wǎng)絡(luò)。其目的是通過在現(xiàn)有的Internet中增加一層新的網(wǎng)絡(luò)架構(gòu)，將網(wǎng)站的內(nèi)容發(fā)布到最接近用戶的網(wǎng)絡(luò)”邊緣”，使用戶可以就近取得所需的內(nèi)容，解決Internet網(wǎng)絡(luò)擁擠的狀況，提高用戶訪問網(wǎng)站的響應(yīng)速度。從技術(shù)上全面解決由于網(wǎng)絡(luò)帶寬小、用戶訪問量大、網(wǎng)點分布不均等原因所造成的用戶訪問網(wǎng)站響應(yīng)速度慢的問題。
看來上述的解釋后，基本上明白了CDN是怎么回事，后來咨詢了下中文站點SA，得知我們網(wǎng)站目前的確還沒有做CDN的優(yōu)化，但是據(jù)說我們有更加先進(jìn)的技術(shù)來解決類似的問題（具體什么技術(shù)那就保密了），但是畢竟CDN也是個相當(dāng)不錯的技術(shù)，所以在我們先進(jìn)技術(shù)的基礎(chǔ)上在做CDN優(yōu)化，肯定比現(xiàn)在更好，嘿嘿。據(jù)說SA明年會做幾個點的CND。
3. Add an Expires header 設(shè)置過期的HTTP Header.設(shè)置Expires Header可以將腳本, 樣式表, 圖片, Flash等緩存在瀏覽器的Cache中.
其實我們網(wǎng)站也做了這個優(yōu)化，至少圖片在這個上做過優(yōu)化，但是沒有做完全。我們的CSS和JS都還沒有做過優(yōu)化，倒是外部引入的一個廣告JS做了，呵呵。其實設(shè)置過期的HTTP Header 更應(yīng)該做在腳本, 樣式表, Flash上.不過據(jù)說這個SA也是沒有做的，但是有一定的風(fēng)險，因為JS和CSS是有一定的邏輯，如果服務(wù)器端和客戶端都存在緩存的話，萬一出了什么問題，對我們以后查找問題的所在和增加難度，不過我想兩者中是可以權(quán)衡和并存的。
4. Gzip components 對我們的頁面內(nèi)容進(jìn)行Gzip格式的壓縮，Gzip格式是一種很普遍的壓縮技術(shù)，幾乎所有的瀏覽器都有解壓Gzip格式的能力，而且它可以壓縮的比例非常大，一般壓縮率為85%，就是說服務(wù)器端100K的頁面可以壓縮到25K左右的Gzip格式的數(shù)據(jù)發(fā)給客戶端，客戶端收到Gzip格式的數(shù)據(jù)后自動解壓縮后顯示頁面。
這點我們網(wǎng)站基本上是100%做到了，但是我們這項的評分并沒有達(dá)到想象中的A級，原因是出在我們的外部鏈接，比如我們首頁，有外部的廣告投放JS，這個JS說擁有的網(wǎng)站是沒有做過GZIP優(yōu)化，連累了我們網(wǎng)站，所以我們也只有B，或者C級。
5. Put CSS at the top 把CSS外部鏈接放到頁面的頂部。
其實這個原則我們一般都遵守的，如果把CSS外部鏈接作為邏輯的一部分出現(xiàn)在頁面頭部以下，我個人覺得這個本身就是個錯誤。還好，我們的頁面基本上都做到了，可是有些頁面比如LIST頁面，還是出現(xiàn)了和邏輯掛鉤的CSS鏈接，原因是為了解決一些本來就不合理的產(chǎn)品邏輯。所以，我們WEB前端工程師有義務(wù)杜絕這些不合理的產(chǎn)品邏輯破壞我們的頁面結(jié)果及頁面加載速度，不能為了實現(xiàn)而實現(xiàn)。

看完上述內(nèi)容，你們掌握yahoo開發(fā)的網(wǎng)頁評分插件YSlow的評分規(guī)則是什么的方法了嗎？如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！

分享名稱：yahoo開發(fā)的網(wǎng)頁評分插件YSlow的評分規(guī)則是什么-創(chuàng)新互聯(lián)
鏈接分享：http://www.rwnh.cn/article40/dsopeo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供服務(wù)器托管、商城網(wǎng)站、響應(yīng)式網(wǎng)站、面包屑導(dǎo)航、網(wǎng)站營銷、App開發(fā)

廣告

聲明：本網(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)