Vue.js破浪
前言
在Vue.js启航一系列文章中通过英雄编辑器这一个例子出发,学会了Vue.js的基本概念,包括Vue的指令,组件间的通信,Vue-Router的使用和状态管理等,能够做出简单的单页面应用,相当的有成就感。在这新一系列文章中我们将会接触到更深入的主题,例如单文件组件,渲染机制,服务端渲染,单元测试等。
主题
单文件组件
在之前我们都是直接在JS中编写组件,模板数据都是一起编写的。这样写的话在规模较小的情况下确实是一个很快捷的开发模式然而一旦应用的规模增大的话,就会面临一些问题,例如模板里的html失去的自动补全之后可能会出现错误;不能把CSS也进行组件化;只能使用ES5,不能通过预处理器使用ES6。所以我们将会使用单文件组件来构建我们的应用来获得更好的编码体验和开发效率。
渲染机制
我们知道Vue是吸收了React的经验引进的虚拟DOM,那什么是虚拟DOM呢,虚拟DOM是如何渲染的呢?React中可以使用JSX来编写页面,那Vue有没有相似的手段呢?Vue其实也是可以使用Render函数来使JS获得更强大的视图编程能力。关于虚拟DOM可以阅读虚拟DOM内部是如何工作的
服务端渲染
单页面应用有一个问题就是SEO(搜索引擎优化)。因为单页面应用是大规模使用异步传输数据(Ajax)的,然而一般的搜索引擎不会等待异步传输的完成就直接跳到下一页面,这样的话一些希望曝光给搜索引擎的页面得不到曝光。服务端渲染能够有效的解决这个问题。所谓的服务端渲染就是将组件直接在服务器上渲染为html,服务器只返回html。这样搜索引擎就能够爬取到相关的数据。
总结
上面列出了这系列文章会涉及的主题,之后可能会更新更多的主题。通过这系列文章对Vue会有更深刻的理解,使用起来会更加得心应手。