Vue.js快速入门 - (EPUB全文下载)

文件大小：0.13 mb。
文件格式：epub 格式。
书籍内容：

Vue.js快速入门
第1章　Vue.js概述
第2章　原生的Vue.js
第3章　Webpack+Vue.js开发准备
第4章　Webpack+Vue.js实战
第5章　运维和发布Vue.js项目
第6章　进阶知识
第7章　实战周边及相关工具
第8章　实战项目
第1章　Vue.js概述
1.1　单页应用的出现
随着移动电话的普及和微信的流行，很多的Wap（H5）应用也随之出现了，如微店、微站各个App中包含的H5页面。
手机的硬件特点有：
硬件设备差。同主频的手机CPU性能往往是台式机的十分之一（手机的供电与台式机设备相差很远）。
网络速度慢。4G网络在很多时候下载速度只有几百KB，打开一个微信中的网页可能也要很久。
因此，使用传统的Webpack技术开发的网页，在手机端的表现往往特别差。传统技术的特点是：
单击某个链接/按钮，或者提交表单后，Webpack页面整体刷新。
js/css的请求往往很多，过百是很常见的事情。
每次页面整体刷新，都要导致浏览器重新加载对应的内容，特别“卡顿”。另外，加载的内容也很多。很多传统页面的css/js多达上百个，每次打开页面都需要发送上百次请求。如果页面中包含websocket等内容，打开速度就会更慢。
苹果的机器表现还好，iOS设备打开Web页面速度很快，Android设备则大部分都很慢。这个是由手机设备操作系统、软件及智能硬件决定的。
单页应用（Single Page App，SPA）体现出了其强大的优势。
页面是局部刷新的，响应速度快，不需要每次加载所有的js/css。
前后端分离，前端（手机端）不受（服务器端的）开发语言的限制。
越来越多的App采用SPA的架构。如果你的项目要用在H5上，那么一定要使用单页应用框架，如Angular、React、Vue.js都是很好的框架。
我们在公司实际项目中，都使用Vue.js，效果非常好。开发速度快，维护效率高。
因为本文与官方文档不同，是根据实际项目经验，以培养新人的角度来写的，所以会有以下特点。
很少使用的技术略过。
只讲解常见的知识。
在章节上按照入门的难易度程度从简单到复杂。
1.2　为什么要使用Vue.js
在本章中，我们会从多个角度思考这个问题。
1.2.1　单页应用
Web的应用分两类：传统Web页面应用和单页应用（Single Page App）。
1. 传统Web页面
传统Web页面就是打开浏览器，整个页面都会打开的应用。例如，笔者的个人网站http://siwei.me就是一个典型的“传统Web应用”，每次单击其中任意一个链接，都会引起页面的整个刷新，如图1-1所示。
图1-1　个人网站
从图1-1中可以看出，传统的页面每次打开，都要把页面中的.js、.css、图片文件、html文件等资源加载一遍。在图1-1的左下角可以看到，本次共加载了10个请求（4个css，2个js，3个png图片及1个html文件），耗时0.837s。这个在PC端可以，但是在手机端就会特别慢，特别是在安卓手机上。
传统页面的特点就是下面任何一个操作，都会引起浏览器对于整个页面的刷新：
单击链接。
提交表单。
触发location.href='...'这样的js代码。
我们来看一个传统Web页面的例子。

你好！ 传统Web页面！

每个浏览器都会从第一行解析到最后一行，然后继续加载my.js、my.css、my.jpg这三个外部资源。
其实很好理解，这个就是大家最初想象的Web页面的打开方式。
2. 单页应用（Single Page App）
单页应用，确切的诞生时间不详，可以肯定的是这个概念2003年就在论坛上被人讨论了。在2002年4月，诞生了一个网站：http://slashdotslash.com，就使用了这种思想。
单页应用的精髓是点/单击任何链接，都不会引起页面的整体刷新，只会通过JavaScript替换页面的局部内容。
3. Ajax和XML
说到这里，就不得不提到另一个概念：Ajax（Asynchronous JavaScript），中文可以称之为“js的异步请求”，国内统一称为Ajax。
Ajax的概念是每次打开新的网页时，不要让页面整体刷新，而是由js发起一个“HTTP异步请求”，这个“异步请求”的特点就是不让当前的网页“卡”死。
用户可以一边上下滚动页面，播放视频一边等待这个请求返回数据。结果被正常返回后，由js控制刷新页面的局部内容。
这样做的好处是：
（1）大大节省了页面的整体加载时间。各种.js、.css等资源文件加载一次就够了。
（2）节省了带宽。
（3）同时减轻了客户端和服务端的负担。
在智能手机和App应用（特别是微信）流行起来之后，大量的网页都需要在手机端打开，Ajax的优势就体现的淋漓尽致。
虽然Ajax的名称本意是“异步js与XML”，但是现在在服务器端返回的数据中几乎都使用JSON，而抛弃了XML。
在2005年，国内的程序员论坛开始提及Web 2.0，其中Ajax技术被人重视。到了2006年初，可以说Ajax是前端程序员的加薪利器。市面上的所有招聘“前端Web程序员”的职位描述中都认为Ajax是重要的加分项。
可惜当时jQuery在国内不是很普及，Prototype也没有流行起来。笔者与北京软件圈子里的各大公司的同行们交流时，发现大家用的都是“原生的JavaScript Ajax”，这种不借助任何第三方框架的代码写起来非常臃肿、累人，而且考虑到浏览器的兼容问题，开发起来也很让人头疼。
例如，当时的代码往往是这样的：
上面的代码仅仅是为了兼容各种浏览器。实际上，后面还有几十行的冗余代码，之后才是正常 ............

以上为书籍内容预览，如需阅读全文内容请下载EPUB源文件，祝您阅读愉快。