VueJS 概述

  VueJS是一个用于开发交互式web项目的开源的渐进JavaScript框架。它是用来简化web开发的框架之一。VueJS聚焦在视图层上。它可以轻松地集成到前端开发的大型项目中，而不会出现任何问题。

  VueJS的安装非常容易。任何开发人员都可以在短时间内轻松理解和构建交互式web页面。VueJS是由来自谷歌的前雇员EvanYou创建的。VueJS的第一个版本于2014年2月发布。它最近在github上拥有64，828颗星，因此非常受欢迎。

Vue的特征

  VueJS有如下特征能。

虚拟Dom

  VueJS使用虚拟DOM，不会对DOM进行更改，而是创建以JavaScript数据结构形式存在的DOM副本。每当要进行更改时，都会对JavaScript数据结构进行更改，并将后者与原始数据结构进行比较。最后的更改将被更新为真实的DOM，用户将看到这些更改。这在优化方面是好的，它的开销更小且可以更快地进行改变。

数据绑定

  数据绑定功能有助于操作HTML属性或为其分配值、更改样式、借助VueJS提供的名为v-bind的绑定指令分配。

组件

  组件是创建自定义元素的重要功能之一，这些元素可以在HTML中重用。

事件处理

  v-on是添加到DOM元素的属性，用于侦听VueJS中的事件。

动画/变换

  VueJS提供了在HTML元素被添加/更新或删除时应用转换的各种方法。VueJS有一个内置的转换组件，需要围绕元素进行包装以实现转换效果。我们可以轻松地添加第三方动画库，并为页面添加更多的交互性。

计算性质

  这是VueJS的重要特性之一。它有助于侦听对UI元素所做的更改并执行必要的计算。因此不需要额外的编码。

模板

  VueJS提供了基于HTML的模板，这些模板将DOM与Vue实例数据绑定在一起。vue将模板编译为虚拟DOM渲染函数。我们可以使用渲染函数的模板，为此我们必须用渲染函数替换模板。

指令

  VueJS具有内置指令，例如v-if, v-else, v-show, v-on, v-bind和 v-model,这些指令常用于在前端执行各种操作。

观察者

  观察器应用于监控更改的数据。例如输入元素。在这里，我们不需要添加任何附加事件。监视程序负责处理任何数据更改，使代码简单而快速。

路由选择

  在vue-router的帮助下进行页面之间的导航。

轻量级

  VueJS脚本非常轻量级，性能也非常快。

虚拟仪器

  可以使用vue-CLI命令行界面在命令行上安装VueJS。它有助于使用vue -CLI轻松构建和编译项目。

跟其他框架的比较

  现在让我们比较一下VueJS跟其他框架(如React, Angular, Ember, Knockout, Polymer)。

VueJS vs React

Virtual DOM

  虚拟DOM是DOM树的虚拟表示。对于虚拟DOM，将创建一个与真实DOM相同的JavaScript对象。每当需要对DOM进行更改时，都会创建一个新的JavaScript对象并进行更改。稍后，将比较两个JavaScript对象，并在实际DOM中更新最终的更改。

  VueJS和React都支持虚拟DOM，并且都处理的很好。

Template vs JSX

  VueJS分别使用html、js和CSS。初学者很容易理解和采用VueJS风格。基于模板的VueJS方法非常简单。

  React使用jsx方法,ReactJS的所有内容(js,html,css)都是JavaScript的一部分。

安装工具

  React使用create react app命令，VueJS使用 vue-cli /CDN/npm，两者都非常容易使用。react需要webpack来构建，而VueJS则不需要。我们可以直接从cdn库中引用VueJS库开始编码。

