React Redux 数据获取:在同构应用程序中区分浏览器/服务器端方法?
React Redux data-fetching : differentiate browser / server-side method in isomorphic app?
我遇到的大多数示例似乎总是从 URL 获取数据。
但是在服务器端,直接从数据库中获取数据没有意义吗?
所以在动作创建者中它看起来像:
if(typeof document !== 'undefined')
fetch("url/posts").then(response => dispatch(receivedPosts(response))
else
db.select("posts").then(response => dispatch(receivedPosts(response))
相对于其他数据获取方法,此方法的优缺点是什么?
大多数 React/Redux 应用程序是在 API 开发和 UI 开发之间存在分离的环境中构建的。通常这些相同的 APIs 为移动应用程序和其他桌面应用程序提供支持,因此服务器端渲染无法使用您所展示的直接数据库查询。
在您的情况下,您似乎使用单个代码库构建全栈应用程序。这不一定有什么问题,但是您可能应该考虑一些事情。首先是建立应用程序的可能生命周期。为了解有关堆栈的更多信息而完成的有趣的小副项目、竞相获得 MVP 推向市场的初创公司,以及构建必须扩展大门的平台的大型企业之间存在很大差异。这些场景中的每一个都可能导致您对如何设计应用程序层有不同的考虑。一个与您的工作相关的重要问题是其他 apps/platforms 是否可能需要访问相同的数据,以及不同的团队是否最终可能会维护后端和前端。使用 node 和 mongo 可以很容易地创建 API 端点,这些端点最初为您的 React 应用程序提供服务,但稍后可以由原生 IOS 应用程序使用。您还将在应用程序的维护和增强中获得关注点分离的好处。当您拥有数据访问权限并且 UI 逻辑完全分离时,调试通常会更容易,因为您可以直接使用邮递员之类的东西调用您的 API 来确定它们是否提供了正确的数据。
在你的情况下,它似乎已经在提供来自 /posts 的 API 数据,因此你可能会获得我提到的所有这些好处,但仍然可以通过绕过 API 正如您的代码片段所建议的那样。这将减少服务器渲染中的一个故障点并且会更快一点,但你可能不会获得太多速度,如果你的 APIs 有网络问题,它们会立即显示在应用程序的客户端,因此好处不会太大。
我个人只是在 React 应用程序中进行提取调用,并以一种将后端和前端移动到两个单独的存储库的方式分离出我所有的数据 access/API 逻辑以后太痛苦了。这将使该应用程序在未来的潜在增长中处于有利位置。关注点分离的好处超过了任何轻微的性能提升。如果您遇到页面加载缓慢的问题,那么可能有很多地方需要调整,通常从数据库查询本身开始。
我遇到的大多数示例似乎总是从 URL 获取数据。
但是在服务器端,直接从数据库中获取数据没有意义吗?
所以在动作创建者中它看起来像:
if(typeof document !== 'undefined')
fetch("url/posts").then(response => dispatch(receivedPosts(response))
else
db.select("posts").then(response => dispatch(receivedPosts(response))
相对于其他数据获取方法,此方法的优缺点是什么?
大多数 React/Redux 应用程序是在 API 开发和 UI 开发之间存在分离的环境中构建的。通常这些相同的 APIs 为移动应用程序和其他桌面应用程序提供支持,因此服务器端渲染无法使用您所展示的直接数据库查询。
在您的情况下,您似乎使用单个代码库构建全栈应用程序。这不一定有什么问题,但是您可能应该考虑一些事情。首先是建立应用程序的可能生命周期。为了解有关堆栈的更多信息而完成的有趣的小副项目、竞相获得 MVP 推向市场的初创公司,以及构建必须扩展大门的平台的大型企业之间存在很大差异。这些场景中的每一个都可能导致您对如何设计应用程序层有不同的考虑。一个与您的工作相关的重要问题是其他 apps/platforms 是否可能需要访问相同的数据,以及不同的团队是否最终可能会维护后端和前端。使用 node 和 mongo 可以很容易地创建 API 端点,这些端点最初为您的 React 应用程序提供服务,但稍后可以由原生 IOS 应用程序使用。您还将在应用程序的维护和增强中获得关注点分离的好处。当您拥有数据访问权限并且 UI 逻辑完全分离时,调试通常会更容易,因为您可以直接使用邮递员之类的东西调用您的 API 来确定它们是否提供了正确的数据。
在你的情况下,它似乎已经在提供来自 /posts 的 API 数据,因此你可能会获得我提到的所有这些好处,但仍然可以通过绕过 API 正如您的代码片段所建议的那样。这将减少服务器渲染中的一个故障点并且会更快一点,但你可能不会获得太多速度,如果你的 APIs 有网络问题,它们会立即显示在应用程序的客户端,因此好处不会太大。
我个人只是在 React 应用程序中进行提取调用,并以一种将后端和前端移动到两个单独的存储库的方式分离出我所有的数据 access/API 逻辑以后太痛苦了。这将使该应用程序在未来的潜在增长中处于有利位置。关注点分离的好处超过了任何轻微的性能提升。如果您遇到页面加载缓慢的问题,那么可能有很多地方需要调整,通常从数据库查询本身开始。