Що таке GraphQL і його переваги

GraphQL був розроблений у 2012 році компанією Facebook (так-так, тими самими хлопцями, які подарували нам React, а також години вічного дебагу).
Основною проблемою, яку намагалися вирішити, була перевантаженість даних.
При використанні традиційних REST API часто доводиться або запитувати занадто багато даних (оверфетчинг — overfetching),
або занадто мало (андерфетчинг — underfetching), що призводить до зайвих HTTP-запитів.

Уяви ситуацію: ти запитуєш список користувачів, але тобі потрібні тільки їхні імена,
а API повертає всю інформацію — адресу, пошту і фотографію їхнього кота. Це неефективно.

GraphQL є мовою запитів для API, яка дозволяє клієнтам чітко визначати, які саме дані вони хочуть отримати.
На відміну від REST, де дані структуровані навколо ресурсів і URL,
GraphQL організовує дані навколо схеми.

Офіційна дата випуску GraphQL для публічного використання — 2015 рік.
З того часу його використовують такі гіганти, як GitHub, Twitter і Airbnb.

Основні концепції GraphQL

1. Схема та типізація даних

Серце GraphQL — це схема (schema). Схема задає сувору типізацію даних, які можна запитувати. Наприклад, типи для користувача можуть виглядати так:

type User {
  id: ID!
  name: String!
  email: String
  age: Int
}

Все суворо типізовано. Якщо запит не відповідає схемі, станеться помилка. Такий підхід дозволяє уникнути неочікуваних помилок при використанні API.

2. Гнучкі запити

GraphQL дозволяє клієнту запитувати лише те, що йому потрібно. Наприклад, якщо цікавлять лише ім'я та вік користувача, запит виглядатиме так:

query {
  user(id: 1) {
    name
    age
  }
}

Відповідь від сервера буде суворо відповідати структурі запиту:

{
  "data": {
    "user": {
      "name": "Alice",
      "age": 25
    }
  }
}

3. Єдина точка доступу

У REST API у нас часто є багато URL-ендпоінтів: /users, /posts, /comments. У GraphQL все вирішується через єдину точку доступу, наприклад: /graphql.

Переваги використання GraphQL

1. Подолання оверфетчингу та недофетчингу

REST: Запит даних про користувача може повернути:

• Ім'я
• Пошту
• Адресу
• Кота...

GraphQL: Запитуємо рівно те, що потрібно:

query {
  user(id: 1) {
    name
    email
  }
}

2. Гнучкість та економія часу

GraphQL дозволяє комбінувати запити. З REST API, щоб отримати дані користувача та список його постів, потрібно зробити два запити:

GET /users/1
GET /users/1/posts

GraphQL об'єднає ці запити в один:

query {
  user(id: 1) {
    name
    posts {
      title
    }
  }
}

Економія запитів = економія часу = задоволений клієнт.

3. Схема як документація

GraphQL-схема автоматично описує API, що спрощує розробку. Використання інструментів, таких як GraphiQL або GraphQL Playground, дозволяє автоматично генерувати документацію.

4. Реалізація клієнтоцентричної архітектури

У світі REST API сервер диктує клієнту, які дані і як отримувати. У GraphQL клієнт сам вирішує, що йому потрібно. Демократія даних, правда?

Порівняння GraphQL і REST

Коли використовувати GraphQL?

• Якщо додаток потребує частого взаємодії між клієнтом і сервером.
• Якщо додаток сильно залежить від відображення даних з кількох джерел (наприклад, мікросервіси).
• Якщо клієнтам важливо самостійно визначати, які дані отримувати.

Коли GraphQL не підходить?

• Якщо ви створюєте невеликий додаток з рідкісними запитами.
• Якщо у додатка фіксовані дані та їх структура, які не змінюватимуться.

Приклад використання GraphQL у реальному додатку

Припустимо, ви створюєте інтернет-магазин. У REST API для отримання інформації про продукт та його відгуки вам потрібно кілька запитів. У GraphQL ви зробите це в один запит:

query {
  product(id: 1) {
    name
    price
    reviews {
      user {
        name
      }
      comment
    }
  }
}

Відповідь сервера:

{
  "data": {
    "product": {
      "name": "MacBook Pro",
      "price": 1500,
      "reviews": [
        {
          "user": {
            "name": "John"
          },
          "comment": "Чудовий ноутбук!"
        },
        {
          "user": {
            "name": "Alice"
          },
          "comment": "Дорого, але вартий своїх грошей."
        }
      ]
    }
  }
}

Ефективно, правда?