Apollo Client's transport-level query batching feature can significantly reduce network overhead in React apps that fire multiple GraphQL queries simultaneously. When multiple components mount and each triggers its own query, browsers hit their concurrent connection limit (6 for Chrome), causing requests to stall. Enabling BatchingNetworkInterface makes Apollo wait up to 10ms to collect all queries and send them as a single batched request, eliminating stalled connections. An additional query deduplication option further reduces payload size by removing duplicate queries from the batch. Both features are enabled with minimal code changes and are supported natively by Apollo Server.
Table of contents
The Example AppMeasuring Performance using Chrome DevToolsEnabling Apollo Query BatchingUnder the hoodQuery deduplication1 Impression