1、減少頁面請求: 從WEB運行原理上講,IIS請求是無狀態(tài)的,在服務(wù)器端一直是連接和關(guān)閉的不斷進行著,如果能減少服務(wù)器請求,總的時間將會減少。
之前我下載163郵箱的登陸頁面的圖片時發(fā)現(xiàn),它們的只用到了一個圖片來完成整個頁面的所有圖片,當時我就納悶了,這跟平時做的網(wǎng)站不一樣呀。然來這樣做減少瀏覽器的請求次數(shù),用httpwatch你會發(fā)現(xiàn)請求的總時間大大減少了。同樣的想法,在做css樣式,JavaScript代碼的時候也要做到盡可能的放在一個文件下來減少WEB請求。
2、頁面壓縮技術(shù),給我們JS,HTML代碼進行瘦身。 jQuery 作為JS最輕量級的類庫,它的原類庫是242KB,壓縮后的它竟只有91.6KB。 常見的壓縮工具有Google Closure Compiler、YUI Compressor、JsPacker、gzip。我常用的是gzip,因為它的壓縮率是更高的。用jdk壓縮后它會把一些空格去掉,把我們很長的變量名換成換成很短的字母來代替。
3、樣式、行為、結(jié)構(gòu)分離。 當次訪問頁面的時候,用戶就可以把CSS,JS代碼下載下來,這樣做雖然次使網(wǎng)頁加載的速度變慢了,但后面的頁面將快很多。當用戶訪問這個網(wǎng)站的其它的頁面時,由于其它頁面也引用了這個CSS樣式和JS代碼。瀏覽器發(fā)現(xiàn)它已經(jīng)下載好了,下一次就可以不用下載了。這樣就做到了一次下載,后續(xù)速度的效果。
4、使用存儲過程 在運行存儲過程前,數(shù)據(jù)庫已對其進行了語法和句法分析,并給出了優(yōu)化執(zhí)行方案。這種已經(jīng)編譯好的過程可極大地改善SQL語句的性能。由于執(zhí)行SQL語句的大部分工作已經(jīng)完成,所以存儲過程能以極快的速度執(zhí)行。這種預(yù)編譯的sql語句就可以直接執(zhí)行而節(jié)省了很大一部分查詢的時間。
5、一些細節(jié): 把CSS樣式放在頭部,如果JS很多的話,把js代碼放在尾部。這樣做可以盡可能的先加載頁面的DOM結(jié)構(gòu),然后才可以級用戶體驗。如果JS很多的大的話,頁面都沒加載完,何來用戶體驗之說呢。
6、適當?shù)氖褂肁JAX 現(xiàn)在的Ajax好像有點被神話了,好像網(wǎng)頁只要Ajax了,那么就不存在效率問題了。其實這是一種誤解。拙劣的使用Ajax不會讓你的網(wǎng)頁效率更高,反而會降低你的網(wǎng)頁效率。Ajax的確是個好東西,但是請不要過分的神話它。使用Ajax的時候也要考慮上面的那些準則。7、盡量少使用樣式工具為我們生成的頁面樣式代碼,自己動手把樣式寫在樣式文件里。盡量寫得通用些。
8、頁面緩存 在大型的門戶網(wǎng)站都用到了緩存技術(shù),它是以空間換時間的技術(shù)。
緩存主要是為了提高數(shù)據(jù)的讀取速度。因為服務(wù)器和應(yīng)用客戶端之間存在著流量的瓶頸,所以讀取大容量數(shù)據(jù)時,使用緩存來直接為客戶端服務(wù),可以減少客戶端與服務(wù)器端的數(shù)據(jù)交互,從而大大提高二次頁面的訪問速度的程序的效率。
9、配置網(wǎng)站的實體標簽: 這個Etag不是給用戶用的,而是給瀏覽器緩存用的。Etag是服務(wù)器告訴瀏覽器緩存,緩存中的內(nèi)容是否已經(jīng)發(fā)生變化的一種機制。通過Etag,瀏覽器就可以知道現(xiàn)在的緩存中的內(nèi)容是不是最新的,需不需要重新從服務(wù)器上重新下載。
10、使用CDN技術(shù)。 我們上網(wǎng)下載東西的時候經(jīng)常會看見什么“南方服務(wù)器”、“北方服務(wù)器”的就是用到了CDN技術(shù)來提高下載速度與穩(wěn)定性。
CDN的全稱是Content Delivery Network,即內(nèi)容分發(fā)網(wǎng)絡(luò)。其基本思路是盡可能避開互聯(lián)網(wǎng)上有可能影響數(shù)據(jù)傳輸速度和穩(wěn)定性的瓶頸和環(huán)節(jié),使內(nèi)容傳輸?shù)母臁⒏€(wěn)定。通過在網(wǎng)絡(luò)各處放置節(jié)點服務(wù)器所構(gòu)成的在現(xiàn)有的互聯(lián)網(wǎng)基礎(chǔ)之上的一層智能虛擬網(wǎng)絡(luò),CDN系統(tǒng)能夠?qū)崟r地根據(jù)網(wǎng)絡(luò)流量和各節(jié)點的連接、負載狀況以及到用戶的距離和響應(yīng)時間等綜合信息將用戶的請求重新導向離用戶最近的服務(wù)節(jié)點上。其目的是使用戶可就近取得所需內(nèi)容,解決 Internet網(wǎng)絡(luò)擁擠的狀況,提高用戶訪問網(wǎng)站的響應(yīng)速度(來自百度百科)。
11.使用Gzip壓縮文檔: GZIP編碼是用來改進網(wǎng)頁性能的方法,不僅可以減小存儲空間,還可以減少傳輸所需的時間。將網(wǎng)站中的文件使用Gzip壓縮后,可以顯著的增加網(wǎng)頁加載速度,同時也可以降低網(wǎng)站的帶寬流量消耗。
12.樣式表文件放在外部調(diào)用: 把頁面中需要用到的JavaScript和CSS樣式表文件放在另外的文件夾中,這樣一來在打開網(wǎng)站其它頁面時就會緩存這些調(diào)用的文件,從而加快網(wǎng)站頁面的加載速度。
13.給JavaScript文件減肥: 這個方法不同于gzip壓縮功能,縮小JavaScript文檔有很多方法,比如去除不必要的空格等其他標簽等。減少腳本文件后可以顯著的提高網(wǎng)頁的訪問速度。
14.圖片使用height和width屬性 每個圖片的height和width屬性可以讓瀏覽器在加載圖片之前就知道圖片的長和寬,并預(yù)留出指定的長寬待圖片加載后顯示。如果沒有這兩個屬性,瀏覽器還需要在讀取圖片成功后再處理一次頁面布局樣式,這無疑減慢了網(wǎng)頁加載速度。所以在固定圖片大小的情況下更好都使用上長和寬屬性。
15.CSS文件壓縮瘦身 DIV+CSS是現(xiàn)在流利的網(wǎng)頁布局方式,DIV定義了元素,CSS控制顯示效果。所以往往我們會把CSS寫到另外一個或多個外部鏈接CSS文件中,并且CSS文件代碼也有很多行。我們可以使用一些CSS壓縮工具來刪除CSS文件中不必要的多余內(nèi)容,如重復(fù)定義樣式、空格等來瘦身??梢試L試使用一下CleanCSS工具來壓縮你的CSS文件。
16.整合CSS、JS文件減少HTTP請求次數(shù) 現(xiàn)在的網(wǎng)頁都有多個圖片、CSS外部文件鏈接、Javascript外部腳本鏈接。所以當訪問一個網(wǎng)頁時瀏覽器需要多次向服務(wù)器請求這些文件。在請求和加載之間會產(chǎn)生不少的時間差。特別是一些網(wǎng)頁上有多個小圖片、圖標按鈕的網(wǎng)頁,有多少圖片,瀏覽器就需要請求多少將這些小文件,多將請求這些小圖片文件將明顯影響網(wǎng)頁的加載速度。所以我們應(yīng)該盡可能將小圖片拼合一個PNG大圖片上,然后通過坐標來顯示圖標。一次請求一個大圖片比多次請求小圖片速度要快不少。同樣,更好將CSS和Javascript盡可能地整合到一個文件中都有助于加快網(wǎng)頁載入速度。
17.目錄地址后加上斜杠(/) 如訪客點擊訪問這樣一個目錄地址:a.abc.cn/aa,去打開這個目錄下的index.html文檔。當服務(wù)器收到請求后它需要消耗一些時間來分析這是一個文件還是一個目錄。但是如果我們在最后加上一個斜杠(/),服務(wù)器就知道你是在訪問一個目錄地址,然后就直接加載默認文檔index.html或index.PHP就行了。這樣服務(wù)器就不用花時間來分析這個地址,也起到了一定加速的作用。