在构建现代 Web 应用程序时,前端工程师的工作离不开与后端数据的打交道。GraphQL 作为一种新兴的数据查询语言,与传统 RESTful API 相比,其良好的查询语法和高效的请求返回方式,使得前端开发者更加高效地请求数据,并灵活地处理数据。
但是,应用程序请求的数据通常是分散在不同的数据源上,不同的资源对应不同的 API,如果应用程序有多条查询需要请求,那么就会发生 N+1 问题:发起 N 次 API 请求,每个请求返回 1 个资源的数据,造成请求次数的浪费,严重降低了应用程序性能。
DataLoader 的出现正好为以上问题提供了一种解决方案。本文将介绍 DataLoader 的概念和使用,作为简化 GraphQL 开发的一个重要工具。
什么是 DataLoader
DataLoader 是一个用于批量处理数据加载和缓存的 JavaScript 库,尤其适用于处理分散在不同数据源上、分别必须查询的数据。它通过批量查询一组唯一 ID 的方式,将应用程序中重复的数据请求合并为单一请求,并在查询结果中正确地将数据分配给匹配的请求。
DataLoader 支持解析请求的参数,以及处理并发请求,有效地缓存请求结果并避免重复数据获取。在复杂应用程序中,它可以有效地处理请求合并的问题,避免了过分依赖后端数据接口进行查询的开销。
如何使用 DataLoader 处理 N+1 问题
下面我们将通过一个实际的示例来演示 DataLoader 如何帮助我们处理 N+1 问题,画面中有一些用户名,我们需要对每个用户查询其评论数量,然后将这些数据渲染到页面中。
步骤一:构造 GraphQL 查询
我们首先需要构造 GraphQL 查询并针对其加载器进行配置,GraphQL 查询通常看起来像这样:
----- - ----- - -- ---- ------------- - -
commentsCount 是由 GraphQL 解析器计算生成的,例如:
- ----- - ------------- ------ -- -------- - ------ ---------------------------------------------------- -- ---------------- - - -
其中,getCommentsForUser 是数据库访问函数,用于返回有关给定用户的评论数据。
步骤二:实例化 DataLoader
接下来,我们需要实例化 DataLoader,以便可以对我们的数据进行批量处理:
----- ---------------------- - ----- --------- -- - -- ----------------- ----- -------------- - ----- ---------------------------------- -- ------------------------- ----- -------------------- - -- ------------------------- ------- ----- -- -- - ---------------------------- - ----- -- -- -------------- ------ -------------- -- ------------------------- - -- ---------------------------- ----- ----------- - --- ----------------------------------
步骤三:在 GraphQL 解析器中使用 DataLoader
最后,我们在 GraphQL 解析器中使用我们刚刚实例化的 DataLoader,以通过批量处理唯一 ID 的方式返回数据:
- ----- - ------------- ------ -- -------- - -- --------------------- ------ --------------------------------- - - -
load 方法承载传入的 id 并对其进行管理,而不是单独查询每个用户,并使用 batchGetCommentsCounts 这样的批量查询方法将用户提交的 ID 作为请求一次性完成。
通过上述步骤,我们就把如何使用 DataLoader 处理 N+1 问题的流程讲述完毕了。
总结
本文介绍了 DataLoader 的概念和使用,DataLoader 作为处理 N+1 问题的跨框架解决方案,它可以在充分了解 GraphQL 接口,并针对特定的数据源和使用场景,提高 GraphQL 应用程序的性能,并减少请求次数。
通过底层的优化处理和查询合并,DataLoader 将极大地简化GraphQL应用程序的开发,从而提高GraphQL应用程序的质量,降低开发者的开发成本,是一个值得开发者学习和应用的好东西。
来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/6649bfd1d3423812e48aac0f