流行度

  React比VueJS流行一些. React的工作机会比VueJS多。React背后有一个大公司支持，即Facebook，这使它更受欢迎。因为，React使用了JavaScript的核心概念，所以它使用了JavaScript的最佳实践。与React一起工作的人肯定对所有的JavaScript概念都很好。

  VueJS是一个开发框架。目前，与VueJS相比，VueJS的工作机会相对较少。但是Vue正在慢慢的流行起来，越来越多的公司在项目中使用它，也许这也是你看到这套教程的原因：）。Vue有一个很好的社区在研究VueJS的不同特性。vue-router由该社区维护，并定期更新。

   VueJS由于其足够轻量，所以与 、React/Angular相比它要快得多。

VueJS vs Angular

相似程度

  VueJS与Angular有很多相似之处。指令如v-if、v-for几乎与Angular的ngIf、ngFor相似。它们都有一个用于项目安装和构建的命令行界面。VueJS使用的是Vue-CLI，而angle使用的是Angular-CLI。两者都提供双向数据绑定、服务器端呈现等。

复杂性

  Vuejs非常容易学习和开始。对于Angular，我们需要经过一系列的安装步骤，初学者学习使用Angular需要一些门槛。它使用TypeScript进行编码，这对于只有JavaScript经验的人来说有点困难。然而，对于具有Java和c#背景的用户来说，更容易学习。

性能

  性能如何，取决于用户。VueJS文件的大小比Angular文件轻得多。这个链接提供了框架性能的比较，http://stefankrause.net/js-frameworks-benchmark4/webdriver-ts/table.html

流行性

  Angular比VueJS更受欢迎。许多组织使用Angular。就业机会也更多。然而，VueJS在市场中占据了一席之地，可以被认为是一个很好的Angular和React的竞争对手。

依赖关系

  Angular提供了许多内置功能。我们必须导入所需的模块并开始使用它，例如@angular/animation、@angular/form。

VueJS并不具备所有内置的Angular特性，需要依赖第三方库来进行工作。

灵活性

  VueJS可以轻松地与任何其他大型项目合并，而不会出现任何问题。Angular将不会那么容易。

兼容性

  Angular目前版本很多，并且每个大版本之间有很大差异。由于核心差异，在Angular1.x中开发的项目无法转换为Angular2.x。

  VueJS的最新版本是2.0，具有良好的向后兼容性。它提供了很好的文档，很容易理解。

TypeScript支持

  Angular使用TypeScript进行编码。用户需要学习才能开始Angular的开发。但是，我们可以直接引用Vue的CDN库开始开发VueJS项目。我们可以使用JavaScript进行项目开发，这是一个优势。

VueJS vs Ember

相似程度

  Ember提供了Ember命令行工具，即Ember-CLI，以便于安装和编译Ember项目。

  VueJS也提供了命令行工具vue-CLI来启动和构建项目。

  它们都具有路由器、模板和组件等功能，使它们作为UI框架非常丰富。

性能

  与Ember相比，VueJS具有更好的性能。ember添加了一个flight渲染引擎，目的是提高重新渲染性能，这是一个类似于VueJS的概念，并使用虚拟DOM进行反应。然而，与Ember相比，VueJS具有更好的性能。

VueJS vs Knockout

  Knockout提供了良好的浏览器支持。IE的较低版本支持它，而IE8及以下版本不支持VueJS。不过随着时间的推移，老旧的浏览器已经被淘汰，低版本的困扰将不复存在。

  另一方面，VueJS已经开始受到Vue团队的欢迎，他们提供定期更新。

VueJS vs Polymer

  Polymer是由谷歌开发的。它被用于许多谷歌项目，如谷歌I/O、谷歌地球、谷歌播放器等。它提供类似于VueJS的数据绑定和计算属性。

  Polymer自定义元素定义包括纯JavaScript/CSS、元素属性、生命周期回调和JavaScript方法。相比之下，VueJS允许轻松使用JavaScript/html和CSS。

  Polymer使用web组件功能，并要求浏览器使用聚合功能，但浏览器不支持这些功能。VueJS不具有这种依赖关系，并且在IE9+的所有浏览器中都可以正常工作。