徐凱著

ISBN 978-7-121-23345-6

2014年6月出版

定價：55.00元

240頁

16開

編輯推薦

√聚焦開創性話題，完整呈現與詳盡剖析這一突破終端碎片化難局的解決方案

√鬼道及團隊傾力打造，三大電商前端技術掌門及一線網際網路高工讚譽力推

√跨越手機、平板、桌面和電視等不同終端在呈現本質與商業模式上的差異，強調業務本質和核心人機互動流程

√面向未來人機互動，學會如何選擇響應式Web、服務端響應式Web、多個URL Web，Hybrid或Native應用

√融合Web頁面和客戶端應用，用一套資料多個高品質低成本呈現的移動優先思想來變革前端開發方式、架構和釋出機制

√從天貓實際業務場景出發，覆蓋大量已經一線實踐檢驗的技術、思路、方法、流程和先進經驗

內容提要

移動網際網路不可阻擋地進入了我們的生活。作者將自己在百度和天貓期間的跨終端Web的開發實踐轉化為書中的技術方案和實現，呈現給各位讀者。第1章提出了跨終端Web的概念以及實現跨終端Web的多重途徑，第2章主要介紹Mobile Web的技術基礎，第3～7章是全書的核心，按照開發流程組織逐步講解了實現跨終端Web所需要的各類技術基礎設施，第8章主要介紹了Hybrid App的發展歷程、實現細節以及成熟的框架，第9章介紹的跨終端儲存方案（Storage）是作者曾經的冠軍作品，第10章完整介紹瞭如何透過指令碼錄製和回放來實現跨終端動作同步。

《跨終端 Web》講解深入淺出，通暢易懂，適合有一定PC Web基礎，希望迅速瞭解Mobile Web，致力於PC和Mobile Web技術融合的讀者。

1 跨終端Web 1

1.1 終端VS.裝置 1

1.2 一個貫穿全書的例子 2

1.3 後續章節 3

1.4 移動優先 4

1.4.1 移動流量暴增 4

1.4.2 聚焦業務本質 5

1.4.3 人機互動擴充套件 7

1.4.4 再說書名 8

1.5 不只是響應式 8

1.5.1 響應式 8

1.5.2 多站點 13

1.5.3 多模板 13

1.5.4 多平臺 15

1.6 解決方案 16

2 Mobile Web 17

2.1 HTML5 18

2.2 HTML 19

2.2.1 移動頁面模板 19

2.2.2 Viewport 21

2.2.3 touch-icon 26

2.2.4 其他 27

2.3 觸屏事件 27

2.3.1 觸屏事件一覽 27

2.3.2 通用觸屏事件 28

2.4 除錯 31

2.4.1 遠端除錯 31

2.4.2 裝置除錯 43

2.5 相容性 44

2.5.1 OS版本碎片化 44

2.5.2 國內的特殊情況 46

2.5.3 WebView 46

2.5.4 更多工具 46

2.6 文件 48

3 基準 51

3.1 GBS 51

3.2 MGBS 53

3.2.1 準備 53

3.2.2 作業系統分級 54

3.2.3 螢幕解析度分級 65

3.2.4 瀏覽器分級 71

3.2.5 MGBS 73

3.3 GTE 75

3.3.1 分層設計 76

3.3.2 核心層 76

3.3.3 資料層 78

4 檢測 81

4.1 終端 81

4.1.1 什麼是終端 81

4.1.2 分類 82

4.2 終端檢測 82

4.2.1 場景 82

4.2.2 原理 83

4.2.3 實現 85

4.3 遺留問題 86

4.3.1 硬體資訊 86

4.3.2 更精準的終端檢測 86

5 介面 87

5.1 跨終端流程複用 87

5.1.1 示例1 87

5.1.2 示例2 88

5.2 IF 89

5.2.1 始於一次重構 90

5.2.2 新的環境 95

5.2.3 模型 95

5.2.4 解決方案 96

5.2.5 架構 96

5.2.6 路線圖 99

5.3 if-spec 2.0 102

5.3.1 JSON Schema 102

5.3.2 Demo 109

5.3.3 meta 113

5.3.4 if-spec 1.0 114

5.4 if-mock 2.0 116

5.5 if-guide 2.0 118

5.6 總結 122

6 定位 125

6.1 定位 126

6.1.1 Hash 126

6.1.2 History API 127

6.1.3 檢視定位 129

6.2 資料 129

7 預覽 131

7.1 客戶端 132

7.2 服務端 133

7.3 示例 136

8 Hybrid App 139

8.1 Hybrid簡史 139

8.1.1 背景 139

8.1.2 簡史 140

8.1.3 現狀 142

8.2 Hybrid技術 144

8.2.1 Native呼叫Web 144

8.2.2 Web呼叫Native 144

8.2.3 Bridge 146

8.3 Hybrid框架 150

8.3.1 PhoneGap 151

8.3.2 Titanium 152

8.4 Device API 153

8.4.1 動作感測器 156

8.4.2 環境感測器 158

8.4.3 音訊 159

8.4.4 影片 160

8.5 小結 160

9 儲存 161

9.1 狀態持久化 162

9.2 技術方案 163

9.2.1 整體方案 163

9.2.2 跨終端儲存方案 164

9.2.3 跨域通訊方案 166

