GraphQL 是一种优秀的 API 查询语言，可以用于开发 Web 应用程序中的服务端和客户端。随着越来越多的公司和个人开始使用 GraphQL，Apollo 成为了一个让人感到兴奋的工具，它简化了 GraphQL 的开发和优化。本文就将介绍 Apollo，为什么我们应该使用它，以及一些如何使用 Apollo 的方法。
Apollo 是什么？
Apollo 是一个完整的 GraphQL 平台，包括客户端、服务端和工具。它的客户端是最受欢迎的 JavaScript GraphQL 客户端，同时它的服务端和工具可让你轻松地构建和管理你的 GraphQL 服务。
Apollo 的核心产品是 Apollo Client，它是一个用于构建 React 应用程序的 GraphQL 客户端。Apollo Client 的特点是使用了缓存和数据管理技术以提升性能，减少网络请求，大大简化了开发人员编写和管理 GraphQL 应用程序的流程。
为什么我们应该使用 Apollo？
以下是使用 Apollo 的几个重要的好处：
智能缓存
在传统的 REST API 架构中，客户端从服务器获取数据，每当需要一个新的数据时，它都必须向服务端发起一次请求。这样做的缺点在于：网络延迟通常会导致性能低下。
借助 Apollo 的缓存，我们可以缓存网络数据流的一部分，以便稍后再次使用。这意味着不仅可以减少需要与服务器进行的请求数量，而且可以使用户过去所请求的数据 “即时可用”。
请求控制
借助 GraphQL，我们可以仅向服务器发出我们需要的数据。我们不再必须通过使用 REST API 的方式，只能获取一组完整的数据。这可以降低所需要的带宽或者数据请求的时间。进而可以提高我们的程序的性能。
可扩展性
当程序变得越来越大时，GraphQL 通常是一个出色的选择。它具有优秀的扩展性，使开发人员可以在不破坏既定 API 体系的情况下，从服务器获取所需的数据。
使用 Apollo 的模式
查询模式
在使用 Apollo 查询模式时，我们可以直接在需要获取数据的地方进行请求。这意味着我们可以避免使用 Redux 或类似数据管理库来存储我们的数据。例如：
-- -------------------- ---- -------
------ - --------- --- - ---- -----------------
----- -------------- - ----
----- ------------- -
---------- -
--
----
-----
-
-
--
-------- --------------- -
----- - -------- ------ ---- - - -------------------------
-- --------- ------ -------------
-- ------- ------ ------- ------------------
------ -
----
----------------------- --- ----- ----- -- -- -
--- ---------
-----------------
---- ----------- --------------- --
-----
---
-----
--
-在上面的代码中，我们定义了一个用于获取角色信息的 GraphQL 查询。通过使用 useQuery 钩子，我们可以轻松地将数据提取到我们的 React 组件中。
缓存模式
当使用 Apollo 客户端时，我们可以将我们的数据存储在缓存中，以便稍后访问。例如，假设我们要使用用户评论集合进行构建评论的特殊模块。这里的数据可能是从已有的其他模块获取的。因此，我们可以将该数据存储在 Apollo 客户端缓存中，而不必重新获取它。使用缓存模式的代码如下所示：
-- -------------------- ---- -------
------ - --------- --- - ---- -----------------
----- ---------------- - ----
----- ----------------------- -------- -
---------------- -------- -
--
------
----
-
-
--
-------- ------ -
----- - -------- ------ ---- - - -------------------------- -
---------- - ------- ---- --
------------ --------------------
---
-- --------- ------ -------------
-- ------- ------ ------- ------------------
------ -
----
--------------------- --- ---- -- -- -
--- ---------
-------------
-----
---
-----
--
-在上面的代码中，我们使用 fetchPolicy: 'cache-and-network' 属性，以实现从缓存和网络同时获取数据。这种方式能带来更好的用户体验。
总结
Apollo 客户端是一个卓越的跨平台 JavaScript GraphQL 客户端，具有丰富的功能，包括数据缓存和数据管理技术。通过使用 Apollo 我们可以创建更高效和灵活的 Web 应用程序，同时还能简化我们编写和管理 GraphQL 应用程序的流程。在你的下一个 Web 项目中，为什么不试试 Apollo？
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64ad11f948841e9894938418