GraphQL Query Formatter
Beautify messy GraphQL operations or compress them into single-line minified payloads for URL queries and Apollo Client caching.
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.