`

跨终端 Web

 
阅读更多

跨终端 Web移动优先|响应式|HTML5|Hybrid|桌面+移动应用|一线前端负责人联袂推荐

徐凯    

ISBN 978-7-121-23345-6

20146月出版

定价:55.00

240

16

编辑推荐

√聚焦开创性话题,完整呈现与详尽剖析这一突破终端碎片化难局的解决方案

√鬼道及团队倾力打造,三大电商前端技术掌门及一线互联网高工赞誉力推

√跨越手机、平板、桌面和电视等不同终端在呈现本质与商业模式上的差异,强调业务本质和核心人机交互流程

√面向未来人机交互,学会如何选择响应式Web、服务端响应式Web、多个URL WebHybridNative应用

√融合Web页面和客户端应用,用一套数据多个高品质低成本呈现的移动优先思想来变革前端开发方式、架构和发布机制

√从天猫实际业务场景出发,覆盖大量已经一线实践检验的技术、思路、方法、流程和先进经验

内容提要

移动互联网不可阻挡地进入了我们的生活。作者将自己在百度和天猫期间的跨终端Web的开发实践转化为书中的技术方案和实现,呈现给各位读者。第1章提出了跨终端Web的概念以及实现跨终端Web的多重途径,第2章主要介绍Mobile Web的技术基础,第37章是全书的核心,按照开发流程组织逐步讲解了实现跨终端Web所需要的各类技术基础设施,第8章主要介绍了Hybrid App的发展历程、实现细节以及成熟的框架,第9章介绍的跨终端存储方案(Storage)是作者曾经的冠军作品,第10章完整介绍了如何通过脚本录制和回放来实现跨终端动作同步。

《跨终端 Web》讲解深入浅出,通畅易懂,适合有一定PC Web基础,希望迅速了解Mobile Web,致力于PCMobile 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  示例187

5.1.2  示例288

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  Bridge146

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年天猫最佳小二(成长)。

201310月,凭借跨终端跨域存储组件Storage获得阿里“2013 Kissy Gallery组件大赛”冠军。

本书源于20137月在D2上的主题分享“移动优先的跨终端Web”,201311月在W3CTECH 2013做了第二次分享。

就职天猫期间(2013年至今)带领团队完成了天猫工具栏项目并在2013年“双十一”取得4倍于目标的成绩,工具栏也成为电商站点模仿的热点。

就职百度期间(2011年至2013年)带领前端团队先后完成了全平台(Web/Android/iOS)移动广告SDK及其业务站点、移动富媒体广告SDK、移动统计SDK及业务站点、移动云测试中心(Alpha 版本)等工作。

新浪微博: @鬼道-徐凯

媒体评论

支付宝前端负责人玉伯(王保平)

这是一本从天猫的实际业务场景出发,经过点滴积累、持久坚持而写就的书。书中的内容有可能很快会过时,但作者面对问题时的思考方式、解决问题后的总结习惯永不过时。书中的思考,值得每一位程序员学习并实践。

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

天猫前端负责人三七(鄢学鲲)

现在人和人最大的共同点也许就是都拥有一部智能移动终端,浏览器的大量使用催生了前端工程师职业的出现,智能移动终端的爆炸式普及会推动前端工程师规模的超几何级增长和综合技能的革命性升级。前端工程师要从“兼容多浏览器 + ajax”走入到“跨终端 + 前后端分离”时代,这本书就是开始。

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

淘宝前端负责人小马(赵泽欣)

这两年我的工作重心全都放在跨终端领域。我坚定的认为:在跨终端时代,无论是产品设计与运营,还是技术架构和开发模式,都将发生重大的变革。所有Web开发人员即将面临(或者说已然面临)新的挑战。尤其对前端工程师而言,会是一次升级的良机。我建议所有的前端工程师马上开始关注这个领域。

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

百度前端高工李玉北

鬼道同学从自身的项目经历出发,总结了跨终端Web开发中遇到的问题,并给出对应的最佳实践的解决方案,值得从事相关工作的同学去参考和借鉴。

前言

移动互联网不可阻挡地进入了我们的生活。笔者将自己在百度和天猫期间的跨终端Web的开发实践转化为书中的技术方案和实现,呈现给各位读者。

本书大纲来自于笔者20137月在D2上的主题分享“移动优先的跨终端Web”,201311W3CTECH 2013上做了第二次分享。

面向对象

本书适合有一定PC Web基础,希望迅速了解Mobile Web,致力于PCMobile Web技术融合的读者。

本书的第1章、第3章、第5章面向所有的读者,即使您对Web技术毫无了解,仍可以顺利阅读下来。本书其他章节假定您对PC Web前端技术已经有所了解,知道HTMLCSSJavaScript这些名词的含义,并且动手写过一个页面。

章节简介

1章阐述了移动互联网的现状和遇到的问题,提出了跨终端Web的概念以及实现跨终端Web的多重途径,破除了“唯Media Query论”,并引入移动移先的概念,丰富跨终端Web的内核。

2章从对比PC Web的角度介绍了Mobile Web的技术基础,并对远程调试、兼容性等开发问题做了详尽的阐述。

37章是全书的核心,按照开发流程组织,逐步讲解了实现跨终端Web所需要的各类技术基础设施,包括:

     基准,给出了调试和测试过程中的基准,确定调试和测试的范围。

     检测,探讨如何构造一个为全站服务的终端属性检测工具。

     接口,探索实现流程复用的途径及端到端的接口规范(IF)。

     定位,分别介绍了基于Hash和基于History API的跨终端定位方案。

     预览,介绍了实现跨终端预览的方案,并给出一个简化的实现。

8章介绍了Hybrid App的发展历程、实现细节以及成熟的框架,并详细分析了以传感器为核心的Device API

9章的跨终端存储方案(Storage)是笔者参加“2013 Kissy Gallery组件大赛”时的冠军作品。

10章完整介绍了如何通过脚本录制和回放来实现跨终端动作同步。

 

  • 大小: 118 KB
分享到:
评论

相关推荐

    跨终端Web pdf

    第1章提出了跨终端Web的概念以及实现跨终端Web的多重途径,第2章主要介绍Mobile Web的技术基础,第3~7章是全书的核心,按照开发流程组织逐步讲解了实现跨终端Web所需要的各类技术基础设施,第8章主要介绍了Hybrid ...

    跨终端Web

    第1章提出了跨终端Web的概念以及实现跨终端Web的多重途径,第2章主要介绍Mobile Web的技术基础,第3~7章是全书的核心,按照开发流程组织逐步讲解了实现跨终端Web所需要的各类技术基础设施,第8章主要介绍了Hybrid ...

    跨终端Web之HybridApp

    Hybrid既利用了NativeApp丰富的设备API(DeviceAPI),又能拥有MobileWeb的跨平台、高效开发、快速发布的能力,对于相当庞大的应用场景而言都是适用的。跨平台Web内容可以做到开发一次,所有平台生效,诸多产品需要...

    silianlinyi#ExamplesOfFrontEndDevelopment#跨终端Web1

    2.单域 - 多模板 3.多域 - 跳转 4.多平台App

    web跨终端开发流程

    【标题】:“Web跨终端开发流程” 在当前的互联网环境中,Web应用已经不再局限于单一的桌面端,而是需要适应各种不同设备,如手机、平板、智能电视等,这就是所谓的“Web跨终端开发”。这一过程涉及到的技术和流程...

    ITeye 8月技术图书有奖试读活动——已结束

    本书《跨终端Web》由徐凯所著,由电子工业出版社在2014年6月出版。本书聚焦于解决移动互联网时代,跨终端Web应用开发面临的挑战,即移动设备的碎片化问题。随着智能手机和平板电脑等移动设备的普及,开发者们需要在...

    跨终端的 Web 2013-04-12

    在IT领域,尤其是在前端开发中,“跨终端的Web”是一个重要的概念,特别是在2013年及之后的时间里,随着移动互联网的崛起,这个问题变得愈发关键。舒⽂文在qcon-chengdu-2013-04-12的演讲中探讨了这一主题,强调了...

    跨终端的文件加载及缓存.pdf

    跨终端的文件加载及缓存是现代互联网应用开发中至关重要的一环,特别是在移动设备多样化、网络环境复杂的背景下,优化文件的加载和缓存策略对于提升用户体验、降低服务器压力具有显著效果。本文将深入探讨这一主题,...

    layer最懂你的跨终端的web弹层组件

    总的来说,layer作为一款强大的Web弹层组件,凭借其全面的功能、跨终端的适应性、易用的API以及优秀的性能,成为JavaScript开发中处理模态框和弹出框的理想选择。无论你是初级开发者还是经验丰富的前端工程师,layer...

    ReactNative引领未来的用户界面开发框架

    无论传统网站还是移动开发,尤其跨终端Web,一步跟不上React,就会被远远抛开 以BAT为首的一线国内互联网企业均以快速跟进研发、实践React,下一次求职你就一定会被面到 React极有可能让撕B不止的前端社区迎来和平和...

    SpriteJS一款由 360 奇舞团开源的跨终端 canvas/webgl 绘图库, 是跨平台的高性能图形系统

    360 奇舞团开源的跨终端 canvas/webgl 绘图库,可以基于 canvas/webgl 快速绘制结构化 UI 、动画和交互效果,并发布到任何拥有 canvas 环境的平台上(比如浏览器、小程序和 node ),SpriteJS 是跨平台的高性能图形...

    大前端学习流程

    * 移动Web开发:跨终端WEB和主流设备简介、视口、流式布局、弹性盒子、rem、移动终端JavaScript事件、手机中常见JS效果制作、Zepto.js、手机聚划算页面、手机滚屏 第三阶段:HTTP服务和AJAX编程 * WEB服务器基础:...

    Python-ttyd一个简单的命令行工具用来在Web上共享终端

    这个工具对于开发者、系统管理员或者任何需要远程协作和控制终端的人来说非常实用,因为它提供了跨平台的、易于使用的界面,而无需复杂的配置或者依赖特定的桌面环境。 首先,我们要理解TTY(Teletype)的概念,它...

    极酷跨平台多终端网页播放器v2.0

    极酷跨平台多终端网页播放器(PC终端/IPHONE、IPAD/安卓终端): 适配pc终端、苹果终端(含IPHONE、IPAD)、安卓终端(含安卓系统手机和安卓系统平板) 播放器轻松实现视频播放跨平台: 1.只要在一个页面中,调用几行...

    基于Java EE-Web服务的多终端协同创新管理平台设计.pdf

    Java EE支持异构环境,不依赖于任何特定的硬件、操作系统或中间件,这使得Java EE成为了构建跨平台、多终端应用的理想选择。其特点包括组件模型、Web服务支持、以及强大的API,这些都是构建可扩展、高性能应用的基础...

    超级终端 路由器配置等超级终端win10,亲测可用

    此外,随着跨平台能力的扩展,为了满足不同系统应用的需要,网络终端设备也将以众多的面孔出现:Unix终端、Windows终端、Linux终端、Web终端、Java终端等等。 3、从应用领域讲,字符哑终端和图形终端时代的终端设备...

    鸿蒙Web组件使用示例Demo

    HarmonyOS是华为推出的面向全场景的分布式操作系统,旨在提供跨平台、无缝的用户体验。ArkTS是HarmonyOS开发中的主要编程语言,它是TypeScript的方言,提供了类型安全和编译时检查,为开发者带来高效且可靠的编码...

    vue2.0+Laravel7轻量级多语言易二开跨终端商城系统.zip

    vue2.0+Laravel7轻量级多语言易二开跨终端商城系统,多门店、低代码、无代码,完全前后端分离,免费开源可商用,H5商城电商平台,微信小程序商城电商平台;支持网站、PWA、H5、微信小程序,支付宝小程序、百度小程序...

Global site tag (gtag.js) - Google Analytics