客户端重要有两种选择:一种是基于阅读器HtML5页面的，一种是Native模式的。到底是选择HTML5照样Native， Native 若何解决快速迭代问题?

1.是Native照样HTML5

当前移动端重要照样以Native实现为主，从用户体验角度来斟酌，Native的实现要比HTML5更流利，同时Native还可以基于当地做许多在阅读器里不克不及做的优化，如年夜数据的存储、可以定制的通讯协定、更便利地坚持长衔接以及更轻易实现的及时新闻推送。

当然HTML5也有无法比较的优势，好比客户端更轻量级、办事端宣布更敏捷、不须要用户进级版本等。历久来看，移动端是否会像早期PC那样从富客户端转向阅读器呢?笔者认为未必，来由如下。

起首，比拟HTMLS， Native实现机能优势更好。当前移动端都在寻求极致体验，App无疑会比HTMLS有更多的优势；其次，移动端屏幕较小，基于网页的交互和App比拟还有许多限制。最主要的是，分歧的商家会主推带有品牌标识的App照样会向同一-的阅读器挨近?从今朝的趋向看，App会是手机端上争取的重点，所以笔者推想直接基于手机端的阅读器的运用不会成为主流的前端。

2. HTML5的页面优化

HTMLS页面优化一般可以从以下几个处所人手。

第一，CSS内联异步加载。假如页面中有内容要依附CSS的加载，许多时刻就会涌现白屏一这其实就是CSS壅塞了加载，CSS出不来就导致看不到首屏。CSS内联加载可以节俭异步HTTP要求，CSS内联异步加载后可以年夜年夜缓解白屏问题。不外，就算内联今后也要不雅察异步CSS文件的年夜小，而且异步之后要不雅察domReady的时光变更。当然CSS内联也有可能会导致repaint和reflow的问题，而且因为异步内容增年夜，办事端的机能开销也会增长。

第二，其他的优化。端上的优化已经有一整套的优化办法列表了， 这里介绍一些我们在实践中发明并验证过的一些特殊的优化点，如assets 归并、整合页面中inline的JSICSS到外部文件、将iframe改为JSONP挪用、配景图归并和将非首屏内容加载改为异步等。

第三，bigpipe首屏加载。2012年的时刻，Facebook有一个比拟火的技巧叫bigpipe，可以晋升页面的首屏加载后果，于是我们测验考试过采取相似的技巧测试首屏的加载后果，

点击链接http://www.webpagetest.org/video/compare.php?tests=140318 M5_ 7GV%2C140318 Z2 7CJ&thumbSize=200&ival=100&end full，可以经由过程webpagetest看到页面的优化后果。

3. Cookie紧缩

在无线场景下要额外留意Cookie，假如没有留心，它可能会占用你一次无线要求下的年夜部门内容，并且有可能并不会让你察觉，所以有需要对Cookie进行紧缩测试。Cookie是在HTTP的头部，平日的gzip和deflate都是针对HTTP body的紧缩但并不克不及紧缩Cookie，要想对Cookie做紧缩测试必需零丁处置，紧缩方法是将Cookie的多个K/V对算作通俗的文本，进行文本紧缩。

4. URL短域名

URL短域名也很好懂得，假如无线数据传输中有年夜量的域名，而域名又比拟长，就会发生许多无谓的数据传输，最典范的运用像微博的hp://.cn，可以节俭许多字节。然则像这种直接应用真实的t.cn的短域名是比拟豪华的方法，比拟简略的是应用商定的标签调换，在解析时再调换归去。

5. CDN前置缓存

在有年夜量静态数据要求的页面中应用CDN前置缓存对网站的加快拜访异常有用。比较剖析了杭州主站和CDN上的两张图片，一张是空图片，一张是50KB年夜小的图片。空图片用于测试RTT， 50KB的图片用于测试网速。

6.若何实现端的快速迭代

前面介绍了无线场景下端的优化办法，那么当我们应用Native来实现时，碰到的一个问题是基于App的Native若何解决客户端更新和办事端的快速迭代问题，一-般有两种思绪:一种是客户端用同-一种技巧开辟，然后经由过程对象编译技巧把它编译成分歧平台，上可以或许履行的代码，如当前的React Native； 另一种思绪是将客户端中经常须要更新的模块做成动态推送的，用模板+数据的方法，在分歧的客户端平台上实现一个小的解析引擎来实现快速个性化的定制。

那么再说回来，基于前面的这些揣摸，网站扶植多终端和办事端交互重要是以数据+模板的方法为主，那么办事端供给格局化的数据将成为必定选项。所以涉及的问题就是办事端既要供给格局化的数据( HTTP JOSN数据)，又要支撑传统的PC的方法:基于JOSN数据衬着出HTML页面。我们在后面会进一步介绍若何解决无线和传统PC之间的这种差别。