SpeedDrain
Prettify · Minify · Syntax Validator

GraphQL Query Formatter

Beautify messy GraphQL operations or compress them into single-line minified payloads for URL queries and Apollo Client caching.

Indent:
Presets:
539 characters
Formatted GraphQL
query GetUserProfile($userId: ID!, $withMetrics: Boolean! = true) {
  user(id: $userId) {
    id
    username
    email
    profile {
      avatarUrl
      biography
      location
    }
    posts(first: 10, orderBy: {field: CREATED_AT, direction: DESC }) {
      totalCount
      edges {
        node {
          ...PostSummary
          metrics @include(if: $withMetrics) {
            views
            likes
            shares
          }
        }
      }
    }
  }
}

fragment PostSummary on Post {
  id
  title
  slug
  createdAt
}

GraphQL Document Architecture & Minification

Why Format GraphQL Documents?

GraphQL queries describe nested relational graphs. Without proper indentation and bracket alignment, complex queries containing inline fragments, variable definitions, and directives like @include or @skip become notoriously difficult to debug and review in pull requests.

Consistent 2-space indentation ensures clean git diffs and matches the industry standards established by Prettier and Apollo GraphQL.

Minified GraphQL for HTTP GET & CDN Caching

While GraphQL typically runs over HTTP POST, cacheable read queries can be sent over HTTP GET using query parameters (e.g., ?query=...).

Minifying strips out redundant comments and spaces, keeping URL lengths well below web server and edge CDN limits (such as Cloudflare and AWS CloudFront) while preserving full GraphQL execution semantics.