@increments/graphql-client

A lightweight GraphQL client which bundles sequence of queries into a single HTTP request.

Installation

If your project is using npm, you can install @increments/graphql-client package by npm command:

npm install --save @increments/graphql-client
# or
yarn add @increments/graphql-client

Distribution files

• dist/graphql-client.js - ES5 / IIFE version of this package. This version exports itself to window.GraphQLClient.
• dist/graphql-client.min.js - Minified version.

Size

Package	min.js.gz size
@increments/graphql-client	800 B
apollo-client (apollo-client-preset + graphql-tag + graphql)	29 KB

Synopsis

import { GraphQLClient } from "@increments/graphql-client"

const client = new GraphQLClient({
  /** How long the client wait before invoking batch request in msec. */
  wait: 50, // defualt value

  /**
   * Batch request handler.
   *
   * @param {string} query - Bundled GraphQL query string.
   * @param {Object} variables - Bundled variables.
   * @param {Function} resolve - Callback for successful response.
   * @param {Function} reject - Callback for failure response.
   */
  handle(query, variables, resolve, reject) {
    // Send a HTTP request to your GraphQL server in your favorite way.

    // Sample:
    axios.post("/graphql", { query, variables })
      .then(response => resolve(response.data)
      .catch(reject)
  }
})

// The handle function will be executed once, even though client.query is called twice.
Promise.all([
  client.query("viewer { name }"),
  client.query(`
    repository(owner: $owner, name: $name) {
      url
    }`,
    {
      owner: {
        type: "String!",
        value: "increments",
      },
      name: {
        type: "String!",
        value: "graphql-client",
      },
    }
  ),
]).then((
  viewer,
  repository,
) => {
  console.log(viewer.data.viewer.name)
  console.log(repository.data.repository.url)
})