后端开发教程 - Java、Spring Boot 实战 - msg200.com
前端漫游指南：JavaScript 框架
介绍
JavaScript 框架
结论
资源
介绍
时不时地，开发人员会想出一个简化 Web 应用构建的想法，于是一个新的框架就诞生了。JS 框架弥合了标准 JS 提供的功能与现代 Web 应用关注点之间的差距。
框架通常提供以下功能：
| 特征 | 定义 |
|---|---|
| 可组合 UI | 用于定义具有封装样式和功能的自定义组件的语法 |
| 路由 | 允许您定义应用程序的不同部分，以便用户无需加载页面即可导航。 |
| 状态管理 | 允许组件之间共享和同步数据的语法。 |
| 数据绑定 | 将表单控件绑定到应用程序的状态。 |
| 模板 | 混合模板和数据以呈现动态内容的语法，例如可滚动的 UI 组件列表。 |
| 测试 | 用于执行单元和集成测试的工具。 |
| 构建工具 | 一个 CLI 工具，将使用框架编写的源代码转换为适合生产的最小化 HTML/CSS/JS。 |
请注意，其中许多功能都有专用库，这些库已在本系列的前几篇文章中介绍过。框架通常会包含这些库或提供自己的实现。
JavaScript 框架
以下是一些流行和不太流行的 JavaScript 框架。
苗条
Svelte 自称是“一种构建用户界面的全新方法”。它倾向于在编译阶段完成繁重的工作，而不是在浏览器中运行时。它的使用率和受欢迎程度正在稳步增长。
模版
Stencil 由 Ionic 团队创建，他们将其描述为一个用于生成 Web 组件的编译器。Stencil 的设计目标是高性能，并基于 Web 标准构建。
Alpine JS
Alpine JS 似乎是另一个潜力股，在2020 年 JS 前端框架排行榜中排名第四。Alpine 是另一个轻量级框架，其极简语法非常吸引人。你只需要了解 14 个属性 (attribute)、6 个特性 (property) 和 2 个方法！
Ember JS
Ember JS 创建于 2011 年，因此（可能是）此列表中最古老的。它至今仍具有影响力（在2020 年 JS 发展排行榜中排名第 9），这本身就是一项成就。Ember 是一个一体化框架，提供了简介中提到的所有功能，以及一个完整的社区插件市场。
同构框架
其余框架被归类为同构，因为它们支持称为“服务器端渲染”的功能。
SSR 解释器
使用前面提到的框架构建的 Web 应用被称为客户端渲染。这意味着它们被部署为静态 HTML/JS/CSS 文件，而页面的动态内容（例如表格、时间线、图库）完全由浏览器中运行的 JavaScript 呈现，无需任何服务器端代码。
服务端渲染的Web 应用程序大部分（即使不是全部）渲染都在服务器上完成。本列表中的其余框架均支持此功能。
由于 SSR 需要服务端代码，以下框架既可以看作前端，也可以看作后端（因此称为同构）。我在另一个系列文章中对 CSR 与 SSR 进行了更深入的探讨：
奥雷莉亚
Aurelia 是另一个鲜为人知的框架，但它似乎正在获得一些关注，并自称简单、强大且不引人注目。Aurelia 在创建和自定义元素方面拥有无与伦比的可扩展性。
Next JS
元框架是构建在其他库/框架之上的框架。就 Next JS 而言，它构建于React JS之上。除了服务器端渲染之外，Next 还拥有构建工具、国际化和图像优化等功能。Next 是一个非常受欢迎的框架，正在该领域掀起波澜。
Nuxt JS
只要 React 有对应的功能，几乎可以肯定Vue JS也一定有对应的功能。与 Next 类似，Nuxt 也支持服务器端渲染、数据获取和搜索引擎优化配置。Nuxt 还提供了页面导航之间过渡和显示进度条的选项。
结论
看到这里，你可能会好奇为什么没有提到某个热门框架。这是因为它实际上位于本系列的下一站。敬请关注下周的第七站。