雅虎23條

1.Make fewer HTTP requests
盡可能減少HTTP請求次數(shù):通過合并圖片晃洒、CSS望伦、JS砰蠢,減少頁面上組件的數(shù)量減少了渲染頁面所需的HTTP請求的數(shù)量紧阔,降低頁面加載時間。

2.Use a Content Delivery Network (CDN)
使用CDN(內(nèi)容分發(fā)網(wǎng)絡):80-90%的最終用戶響應時間花在下載圖片烤黍,樣式知市,腳本,F(xiàn)lash等網(wǎng)頁組件上速蕊,所以最好先把靜態(tài)內(nèi)容分布到CDN上嫂丙。當用戶在讀取網(wǎng)頁內(nèi)容的時候,就會去就近服務器上下載JS和CSS规哲。提高訪問速度跟啤,保證資源服務器的穩(wěn)定性;并可節(jié)省流量唉锌。

3.Avoid empty src or href
避免使用空的src隅肥、href:當src、href內(nèi)容為空袄简,大部分瀏覽器會直接過濾掉腥放,但IE瀏覽器除外;IE依然會向空路徑發(fā)出請求绿语,可能會損壞用戶數(shù)據(jù)秃症,浪費服務器計算周期生成一個永遠不會被查看的頁面。

4.Add Expires headers
給文件頭添加過期時間:使內(nèi)容具有緩存性吕粹。Expires headers 告訴瀏覽器應該從服務器或從瀏覽器的緩存獲取指定文件种柑。Expires headers 的設計目的是希望使用緩存來減少HTTP requests的數(shù)量,從而減少HTTP相應的大小匹耕。

5.Compress components with gzip
用gzip壓縮內(nèi)容:壓縮通過減少HTTP響應的大小來減少響應時間聚请。gzip是目前可用的最流行和最有效的壓縮方法,通常將響應大小減少約70%稳其。

6.Put CSS at top
把CSS放在頂部

7.Put JavaScript at bottom
把JS放在底部:JavaScript腳本阻止并行下載驶赏,以免對后續(xù)資源造成阻塞;

8.Avoid CSS expressions
避免使用CSS表達式:CSS表達式(在IE5.0以后開始支持)是動態(tài)設置CSS屬性的一種強大且危險的方法欢际。
當頁面被渲染并調(diào)整大小時母市,當頁面滾動時,甚至當用戶在頁面上移動鼠標時损趋,根據(jù)表達式重新計算患久。這些頻繁的計算降低了用戶體驗椅寺。

9.Make JavaScript and CSS external
將CSS和JS放到外部文件中:使用外部JS和CSS文件通常會產(chǎn)生更快的頁面,因為文件是由瀏覽器緩存的蒋失。在HTML文檔中嵌入的JavaScript和CSS在每次請求HTML文檔時都會被下載返帕。這減少了HTTP請求的數(shù)量,但增加了HTML文檔的大小篙挽。另一方面荆萤,如果JavaScript和CSS在瀏覽器緩存的外部文件中,則HTML文檔的大小會減少而不增加HTTP請求的數(shù)量铣卡。(需根據(jù)PV和IP的比例權衡)

10.Reduce DNS lookups
減少DNS查找次數(shù):減少DNS解析時間链韭。

11.Minify JavaScript and CSS
精簡JS及CSS:刪除不需要的空白字符(空格、換行符和選項卡)煮落。

12.Avoid URL redirects
避免重定向(重定向讓用戶感覺網(wǎng)頁速度很慢敞峭。)

13.Remove duplicate JavaScript and CSS
刪除重復的JS及CSS:重重復的JavaScript和CSS文件,通過創(chuàng)建不必要的HTTP請求(僅IE)和浪費JavaScript執(zhí)行(IE和Firefox)來損害性能蝉仇。

  • 在IE中旋讹,如果一個外部腳本被包含兩次而不是可緩存的,它會在頁面加載期間生成兩個HTTP請求轿衔。

  • 在IE和Firefox中沉迹,重復的JavaScript腳本導致浪費時間來不止一次地評估同一腳本。不管腳本是否是可緩存的害驹,這種冗余腳本執(zhí)行都會發(fā)生鞭呕。

14.Configure entity tags (ETags)
配置實體標簽(ETags):用來判斷瀏覽器緩存里的元素是否和原來服務器上的一致。使用ETags減少Web應用帶寬和負載宛官。

15.Make AJAX cacheable
緩存AJAX:AJAX異步請求后臺web服務器琅拌,但使用AJAX并不保證用戶不會等待異步JavaScript和XML響應返回。優(yōu)化AJAX響應對于提高性能非常重要摘刑,利用響應緩存來改進AJAX的性能。

16.Use GET for AJAX requests
使用GET來完成AJAX請求:當使用XHR對象時刻坊,瀏覽器在兩個步驟中實現(xiàn)POST:先發(fā)送頭文件枷恕,然后發(fā)送數(shù)據(jù)。最好使用GET而不是POST谭胚,因為GET將標題和數(shù)據(jù)一起發(fā)送(除非有很多Cookie)徐块。IE里面最大的URL長度為2K,如果需要發(fā)送>2K的數(shù)據(jù)就不能用GET方式了灾而。

