GraphQL state

GraphQL 状态的数据可视化

此 Chrome 扩展程序将向您的开发工具添加一个名为“GraphQL state”的面板。当您使用框架“https://github.com/babyfish-ct/graphql-state”时，它可以帮助您进行调试。

在“GraphQL state”面板中，您将看到三个标签页：“Simple states”、“Graph states”和“Evict Logs”。

1. 简单状态
框架支持类似于“反冲”的简单状态管理，该选项卡页面可以为您可视化所有简单状态。

2. 图状态
该框架支持类似于“Apollo Client”和“Relay”的图状态管理，其内置的规范化缓存用于管理所有数据和关系。此选项卡页面可以为您可视化此标准化缓存。

3. 驱逐日志

这是该框架的核心价值。

UI状态的本质是一个主要突变导致N个额外突变，UI越复杂，N越大。

该框架允许开发人员只关注主要突变，所有额外的突变将自动执行。

与 Apollo Client 和 Relay 相比，变异后，您无需更新缓存中其他受影响的数据，也无需确定哪些查询将受到影响并需要重新获取。

当框架自动执行额外的突变时，它可以选择直接修改缓存，也可以选择从缓存中逐出受影响的数据（这将导致相关查询自动重新获取）。

显然，第一个选择比第二个选择要好。该标签页列出了框架所做的第二次选择的历史记录，并告诉开发人员以下信息。

我。为什么框架做出第二选择？
二.开发者是否可以介入优化，让框架来做首选？
三.如果是这样，开发商应该做什么？