如何理解Node.js？NPM？Yarn？Vue？React？

一、背景

对后端技术栈更熟悉，对前端技术栈不了解，希望通过前后端的技术栈进行对比，可以更直观地了解前端技术栈。

二、Node.js

Node.js 是一个基于 Chrome V8 JavaScript 引擎的 JavaScript 运行环境。它使得 JavaScript 可以在服务器端运行，而不仅仅是在浏览器中。

Node.js 可以类比为 Java 的 JRE（Java Runtime Environment），但它们有一些关键的区别和相似之处。

1、相同

（1）运行环境

Node.js：是一个 JavaScript 运行环境，允许你在服务器端运行 JavaScript 代码。
JRE：是一个 Java 运行环境，允许你运行 Java 应用程序。

（2）包含的组件

Node.js：包含了 V8 JavaScript 引擎（用于解析和执行 JavaScript 代码）、内置的库（如 http、fs 等）和一些核心模块。
JRE：包含了 Java 虚拟机（JVM，用于解析和执行 Java 字节码）、核心类库（如 java.lang、java.util 等）和一些其他组件。

（3）跨平台

Node.js：可以在多个操作系统上运行，包括 Windows、macOS 和 Linux。
JRE：同样可以在多个操作系统上运行，包括 Windows、macOS 和 Linux。

2、区别

（1）语言

Node.js：运行 JavaScript 代码。
JRE：运行 Java 代码。

（2）用途

Node.js：最初设计用于服务器端编程，特别适合 I/O 密集型应用，如 Web 服务器、实时应用和 API 服务。
JRE：用于运行各种 Java 应用程序，包括桌面应用、服务器端应用和嵌入式系统。

（3）生态系统

Node.js：依赖于 npm（Node Package Manager）或Yarn来管理和安装第三方库和模块。
JRE：依赖于 Maven、Gradle 等工具来管理和安装第三方库和模块。

（4）执行模型

Node.js：采用单线程、事件驱动的非阻塞 I/O 模型，适合处理大量并发请求。
JRE：多线程模型，适合 CPU 密集型任务和复杂的并发控制。

三、NPM和Yarn

npm和Yarn都是Node.js的包管理器，类似于Maven和Gradle都是JRE的包管理器。

1、NPM

npm（Node Package Manager）是 Node.js 的默认包管理器。它允许开发者安装、共享和管理 JavaScript 代码包（即模块）。

（1）包管理

npm 提供了一个巨大的开源包生态系统，开发者可以轻松安装和使用他人编写的模块。

（2）版本管理

npm 允许你管理项目依赖的版本，以确保项目的稳定性。

（3）脚本运行

npm 可以用来运行项目中的脚本，例如构建、测试和启动项目。

2、Yarn

Yarn 是一个由 Facebook、Google、Exponent 和 Tilde 联合开发的包管理器，旨在解决 npm 的一些问题。它与 npm 类似，但提供了一些增强功能。

（1）快速

Yarn 使用并行安装，速度比 npm 更快。

（2）确定性依赖

Yarn 使用 yarn.lock 文件来确保每次安装的依赖版本一致，避免 "works on my machine" 问题。

（3）离线模式

Yarn 可以在没有网络连接的情况下安装依赖，只要它们之前已经被安装过一次。

 四、Ember、Angular、Vue、React

JavaScript 框架是为了提供更好的开发体验。它们没有给 JavaScript 带来新的功能；但它们使你可以更轻松地使用 JavaScript 来构建现代的 web。

目前公认的“四大框架”是React、Vue.js、Angular、Ember。

1、Ember

Ember 于 2011 年 12 月发布，最初作为 SproutCore 项目的延续而开始。比其新式的替代品（例如 React 和 Vue），作为老框架，它的用户人数要少得多。但因其稳定性、社区支持以及编程原则都非常良好，它仍然享有很高的知名度。

2、Angular

Angular 是一个开源 Web 应用程序框架，正式发布于 2016 年 9 月 14 日。它由构建 AngularJS 的团队完全重写，并由 Google 的 Angular 团队社区共同领导。

Angular 是一种基于组件的框架，使用声明式的 HTML 模板。在应用构建时，框架的编译器将 HTML 模板转换为优化好的 JavaScript 指令，这一过程对开发者是透明的。Angular 使用 TypeScript，它是 JavaScript 的超集。

3、Vue

Evan You（尤雨溪）在 2014 年第一次发布 Vue 。Vue 是“四大框架”中最年轻的，但在最近，它的人气迅速上升。

Vue，就像 AngularJS，用它自己的代码拓展了 HTML。除此之外，它还主要依赖于现代的、标准化的 JavaScript。

4、React

Facebook 在 2013 年发布了 React。在当时 React 已经被用于 Facebook 内部用来解决许多问题。严格来说 React 本身并不是框架，而是一个用来渲染用户界面组件的库。React 被用来组合其他用来构建应用的库——React 和 React Native 让开发者能够用 JavaScript 构建移动应用；React 和 ReactDOM 使他们能够被用来制作 web 应用程序等。

因为 React 和 ReactDOM 被经常放在一起使用，通俗地讲，React 可以被理解为是一个 JavaScript 框架。当你通读了这个模块时，我们将使用这种口语化的理解进行描述。

React 用类似 HTML 的语法的 JSX 拓展了 JavaScript。

参考：

https://developer.mozilla.org/zh-CN/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Introduction#ember