本文摘要：dva.js 是一个基于 Redux 和 Redux-Saga 构建的数据流方案，它简化了开发体验，集成了 react-router 和 fetch，并拥有如 dva-loading 等插件机制。同时，dva 提供易学易用的 API 设计和 Hot Module Replacement 功能。而 umijs 作为一款基于路由的框架，内置 React 支持并具备 Next.js 类似的高级路由功能。umijs 拥有完整的插件系统及高性能特性，支持 PWA、静态导出以及与 DVA 的深度集成，两者共同服务于各种复杂业务场景，助力前端应用高效开发与维护。

转载文章

本篇文章为转载内容。原文链接：https://blog.csdn.net/qq_32447301/article/details/93423515。

该文由互联网用户投稿提供，文中观点代表作者本人意见，并不代表本站的立场。

作为信息平台，本站仅提供文章转载服务，并不拥有其所有权，也不对文章内容的真实性、准确性和合法性承担责任。

如发现本文存在侵权、违法、违规或事实不符的情况，请及时联系我们，我们将第一时间进行核实并删除相应内容。

在这里插入图片描述
一、dvajs
开源地址：https://dvajs.com/

1.dva
dva 首先是一个基于 redux 和 redux-saga 的数据流方案，然后为了简化开发体验，dva 还额外内置了 react-router 和 fetch，所以也可以理解为一个轻量级的应用框架。

2.特性
易学易用，仅有 6 个 api，对 redux 用户尤其友好，配合 umi 使用后更是降低为 0 API
elm 概念，通过 reducers, effects 和 subscriptions 组织 model
插件机制，比如 dva-loading 可以自动处理 loading 状态，不用一遍遍地写 showLoading 和 hideLoading
支持 HMR，基于 babel-plugin-dva-hmr 实现 components、routes 和 models 的 HMR

二、umijs
开源地址：https://umijs.org/

1.umi
umi是一个基于路由的框架，支持next.js类似的传统路由和各种高级路由功能，例如路由级按需加载。凭借涵盖从源代码到构建产品的每个生命周期的完整插件系统，umi能够支持各种功能扩展和业务需求。目前，umi在社区和公司内部拥有近50多个插件。

umi是Ant Financial的基本前端框架，直接或间接地为600多个应用程序提供服务，包括Java，节点，移动应用程序，混合应用程序，纯前端资产应用程序，CMS应用程序等。umi为我们的内部用户提供了很好的服务，我们希望它能够很好地为外部用户服务。

2.功能
? 开箱即用，内置支持反应，反应路由器等。
?Next.js 喜欢和全功能的路由约定，它也支持配置的路由
? 完整的插件系统，涵盖从源代码到生产的每个生命周期
? 高性能，通过插件支持PWA，路由级代码分割等
? 支持静态导出，适应各种环境，如控制台应用程序，移动应用程序，鸡蛋，支付宝钱包等
? 快速启动启动，支持使用config 启用dll和hard-source-webpack-plugin
? 与IE9兼容，基于umi-plugin-polyfills
? 支持TypeScript，包括d.ts定义和umi test
? 与深度集成DVA，支持鸭子目录，模型的自动加载，代码分裂等

在这里插入图片描述

本篇文章为转载内容。原文链接：https://blog.csdn.net/qq_32447301/article/details/93423515。

该文由互联网用户投稿提供，文中观点代表作者本人意见，并不代表本站的立场。

作为信息平台，本站仅提供文章转载服务，并不拥有其所有权，也不对文章内容的真实性、准确性和合法性承担责任。

如发现本文存在侵权、违法、违规或事实不符的情况，请及时联系我们，我们将第一时间进行核实并删除相应内容。

名词解释

作为当前文章的名词解释，仅对当前文章有效。

Redux：Redux 是一个 JavaScript 状态容器，提供可预测化的状态管理。在 dva.js 中，Redux 被用作核心的数据流方案，帮助开发者集中管理和维护应用的所有组件状态。通过单一不可变数据源（store），Redux 提供了明确的 actions、reducers 来处理状态变化，并允许时间旅行式的调试体验，使得复杂应用的状态控制变得清晰、易于理解和调试。

Redux-Saga：Redux-Saga 是 Redux 生态系统中的一款中间件，用于处理异步逻辑。在 dva.js 框架中，Redux-Saga 与 Redux 结合使用，让开发者能够以更直观的 saga 流程来编写异步操作。Saga 监听指定的 Redux actions，并触发相应的副作用（如网络请求或调用 API），然后根据返回结果发起新的 actions 更新 store，从而实现对异步流程的集中控制和管理。

Hot Module Replacement (HMR)：Hot Module Replacement 是一种 Webpack 等模块打包工具提供的特性，它允许在开发过程中热更新修改过的模块，而无需刷新整个页面。dva.js 通过 babel-plugin-dva-hmr 实现了 components、routes 和 models 的 HMR 功能，这意味着当开发者修改代码后，浏览器会自动替换并重新加载变动的部分，极大地提高了开发效率和实时预览体验。

插件机制：插件机制是一种软件设计模式，允许通过扩展添加新功能或改变现有行为。在 dva.js 中，插件机制体现在可以通过安装额外的插件（如 dva-loading）来增强框架的功能，无需手动重复编写特定业务逻辑。而在 umijs 中，完整的插件系统涵盖了从源码到生产的每个生命周期，开发者可以根据需求定制和安装各种插件，比如自动处理 loading 状态、支持 PWA、路由级按需加载等。

路由级按需加载：路由级按需加载是现代前端框架的一项性能优化技术，它允许应用程序仅在用户访问特定路由时动态加载对应的组件和资源。umijs 支持这种高级路由功能，意味着只有当用户导航到特定页面时，才会加载该页面所需的代码，有效减少了首屏加载时间和总体资源体积，提升了用户体验和应用性能。