9.2.4 安全性 168

9.2.5 遺留問題 168

9.3 使用 168

9.3.1 例項化 169

9.3.2 set/get 169

9.3.3 remove/clear 170

9.3.4 推薦命名 170

10 動作同步 171

10.1 原理 171

10.1.1 案例 171

10.1.2 動作同步 172

10.2 實現 173

10.2.1 Selenium 173

10.2.2 指令碼錄製和回放 174

附錄A GBS 183

附錄B JSON Schema Core 189

附錄C JSON Schema Validation 201

附錄D if-spec 2.0 221

作者簡介 225

作者簡介

鬼道（原名徐凱），2011年畢業於同濟大學計算機系，模式識別方向碩士研究生。曾就職百度，現為天貓前端通用組技術Leader。曾獲得2011年百度最佳新人、2013年天貓技術部最佳新人、2013年天貓最佳小二（成長）。

2013年10月，憑藉跨終端跨域儲存元件Storage獲得阿里“2013 Kissy Gallery元件大賽”冠軍。

本書源於2013年7月在D2上的主題分享“移動優先的跨終端Web”，2013年11月在W3CTECH 2013做了第二次分享。

就職天貓期間（2013年至今）帶領團隊完成了天貓工具欄專案並在2013年“雙十一”取得4倍於目標的成績，工具欄也成為電商站點模仿的熱點。

就職百度期間（2011年至2013年）帶領前端團隊先後完成了全平臺（Web/Android/iOS）移動廣告SDK及其業務站點、移動富媒體廣告SDK、移動統計SDK及業務站點、移動雲測試中心（Alpha 版本）等工作。

新浪微博： @鬼道-徐凱

媒體評論

支付寶前端負責人玉伯（王保平）

這是一本從天貓的實際業務場景出發，經過點滴積累、持久堅持而寫就的書。書中的內容有可能很快會過時，但作者面對問題時的思考方式、解決問題後的總結習慣永不過時。書中的思考，值得每一位程式設計師學習並實踐。

----------------------------------------------

天貓前端負責人三七（鄢學鯤）

現在人和人最大的共同點也許就是都擁有一部智慧移動終端，瀏覽器的大量使用催生了前端工程師職業的出現，智慧移動終端的爆炸式普及會推動前端工程師規模的超幾何級增長和綜合技能的革命性升級。前端工程師要從“相容多瀏覽器 + ajax”走入到“跨終端 + 前後端分離”時代，這本書就是開始。

----------------------------------------------

淘寶前端負責人小馬（趙澤欣）

這兩年我的工作重心全都放在跨終端領域。我堅定的認為：在跨終端時代，無論是產品設計與運營，還是技術架構和開發模式，都將發生重大的變革。所有Web開發人員即將面臨（或者說已然面臨）新的挑戰。尤其對前端工程師而言，會是一次升級的良機。我建議所有的前端工程師馬上開始關注這個領域。

----------------------------------------------

百度前端高工李玉北

鬼道同學從自身的專案經歷出發，總結了跨終端Web開發中遇到的問題，並給出對應的最佳實踐的解決方案，值得從事相關工作的同學去參考和借鑑。

前言

移動網際網路不可阻擋地進入了我們的生活。筆者將自己在百度和天貓期間的跨終端Web的開發實踐轉化為書中的技術方案和實現，呈現給各位讀者。

本書大綱來自於筆者2013年7月在D2上的主題分享“移動優先的跨終端Web”，2013年11月W3CTECH 2013上做了第二次分享。

物件導向

本書適合有一定PC Web基礎，希望迅速瞭解Mobile Web，致力於PC和Mobile Web技術融合的讀者。

本書的第1章、第3章、第5章面向所有的讀者，即使您對Web技術毫無瞭解，仍可以順利閱讀下來。本書其他章節假定您對PC Web前端技術已經有所瞭解，知道HTML、CSS、JavaScript這些名詞的含義，並且動手寫過一個頁面。

章節簡介

第1章闡述了移動網際網路的現狀和遇到的問題，提出了跨終端Web的概念以及實現跨終端Web的多重途徑，破除了“唯Media Query論”，並引入移動移先的概念，豐富跨終端Web的核心。

第2章從對比PC Web的角度介紹了Mobile Web的技術基礎，並對遠端除錯、相容性等開發問題做了詳盡的闡述。

第3～7章是全書的核心，按照開發流程組織，逐步講解了實現跨終端Web所需要的各類技術基礎設施，包括：

? 基準，給出了除錯和測試過程中的基準，確定除錯和測試的範圍。

? 檢測，探討如何構造一個為全站服務的終端屬性檢測工具。

? 介面，探索實現流程複用的途徑及端到端的介面規範（IF）。

? 定位，分別介紹了基於Hash和基於History API的跨終端定位方案。

? 預覽，介紹了實現跨終端預覽的方案，並給出一個簡化的實現。

第8章介紹了Hybrid App的發展歷程、實現細節以及成熟的框架，並詳細分析了以感測器為核心的Device API。

第9章的跨終端儲存方案（Storage）是筆者參加“2013 Kissy Gallery元件大賽”時的冠軍作品。

第10章完整介紹瞭如何透過指令碼錄製和回放來實現跨終端動作同步。

跨終端 Web

相關文章