原文地址:https://medium.com/unicorn-supplies/angular-vs-react-vs-vue-a-2017-comparison-c5c52d620176
作者:Jens Neuhaus
Web 三剑客:Angular、React、Vue
一些历史:
Angular:源自 Google,是基于 TypeScript 的 Javascript 框架。被描述为:“超级厉害的 JavaScript MVW 框架”(Model- View-Whatever,MVW…..咦有点萌)
一段 create-react-app 的 TypeScript 代码:
// src/components/Hello.tsx
import * as React from 'react';
export interface Props {
name: string; // That's TYPE!
enthusiasmLevel?: number;
}
function Hello({ name,enthusiasmLevel = 1 }: Props) {
if (enthusiasmLevel <= 0) {
throw new Error('You could be a little more enthusiastic. :D');
}
return (
<div className="hello">
<div className="greeting">
Hello {name + getExclamationMarks(enthusiasmLevel)}
</div>
</div>
);
}
export default Hello;
// helpers
function getExclamationMarks(numChars: number) {
return Array(numChars + 1).join('!');
}
React:被描述为 “用于构建用户界面的 JavaScript 库”,由 Facebook 进行开发和维护。
Facebook 目前正在开发 React Fiber。它会改变 React 的底层算法,渲染速度应该会更快。
Vue: Vue 将自己描述为一款“用于构建直观,快速和组件化交互式界面的 MVVM (Model–view–viewmodel,MVVM 模式将 MVP 的 Presenter 改名为 viewmodel,基本上与 MVP 模式完全一致。) 框架”。
Comparision
组件
React 和 Vue 都擅长处理组件,组件其实即是函数,接收参数输入并返回元素作为输出。
详细说明:一个组件(本质就是一个函数)得到一个输入(函数参数),并且进行一些内部的行为/计算之后,返回一个渲染的 UI 模板作为输出。定义的组件应该易于在网页或其他组件中重用(组件的一个目的就是为了复用)。
Typescript,ES6 与 ES5
React 使用 Javascript ES6。
Vue 使用 Javascript ES5 或 ES6。
Angular 则依赖于 TypeScript。(尽管 TypeScript 在不断发展,但与整个 JavaScript 语言相比,TypeScript 的用户群仍然很小。一个风险可能是你正在向错误的方向发展…..)