Um colega de backend te joga uma string JSON minificada — 5000 caracteres enfiados em uma linha, 7 níveis de aninhamento, com a ordem das chaves toda bagunçada. Como ler isso rápido? Existe uma ferramenta online de formatar JSON exatamente para isso. Este guia traz um fluxo de 4 passos e explica como usar as duas opções avançadas do formatador de JSON do Piick: Ordenar chaves e Modo tolerante.

Por que você precisa formatar JSON

JSON comprimido foi feito para ficar pequeno no tráfego, mas é um pesadelo para depuração:

  • Objetos aninhados com mais de 3 níveis são impossíveis de ler no olho
  • Encontrar um campo significa varrer dezenas de },{ na tela
  • Ao colar em um cliente de mensagem, às vezes as aspas são escapadas automaticamente

O objetivo principal da formatação: tornar legível para humanos. Indentação, alinhamento e quebras de linha deixam a estrutura óbvia de relance. O custo é um arquivo cerca de 30% maior, mas isso é para os desenvolvedores, não para a rede.

A troca: ferramentas online vs linha de comando

python -m json.tool, jq . e prettier conseguem formatar JSON, mas têm 3 problemas:

  1. Precisam de instalação e configuração — máquinas novas ou o notebook de um colega podem não ter
  2. Sobrecarga de memorização de parâmetros — a sintaxe de filtro do jq e o prettier --write são fáceis de esquecer
  3. Questões de privacidade — colar em uma ferramenta online desconhecida pode enviar seus dados para fora

Ferramentas de navegador não precisam de instalação, nem de login, e o processamento totalmente local é muito mais seguro. O formatador de JSON do Piick é 100% JavaScript no cliente — funciona até offline, e o conteúdo colado nunca sai do seu computador.

4 passos para formatar JSON com o Piick

  1. Abra o formatador de JSON do Piick — o modo de formatação é o padrão
  2. Cole o JSON comprimido na caixa de entrada à esquerda
  3. Escolha a indentação no topo — 2 espaços (padrão), 4 espaços, Tab, ou minificado
  4. Clique em “Formatar” e o lado direito mostra imediatamente o resultado com pretty-print; a área de estatísticas na parte de baixo exibe chaves, arrays, maxDepth e tamanho em bytes

O fluxo todo leva menos de 30 segundos. Não precisa recarregar a página — mudar a indentação tem efeito instantâneo.

Avançado: Ordenar chaves e Modo tolerante na prática

Ordenar chaves: quando ativado, todas as chaves dos objetos são organizadas em ordem alfabética recursivamente. Dois usos:

  • Diff amigável: fontes diferentes dos mesmos dados com ordens de campo diferentes geram diffs enormes com falsos positivos — ordene antes e só as diferenças reais ficam visíveis
  • Especificação unificada: quando o time concorda com a ordem das chaves, os diffs do JSON ordenado permanecem limpos

Note que objetos dentro de arrays não são reembaralhados — arrays são ordenados, e embaralhá-los quebraria a semântica.

Modo tolerante: lida com JSON “menos estrito” (rascunhos com comentários, vírgulas finais, aspas simples). Quando ativado, a ferramenta remove automaticamente comentários // e blocos /* */, converte aspas simples em aspas duplas e elimina vírgulas finais extras antes de formatar como JSON padrão. Isso é uma mão na roda para dados de mock e arquivos de configuração no frontend.

Recomendação prática: ative Ordenar chaves primeiro, salve o resultado como um arquivo JSON padrão e coloque no controle de versão. Reserve o modo tolerante para lidar com rascunhos sob demanda.

Se você lida com JSONs grandes vindos de APIs (acima de 1 MB), vale também rodar o resultado final por um minificador antes de enviar para produção — a formatação bonita que você usa no dia a dia não é o que vai trafegar pela rede. Mantenha duas versões: uma formatada para humanos no repositório e outra minificada servida pelo build.

Abra agora o formatador de JSON do Piick, cole uma linha de JSON minificado e veja o resultado em 30 segundos.