前言

随着移动电话的普及，和微信的流行，很多的wap(h5)应用也随时流行了。例如：微店，微站。 以及各个app中包含的h5页面。

手机的硬件特点是：

• 硬件设备差。同主频的手机CPU性能往往是台式机的10分之一。 （手机的供电跟台式机设备差的很远）
• 网络速度慢。4G 网络在很多时候下载速度只有几百K. 可能一个微信中的网页打开要很久。

所以，使用传统的web技术开发的网页，在手机端的表现往往特别差，因为传统技术的特点是：

• 点击某个链接/按钮，或者提交表单后，web页面整体刷新。
• js/css 的请求往往很多，过百是很常见的事儿。

每次页面整体刷新，都要导致浏览器重新加载对应的内容。特别卡顿。

另外，加载的内容也很多。很多传统页面的css/js 都多达上百个，每次打开页面，需要发送上百次请求。 如果页面中包含了websocket 等内容，打开速度就更慢了。

苹果的机器表现还好，iOS的设备打开Web页面速度很快，android机则大部分都很慢。 这个是由于手机设备操作系统、软件以及智能硬件决定的。

所以，单页应用（Single page app, 简称 SPA ) 则体现出了巨大的优势：

• 页面是局部刷新的，响应速度快, 不需要每次都加载所有的js/css,
• 前后端分离，前端(手机端) 不受（服务器端的）开发语言限制。

所以越来越多的app采用了 SPA的架构。

如果你的项目要用在h5上，那么一定使用单页应用框架。

Angular, React, Vuejs都是很好的框架。

我们在我公司的实际项目中，都使用Vuejs. 效果非常好。 开发速度快，维护效率高。 招人也方便。

本文跟官方文档不同。是根据实际项目经验，以 培养新人的角度来写的，所以会有这样的特点：

• 我认为“很少使用的技术”， 略过
• 只讲解最常见的知识
• 在章节上，按照入门的难易度从简单到复杂。

学习的时候，务必要有个开发环境，看一点儿文档，就动手敲一敲代码。

否则光看是看不懂的。

本书中的所有示例源代码，都可以在 https://github.com/sg552/happy_book_vuejs 上找到。