內容簡介
《高性能網站建設指南:前端工程師技能精髓》結合Web 2.0以來Web開發領域的最新形勢和特點,介紹了網站性能問題的現狀、產生的原因,以及改善或解決性能問題的原則、技術技巧和最佳實踐。重點關注網頁的行為特徵,闡釋最佳化Ajax、CSS、JavaScript、Flash和圖片處理等要素的技術,全面涵蓋瀏覽器端性能問題的方方面面。
內容提要
《高性能網站建設指南:前端工程師技能精髓》結合Web 2.0以來Web開發領域的最新形勢和特點,介紹了網站性能問題的現狀、產生的原因,以及改善或解決性能問題的原則、技術技巧和最佳實踐。重點關注網頁的行為特徵,闡釋最佳化Ajax、CSS、JavaScript、Flash和圖片處理等要素的技術,全面涵蓋瀏覽器端性能問題的方方面面。在《高性能網站建設指南:前端工程師技能精髓》中,作者給出了14條具體的最佳化原則,每一條原則都配以範例佐證,並提供了線上支持。全書內容豐富,主要包括減少HTTP請求、Edge Computing技術、Expires Header技術、gzip組件、CSS和JavaScript最佳實踐、主頁內聯、Domain最小化、JavaScript最佳化、避免重定向的技巧、刪除重複JavaScript的技巧、關閉ETags的技巧、Ajax快取技術和最小化技術等。
《高性能網站建設指南:前端工程師技能精髓》適合Web架構師、信息架構師、Web開發人員及產品經理閱讀和參考。
目錄
推薦序 xiii
前言 xv
緒言A 前端性能的重要性 1
跟蹤Web頁面性能 1
時間花在哪兒了? 3
性能黃金法則 4
緒言B HTTP概述 6
壓縮 7
條件GET請求 7
Expires 8
Keep-Alive 8
更多信息 9
第1章 規則1——減少HTTP請求 10
圖片地圖 10
CSS Sprites 11
內聯圖片 13
合併腳本和樣式表 15
小結 16
第2章 規則2——使用內容發布網路 18
內容發布網路 19
節省 20
第3章 規則3——添加Expires頭 22
Expires頭 22
Max-Age和mod_expires 23
空快取VS完整快取 24
不僅僅是圖片 25
修訂檔案名稱 27
示例 28
第4章 規則4——壓縮組件 29
壓縮是如何工作的 29
壓縮什麼 30
節省 31
配置 31
代理快取 33
邊緣情形 34
壓縮的實際效果 35
第5章 規則5——將樣式表放在頂部 37
逐步呈現 37
sleep.cgi 38
白屏 39
無樣式內容的閃爍 43
前端工程師應該做什麼? 43
第6章 規則6——將腳本放在底部 45
腳本帶來的問題 45
並行下載 46
腳本阻塞下載 48
最差情況:將腳本放在頂部 49
最佳情況:將腳本放在底部 49
正確地放置 50
第7章 規則7——避免CSS表達式 51
更新表達式 52
圍繞問題展開工作 52
小結 54
第8章 規則8——使用外部JavaScript和CSS 55
內聯VS外置 55
典型的對比結果 58
主頁 58
兩全其美 59
第9章 規則9——減少DNS查找 63
DNS快取和TTL 63
瀏覽器的視角 66
減少DNS查找 68
第10章 規則10——精簡JavaScript 69
精簡 69
混淆 70
節省 70
示例 72
錦上添花 73
第11章 規則11——避免重定向 76
重定向的類型 76
重定向是如何損傷性能的 77
重定向之外的其他選擇 79
第12章 規則12——刪除重複腳本 85
重複腳本——確有其事 85
重複腳本損傷性能 86
避免重複腳本 87
第13章 規則13——配置ETag 89
ETag是什麼? 89
ETag帶來的問題 91
Etag——用還是不用 93
現實世界中的ETag 94
第14章 規則14——使Ajax可快取 96
Web 2.0、DHTML和Ajax 96
異步與即時 98
最佳化Ajax請求 99
現實世界中的Ajax快取 99
第15章 析構十大網站 103
頁面大小、回響時間、YSlow等級 103
如何進行測試 105
Amazon 107
AOL 110
CNN 114
eBay 116
Google 120
MSN 123
MySpace 127
Wikipedia 130
Yahoo! 132
YouTube 135
索引 139