graphql-dataloader

• Install the npm package as a dependency npm i graphql-dataloader --save.
• Multiple GraphQL requests are merged into one large query and sent in an event loop.

import { GraphQLDataLoader } from 'graphql-dataloader';
const loader = new GraphQLDataLoader('http://localhost:4001/graphql');

const firstQuery = `
  query firstQuery(
    $bookStoreFilter: bookStoreFilter!
    $bookCategoryFilter: bookCategoryFilter!
    $schoolFilter: schoolFilter!
  ) { 
    getBookStore(filter: $bookStoreFilter) {
      storeInfo {
        name
      }
      
      firstBook: book(filter: {id: "1"}) {
        name
      }
      
      book(filter: $bookCategoryFilter) {
        id
        name
      }
    }
    
    getSchool(filter: $schoolFilter) {
      name  
    }
  }
`;

const firstQueryVariables = {
  bookStoreFilter: {
    id: 10,
  },
  bookCategoryFilter: {
    category: 'technology',
  },
  schoolFilter: {
    id: 100,
  },
};

const secondQuery = `
  query secondQuery(
    $fetchBookStoreFilter: fetchBookStoreFilter!
    $fetchSchoolFilter: fetchSchoolFilter!
  ) {
    fetchBookStore(filter: $bookStoreFilter) {
      storeInfo {
        name
        district
        address
      }
    }
    
    fetchSchool(filter: $fetchSchoolFilter) {
      name  
    }
    
    fetchWarehouse(filter: $fetchWarehouseFilter) {
      id
      location {
        latitude
        longitude
      }
    }
  }
`;

const secondQueryVariables = {
  fetchBookStoreFilter: {
    'city': 'NY',
  },
  fetchSchoolFilter: {
    'city': 'NY',
  },
  fetchWarehouseFilter: {
    'city': 'NY',
  },
};

const thirdQuery = `
  query thirdQuery {
    SF_Warehouse: fetchWarehouse(filter: {city: "SF"}) {
      id
      address
    }
    
    LA_Warehouse: fetchWarehouse(filter: {city: "LA"}) {
      id
      address
    }
  }
`;

const thirdQueryVariables = {
};

async function request(query, variables = {}) {
  const res = await loader.request(query, variables);
  console.log(res);
}

request(firstQuery, firstQueryVariables);
request(secondQuery, secondQueryVariables);
request(thirdQuery, thirdQueryVariables);

• The compiled GraphQL query statement is:

query ($bookStoreFilter_wEJaW7: bookStoreFilter!,$bookCategoryFilter_68UmMW: bookCategoryFilter!,$schoolFilter_29jQNC: schoolFilter!, $fetchBookStoreFilter_xTNrIb: fetchBookStoreFilter!,$fetchSchoolFilter_mpHhqy: fetchSchoolFilter!, ) {
  getBookStore_U7TVvc_0: getBookStore(filter: $bookStoreFilter_wEJaW7) {
    storeInfo {
      name
    }
    firstBook: book(filter: {id: "1"}) {
      name
    }
    book(filter: $bookCategoryFilter_68UmMW) {
      id
      name
    }
  }
  getSchool_U7TVvc_0: getSchool(filter: $schoolFilter_29jQNC) {
    name
  }
  fetchBookStore_U7TVvc_1: fetchBookStore(filter: $bookStoreFilter) {
    storeInfo {
      name
      district
      address
    }
  }
  fetchSchool_U7TVvc_1: fetchSchool(filter: $fetchSchoolFilter_mpHhqy) {
    name
  }
  fetchWarehouse_U7TVvc_1: fetchWarehouse(filter: $fetchWarehouseFilter_pThtEr) {
    id
    location {
      latitude
      longitude
    }
  }
  fetchWarehouse_U7TVvc_2_U7TVvc_SF_Warehouse: fetchWarehouse(filter: {city: "SF"}) {
    id
    address
  }
  fetchWarehouse_U7TVvc_2_U7TVvc_LA_Warehouse: fetchWarehouse(filter: {city: "LA"}) {
    id
    address
  }
}

• These variables are:

{
  bookStoreFilter_wEJaW7: { id: 10 },
  bookCategoryFilter_68UmMW: { category: 'technology' },
  schoolFilter_29jQNC: { id: 100 },
  fetchBookStoreFilter_xTNrIb: { city: 'NY' },
  fetchSchoolFilter_mpHhqy: { city: 'NY' },
  fetchWarehouseFilter_pThtEr: { city: 'NY' }
}