摘要：1够庙、減少頁(yè)面請(qǐng)求： 從WEB運(yùn)行原理上講嗽元，IIS請(qǐng)求是無(wú)狀態(tài)的，在服務(wù)器端一直是連接和關(guān)閉的不斷進(jìn)行著掠兄，如果能減少服務(wù)器請(qǐng)求像云，總的時(shí)間將會(huì)減少锌雀。 之前我下載163郵箱的登陸頁(yè)面的圖片時(shí)發(fā)現(xiàn)，它們的只用到了一個(gè)圖片來(lái)完成整個(gè)頁(yè)面的所有圖片迅诬，當(dāng)時(shí)我就納悶了腋逆，這跟平時(shí)做的網(wǎng)站不一樣呀。
1侈贷、減少頁(yè)面請(qǐng)求：
從WEB運(yùn)行原理上講惩歉，IIS請(qǐng)求是無(wú)狀態(tài)的，在服務(wù)器端一直是連接和關(guān)閉的不斷進(jìn)行著俏蛮，如果能減少服務(wù)器請(qǐng)求撑蚌，總的時(shí)間將會(huì)減少。
之前我下載163郵箱的登陸頁(yè)面的圖片時(shí)發(fā)現(xiàn)搏屑，它們的只用到了一個(gè)圖片來(lái)完成整個(gè)頁(yè)面的所有圖片争涌，當(dāng)時(shí)我就納悶了，這跟平時(shí)做的網(wǎng)站不一樣呀辣恋。然來(lái)這樣做減少瀏覽器的請(qǐng)求次數(shù)亮垫，用httpwatch你會(huì)發(fā)現(xiàn)請(qǐng)求的總時(shí)間大大減少了。同樣的想法伟骨，在做css樣式包警，JavaScript代碼的時(shí)候也要做到盡可能的放在一個(gè)文件下來(lái)減少WEB請(qǐng)求。
2底靠、頁(yè)面壓縮技術(shù)害晦，給我們js，HTML代碼進(jìn)行瘦身暑中。
jQuery作為JS最輕量級(jí)的類庫(kù)壹瘟，它的原類庫(kù)是242KB，壓縮后的它竟只有91.6KB鳄逾。常見的壓縮工具有GoogleClosureCompiler稻轨、YUI Compressor、JsPacker雕凹、gzip殴俱。我常用的是gzip，因?yàn)樗膲嚎s率是最高的枚抵。用jdk壓縮后它會(huì)把一些空格去掉线欲，把我們很長(zhǎng)的變量名換成換成很短的字母來(lái)代替。
3汽摹、樣式李丰、行為、結(jié)構(gòu)分離逼泣。
當(dāng)?shù)谝淮卧L問(wèn)頁(yè)面的時(shí)候趴泌，用戶就可以把CSS,JS代碼下載下來(lái)舟舒，這樣做雖然第一次使網(wǎng)頁(yè)加載的速度變慢了，但后面的頁(yè)面將快很多嗜憔。當(dāng)用戶訪問(wèn)這個(gè)網(wǎng)站的其它的頁(yè)面時(shí)秃励，由于其它頁(yè)面也引用了這個(gè)CSS樣式和JS代碼。瀏覽器發(fā)現(xiàn)它已經(jīng)下載好了吉捶，下一次就可以不用下載了莺治。這樣就做到了一次下載，后續(xù)速度的效果帚稠。
4谣旁、使用存儲(chǔ)過(guò)程
在運(yùn)行存儲(chǔ)過(guò)程前，數(shù)據(jù)庫(kù)已對(duì)其進(jìn)行了語(yǔ)法和句法分析滋早，并給出了優(yōu)化執(zhí)行方案榄审。這種已經(jīng)編譯好的過(guò)程可極大地改善SQL語(yǔ)句的性能。由于執(zhí)行SQL語(yǔ)句的大部分工作已經(jīng)完成杆麸，所以存儲(chǔ)過(guò)程能以極快的速度執(zhí)行搁进。這種預(yù)編譯的sql語(yǔ)句就可以直接執(zhí)行而節(jié)省了很大一部分查詢的時(shí)間。
5昔头、一些細(xì)節(jié)：
把CSS樣式放在頭部饼问，如果JS很多的話，把js代碼放在尾部揭斧。這樣做可以盡可能的先加載頁(yè)面的DOM結(jié)構(gòu)莱革，然后才可以級(jí)用戶體驗(yàn)。如果JS很多的大的話讹开，頁(yè)面都沒(méi)加載完盅视，何來(lái)用戶體驗(yàn)之說(shuō)呢。
6旦万、適當(dāng)?shù)氖褂肁JAX
現(xiàn)在的Ajax好像有點(diǎn)被神話了闹击，好像網(wǎng)頁(yè)只要Ajax了，那么就不存在效率問(wèn)題了成艘。其實(shí)這是一種誤解赏半。拙劣的使用Ajax不會(huì)讓你的網(wǎng)頁(yè)效率更高，反而會(huì)降低你的網(wǎng)頁(yè)效率淆两。Ajax的確是個(gè)好東西断箫，但是請(qǐng)不要過(guò)分的神話它。使用Ajax的時(shí)候也要考慮上面的那些準(zhǔn)則琼腔。
7瑰枫、盡量少使用樣式工具為我們生成的頁(yè)面樣式代碼，自己動(dòng)手把樣式寫在樣式文件里丹莲。盡量寫得通用些光坝。
8、頁(yè)面緩存
在大型的門戶網(wǎng)站都用到了緩存技術(shù)甥材，它是以空間換時(shí)間的技術(shù)盯另。
緩存主要是為了提高數(shù)據(jù)的讀取速度。因?yàn)榉?wù)器和應(yīng)用客戶端之間存在著流量的瓶頸洲赵，所以讀取大容量數(shù)據(jù)時(shí)鸳惯，使用緩存來(lái)直接為客戶端服務(wù)，可以減少客戶端與服務(wù)器端的數(shù)據(jù)交互叠萍，從而大大提高二次頁(yè)面的訪問(wèn)速度的程序的效率芝发。
9、配置網(wǎng)站的實(shí)體標(biāo)簽:
這個(gè)Etag不是給用戶用的苛谷，而是給瀏覽器緩存用的辅鲸。Etag是服務(wù)器告訴瀏覽器緩存，緩存中的內(nèi)容是否已經(jīng)發(fā)生變化的一種機(jī)制腹殿。通過(guò)Etag独悴，瀏覽器就可以知道現(xiàn)在的緩存中的內(nèi)容是不是最新的，需不需要重新從服務(wù)器上重新下載锣尉。
10刻炒、使用CDN技術(shù)。
我們上網(wǎng)下載東西的時(shí)候經(jīng)常會(huì)看見什么“南方服務(wù)器”自沧、“北方服務(wù)器”的就是用到了CDN技術(shù)來(lái)提高下載速度與穩(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)定旺嬉。通過(guò)在網(wǎng)絡(luò)各處放置節(jié)點(diǎn)服務(wù)器所構(gòu)成的在現(xiàn)有的互聯(lián)網(wǎng)基礎(chǔ)之上的一層智能虛擬網(wǎng)絡(luò)管行，CDN系統(tǒng)能夠?qū)崟r(shí)地根據(jù)網(wǎng)絡(luò)流量和各節(jié)點(diǎn)的連接、負(fù)載狀況以及到用戶的距離和響應(yīng)時(shí)間等綜合信息將用戶的請(qǐng)求重新導(dǎo)向離用戶最近的服務(wù)節(jié)點(diǎn)上邪媳。其目的是使用戶可就近取得所需內(nèi)容捐顷，解決 Internet網(wǎng)絡(luò)擁擠的狀況，提高用戶訪問(wèn)網(wǎng)站的響應(yīng)速度（來(lái)自百度百科）雨效。
11.使用Gzip壓縮文檔：
GZIP編碼是用來(lái)改進(jìn)網(wǎng)頁(yè)性能的方法迅涮，不僅可以減小存儲(chǔ)空間，還可以減少傳輸所需的時(shí)間徽龟。將網(wǎng)站中的文件使用Gzip壓縮后叮姑，可以顯著的增加網(wǎng)頁(yè)加載速度，同時(shí)也可以降低網(wǎng)站的帶寬流量消耗。
12.樣式表文件放在外部調(diào)用：
把頁(yè)面中需要用到的javascript和CSS樣式表文件放在另外的文件夾中传透，這樣一來(lái)在打開網(wǎng)站其它頁(yè)面時(shí)就會(huì)緩存這些調(diào)用的文件耘沼，從而加快網(wǎng)站頁(yè)面的加載速度。
13.給JavaScript文件減肥：
這個(gè)方法不同于gzip壓縮功能朱盐，縮小JavaScript文檔有很多方法群嗤，比如去除不必要的空格等其他標(biāo)簽等。減少腳本文件后可以顯著的提高網(wǎng)頁(yè)的訪問(wèn)速度兵琳。
14.圖片使用height和width屬性
每個(gè)圖片的height和width屬性可以讓瀏覽器在加載圖片之前就知道圖片的長(zhǎng)和寬狂秘，并預(yù)留出指定的長(zhǎng)寬待圖片加載后顯示。如果沒(méi)有這兩個(gè)屬性躯肌，瀏覽器還需要在讀取圖片成功后再處理一次頁(yè)面布局樣式者春，這無(wú)疑減慢了網(wǎng)頁(yè)加載速度。所以在固定圖片大小的情況下最好都使用上長(zhǎng)和寬屬性清女。
15.CSS文件壓縮瘦身
DIV+CSS是現(xiàn)在流利的網(wǎng)頁(yè)布局方式钱烟，DIV定義了元素，CSS控制顯示效果校仑。所以往往我們會(huì)把CSS寫到另外一個(gè)或多個(gè)外部鏈接CSS文件中忠售，并且CSS文件代碼也有很多行。我們可以使用一些CSS壓縮工具來(lái)刪除CSS文件中不必要的多余內(nèi)容迄沫，如重復(fù)定義樣式稻扬、空格等來(lái)瘦身⊙虼瘢可以嘗試使用一下CleanCSS工具來(lái)壓縮你的CSS文件泰佳。
16.整合CSS、JS文件減少HTTP請(qǐng)求次數(shù)
現(xiàn)在的網(wǎng)頁(yè)都有多個(gè)圖片尘吗、CSS外部文件鏈接逝她、Javascript外部腳本鏈接。所以當(dāng)訪問(wèn)一個(gè)網(wǎng)頁(yè)時(shí)瀏覽器需要多次向服務(wù)器請(qǐng)求這些文件睬捶。在請(qǐng)求和加載之間會(huì)產(chǎn)生不少的時(shí)間差黔宛。特別是一些網(wǎng)頁(yè)上有多個(gè)小圖片、圖標(biāo)按鈕的網(wǎng)頁(yè)擒贸，有多少圖片臀晃，瀏覽器就需要請(qǐng)求多少將這些小文件，多將請(qǐng)求這些小圖片文件將明顯影響網(wǎng)頁(yè)的加載速度介劫。所以我們應(yīng)該盡可能將小圖片拼合一個(gè)PNG大圖片上徽惋，然后通過(guò)坐標(biāo)來(lái)顯示圖標(biāo)。一次請(qǐng)求一個(gè)大圖片比多次請(qǐng)求小圖片速度要快不少座韵。同樣险绘，最好將CSS和Javascript盡可能地整合到一個(gè)文件中都有助于加快網(wǎng)頁(yè)載入速度。
17.目錄地址后加上斜杠（/）
如訪客點(diǎn)擊訪問(wèn)這樣一個(gè)目錄地址：http://www.zhen.com/dajiaguifan，去打開這個(gè)目錄下的index.html文檔宦棺。當(dāng)服務(wù)器收到請(qǐng)求后它需要消耗一些時(shí)間來(lái)分析這是一個(gè)文件還是一個(gè)目錄瓣距。但是如果我們?cè)谧詈蠹由弦粋€(gè)斜杠（/），服務(wù)器就知道你是在訪問(wèn)一個(gè)目錄地址渺氧，然后就直接加載默認(rèn)文檔index.html或index.PHP就行了旨涝。這樣服務(wù)器就不用花時(shí)間來(lái)分析這個(gè)地址蹬屹，也起到了一定加速的作用
