In a previous post we have explored the concept of Links in Apollo and usage of ApolloLink.split for routing requests selectively towards one of multiple terminating links.

This utility is also useful when we want to selectively batch our operations.

The caveat with Apollo batch-link is that, the entire batch is delivered only once the slowest operation in the batch completes.

If we know ahead of time that some of our operations are expected to take longer time (We may at times be ok with that because they don't impact the user experience) then we can exclude them from batching.

The link selector predicate we pass to ApolloLink.split can look at the operation name and decide whether to route the request to BatchLink or normal HttpLink.

import {
  ApolloClient,
  InMemoryCache,
  ApolloLink,
  Operation,
  HttpLink,
} from '@apollo/client';

const httpLink = new HttpLink({
  uri: "/graphql"
  // ...Additional options
});

const batchLink = new BatchHttpLink({
    batchInterval: 250
});

const operationBatchingBlacklist = new Set<string>();
operationBatchingBlacklist.add("someExpensiveOperation");

const mediatorLink = ApolloLink.split(
  function shouldBatchRequests({ operationName }: Operation) {
    return !operationBatchingBlacklist.has(operationName);
  },
  batchLink,
  httpLink
);

export const client = new ApolloClient({
  uri: '/graphql',
  link: mediatorLink
});