JavaScript 许多异步 HTTP 调用的事件处理性能
JavaScript event handling performance with many asynchronous HTTP calls
TL,DR;
完整的故事可以概括为以下问题：
- 如何在网页中进行大量动态异步 HTTP 调用时保持良好的性能？
- GraphQL 或 WebWorker 是好方法吗？
全文
我有一个 SPA CMS 项目，其中的动态数据来自多个不同的来源。因此，要显示包含大量数据的 table，页面需要生成大量 HTTP 调用。
我尝试过的是使所有 HTTP 调用异步，一旦其中一个 HTTP 调用 returns，table 中的相应单元格将相应更新。而且我确信 none 的 HTTP 调用是由于错误或粗心而以同步方式进行的。
但是，仍然存在性能问题。当大量HTTP调用在短时间内解析时，页面渲染就成了问题。一旦用户尝试执行交互，例如鼠标滚动等，在两个用户输入事件之间，有很多已解析的 HTTP 调用事件。虽然每次重新渲染回调不会花费太多时间，但如果将所有小时间片加起来，它们仍然会导致性能问题。
我目前正在考虑两种可能的解决方案：
- 在网关服务中实施 GraphQL，以减少查询总数，或者
- 实施 WebWorker 以批量解析 HTTP 调用，从而减少主线程中渲染回调的数量。
GraphQL 解决方案需要大量返工，这是我试图避免的。但是我对 WebWorker 没有太多经验，它会按预期工作吗？还有其他解决方案吗？
顺便说一句，为了渲染 table，我使用了 Element UI table 组件。而且浏览器兼容性对我来说不是问题。
尽量减少离散 HTTP 调用的数量是个好主意，因此 #1 或类似内容是您中长期应该关注的问题。
关于 #2，不过，您可能 需要 为此使用网络工作者。处理完成可能不是瓶颈，更可能是所有 DOM 的小操作导致大量回流和类似情况。因此，如果您将它们批量化并一次应用一批，您应该能够显着减少这些更改的影响，而无需使用 web worker 来完成。
TL,DR;
完整的故事可以概括为以下问题：
- 如何在网页中进行大量动态异步 HTTP 调用时保持良好的性能？
- GraphQL 或 WebWorker 是好方法吗？
全文
我有一个 SPA CMS 项目，其中的动态数据来自多个不同的来源。因此，要显示包含大量数据的 table，页面需要生成大量 HTTP 调用。
我尝试过的是使所有 HTTP 调用异步，一旦其中一个 HTTP 调用 returns，table 中的相应单元格将相应更新。而且我确信 none 的 HTTP 调用是由于错误或粗心而以同步方式进行的。
但是，仍然存在性能问题。当大量HTTP调用在短时间内解析时，页面渲染就成了问题。一旦用户尝试执行交互，例如鼠标滚动等，在两个用户输入事件之间，有很多已解析的 HTTP 调用事件。虽然每次重新渲染回调不会花费太多时间，但如果将所有小时间片加起来，它们仍然会导致性能问题。
我目前正在考虑两种可能的解决方案：
- 在网关服务中实施 GraphQL，以减少查询总数，或者
- 实施 WebWorker 以批量解析 HTTP 调用，从而减少主线程中渲染回调的数量。
GraphQL 解决方案需要大量返工，这是我试图避免的。但是我对 WebWorker 没有太多经验，它会按预期工作吗？还有其他解决方案吗？
顺便说一句，为了渲染 table，我使用了 Element UI table 组件。而且浏览器兼容性对我来说不是问题。
尽量减少离散 HTTP 调用的数量是个好主意，因此 #1 或类似内容是您中长期应该关注的问题。
关于 #2，不过，您可能 需要 为此使用网络工作者。处理完成可能不是瓶颈，更可能是所有 DOM 的小操作导致大量回流和类似情况。因此，如果您将它们批量化并一次应用一批，您应该能够显着减少这些更改的影响，而无需使用 web worker 来完成。