淺談URL使用在前端設(shè)計(jì)中的優(yōu)化 |
發(fā)布時(shí)間: 2012/7/10 17:05:49 |
很多朋友都認(rèn)為關(guān)于URL優(yōu)化方面的工作是后端工程師做的,前端方面注重結(jié)構(gòu)方面的優(yōu)化就可以了。其實(shí)不然,對(duì)于請(qǐng)求及DNS請(qǐng)求等等諸多方面,前端工程師也應(yīng)該在自己能做到的方面給予優(yōu)化。
下面我就說(shuō)說(shuō)我對(duì)于URL在前端優(yōu)化方面的理解,希望大家指正。 首先,第一點(diǎn),比較“吝嗇”,就是使用“c”、“j”、“i”文件夾分別代替我們經(jīng)常用的“css”、“javascript”、“images”文件夾。如果沒(méi)有記錯(cuò)的話,這個(gè)方法是Zeldman在《網(wǎng)站重構(gòu)》第一版的時(shí)候提出來(lái)的(如果記錯(cuò)了,歡迎大家指正),我是比較贊成這個(gè)的。當(dāng)然很多人會(huì)說(shuō),有這個(gè)必要嗎?我個(gè)人覺(jué)得有,雖然這樣做或許不會(huì)對(duì)頁(yè)面精簡(jiǎn)帶來(lái)太大的效果,但是并不會(huì)帶來(lái)任何壞處。 第二點(diǎn),對(duì)于鏈接到像http://www.example.com/dir/這樣的URL時(shí)候,記得在最后加上“/”,因?yàn)槿绻愕木W(wǎng)站包含目錄并使用了自動(dòng)索引,不加結(jié)尾的斜線的話會(huì)頁(yè)面會(huì)多一次重定向。(p.s:對(duì)于鏈接到主機(jī)名的鏈接可以不必加) 第三點(diǎn),就是上面已經(jīng)提到的重定向問(wèn)題。這應(yīng)該是前端最應(yīng)該重視的基于URL的優(yōu)化問(wèn)題,大家應(yīng)該都有親身體驗(yàn)重定向時(shí)的等待的不愉悅,尤其是第一個(gè)請(qǐng)求就是重定向時(shí),用戶看到的是一個(gè)“漫長(zhǎng)”的空白頁(yè)面過(guò)程。所以應(yīng)該避免濫用重定向,不過(guò)很多時(shí)候(主要用在跟蹤)還是需要用到重定向,當(dāng)然這也包括服務(wù)器的配置方面,不管怎么說(shuō),我們還是在我們能做的方面盡量做好吧。 第四點(diǎn),減少DNS的查找。對(duì)與這點(diǎn),可以主要從增大DNS緩存時(shí)間和減少網(wǎng)站內(nèi)容主機(jī)請(qǐng)求數(shù)量?jī)牲c(diǎn)來(lái)優(yōu)化。對(duì)于第一點(diǎn)在網(wǎng)站端可以通過(guò)DNS的 TTL及HTTP的Keep-Alive來(lái)設(shè)置(雖然這不是HTTP1.1中必需的,但是很多瀏覽器和服務(wù)器都包含它)。當(dāng)然你在配置中得考慮自己網(wǎng)站的實(shí)際情況,確保你的內(nèi)容和ip不會(huì)在你設(shè)置的時(shí)間內(nèi)失效。在主機(jī)名數(shù)量上,減少唯一主機(jī)名的數(shù)量會(huì)減少頁(yè)面并行下載的數(shù)量,基于下面要說(shuō)的原因,Steve Souders建議網(wǎng)站數(shù)據(jù)內(nèi)容分別放在2-3個(gè)主機(jī)名下是最優(yōu)選擇。 最后一點(diǎn),將數(shù)據(jù)內(nèi)容并行下載。在HTTP1.1規(guī)范下,建議瀏覽器從每個(gè)主機(jī)名并行的下載兩個(gè)數(shù)據(jù)包內(nèi)容,并且很多瀏覽器默認(rèn)都是這樣做的(可以打開(kāi) YSlow對(duì)照頁(yè)面在firefox下的結(jié)果),如果你的頁(yè)面包含較多的圖片等數(shù)據(jù)內(nèi)容,將其分別放在兩個(gè)主機(jī)名下,整體的下載時(shí)間將會(huì)有明顯的縮短。但是基于上面一點(diǎn)的原因,不要將內(nèi)容放在太多的主機(jī)下,至于實(shí)際幾個(gè),可以通過(guò)自己的頁(yè)面情況考慮。 當(dāng)然,基于URL的優(yōu)化,在服務(wù)器方面的配置(包括CDN,路由等方面)效果明顯,但是我們前端在做好其他如頁(yè)面結(jié)構(gòu)、頁(yè)面壓縮、HTTP請(qǐng)求數(shù)量等方面的優(yōu)化下,進(jìn)行上述的URL使用優(yōu)化,肯定能使你的頁(yè)面有更好的呈現(xiàn)。 本文很多觀點(diǎn)來(lái)自Steve Souders的《高性能網(wǎng)站建設(shè)指南》,本文內(nèi)容比較偏,歡迎大家拍磚,F(xiàn)在像google的分布式還有熱門的云計(jì)算方面也是URL優(yōu)化方面極具討論價(jià)值的話題,歡迎大家討論指教。 本文出自:億恩科技【mszdt.com】 服務(wù)器租用/服務(wù)器托管中國(guó)五強(qiáng)!虛擬主機(jī)域名注冊(cè)頂級(jí)提供商!15年品質(zhì)保障!--億恩科技[ENKJ.COM] |