17.Reduce the number of DOM elements
減少DOM元素的數(shù)量:復雜的頁面意味著要下載更多的字節(jié)胡控,也意味著JavaScript中的DOM訪問速度較慢。減少頁面上DOM元素的數(shù)量旁趟,以提高性能昼激。

18.Avoid HTTP 404 (Not Found) error
避免404錯誤

19.Reduce cookie size
減少cookie的大小:因為很多理由需要使用cookies,例如:認證橙困,個性化等瞧掺。cookies在HTTP頭信息,是服務器和瀏覽器之間的信息交互凡傅。為了最大程度地降低對用戶響應時間的影響辟狈,需要讓cookies的大小盡量最小化。

20.Use cookie-free domains
使用無cookie的域:當瀏覽器請求靜態(tài)圖像并向請求發(fā)送cookies時夏跷,服務器會忽略cookies哼转,但這些cookies是不必要的網(wǎng)絡流量。解決建議:可以創(chuàng)建一個子域名來放置靜態(tài)組件槽华,瀏覽器發(fā)送靜態(tài)內(nèi)容的請求時不會發(fā)送cookies的域名壹蔓。

21.Avoid AlphaImageLoader filter
避免使用濾鏡:IE特有的AlphaImageLoader濾鏡是為了解決在IE7以下正彩色PNG圖片的半透明的問題。用了此濾鏡下載時會阻塞渲染硼莽,并且內(nèi)存消耗成倍增加庶溶。

22.Do not scale images in HTML
不要在HTML中縮放圖片

23.Make favicon small and cacheable
使favicon.ico盡量小且可被緩存:圖片favicon.ico應該在服務器的根目錄下面。

  • 使小圖標盡量小懂鸵。

  • 使favicon.ico緩存可避免頻繁的請求偏螺。

?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市匆光,隨后出現(xiàn)的幾起案子套像,更是在濱河造成了極大的恐慌,老刑警劉巖终息,帶你破解...
    沈念sama閱讀 219,366評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件夺巩,死亡現(xiàn)場離奇詭異,居然都是意外死亡周崭,警方通過查閱死者的電腦和手機柳譬,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,521評論 3 395
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來续镇,“玉大人美澳,你說我怎么就攤上這事∶剑” “怎么了制跟?”我有些...
    開封第一講書人閱讀 165,689評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長酱虎。 經(jīng)常有香客問我雨膨,道長,這世上最難降的妖魔是什么读串? 我笑而不...
    開封第一講書人閱讀 58,925評論 1 295
  • 正文 為了忘掉前任聊记,我火速辦了婚禮撒妈,結果婚禮上,老公的妹妹穿的比我還像新娘甥雕。我一直安慰自己踩身,他們只是感情好,可當我...
    茶點故事閱讀 67,942評論 6 392
  • 文/花漫 我一把揭開白布社露。 她就那樣靜靜地躺著挟阻,像睡著了一般。 火紅的嫁衣襯著肌膚如雪峭弟。 梳的紋絲不亂的頭發(fā)上附鸽,一...
    開封第一講書人閱讀 51,727評論 1 305
  • 那天,我揣著相機與錄音瞒瘸,去河邊找鬼坷备。 笑死,一個胖子當著我的面吹牛情臭,可吹牛的內(nèi)容都是我干的省撑。 我是一名探鬼主播,決...
    沈念sama閱讀 40,447評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼俯在,長吁一口氣:“原來是場噩夢啊……” “哼竟秫!你這毒婦竟也來了?” 一聲冷哼從身側響起跷乐,我...
    開封第一講書人閱讀 39,349評論 0 276
  • 序言:老撾萬榮一對情侶失蹤肥败,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后愕提,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體馒稍,經(jīng)...
    沈念sama閱讀 45,820評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,990評論 3 337
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,127評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖沪么,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 35,812評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站订歪,受9級特大地震影響脖祈,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜刷晋,卻給世界環(huán)境...
    茶點故事閱讀 41,471評論 3 331
  • 文/蒙蒙 一盖高、第九天 我趴在偏房一處隱蔽的房頂上張望慎陵。 院中可真熱鬧,春花似錦喻奥、人聲如沸席纽。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,017評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽润梯。三九已至,卻和暖如春甥厦,著一層夾襖步出監(jiān)牢的瞬間纺铭,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,142評論 1 272
  • 我被黑心中介騙來泰國打工刀疙, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留舶赔,地道東北人。 一個月前我還...
    沈念sama閱讀 48,388評論 3 373
  • 正文 我出身青樓谦秧,卻偏偏與公主長得像竟纳,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子疚鲤,可洞房花燭夜當晚...
    茶點故事閱讀 45,066評論 2 355

推薦閱讀更多精彩內(nèi)容