Saltar al contenido principal

Embellecer JSON

El embellecedor de JSON convierte datos JSON sin formato, minificados o desordenados en código visualmente limpio y legible para personas. Ofrece niveles de sangría personalizables (2 espacios, 4 espacios o tabulaciones), ordenación alfabética de claves para revisar de un vistazo, controles de escapes unicode y tolerancia a comentarios, y se ejecuta por completo dentro de tu navegador.

Solo local
JSON sin formato
0 B1 líneaLín. 1, Col. 1
Salida formateadasolo lectura
0 B1 línea

¿Cómo funciona Embellecer JSON?

En las arquitecturas de API modernas, los registros, las trazas de red y las cargas de los webhooks llegan como cadenas continuas de una sola línea. Leer y auditar texto minificado a mano genera una fatiga cognitiva importante y aumenta la probabilidad de pasar por alto fallos de seguridad, tokens ausentes o tipos de datos malformados.

El embellecedor de JSON de ToolsByUs restablece la jerarquía visual mediante deserialización estructurada del AST y una generación de sangría disciplinada:

  • Ordenación léxica predecible: Al activar «Sort Keys», las propiedades de los objetos quedan ordenadas alfabéticamente en todos los niveles de la jerarquía del documento. Esto estandariza la ubicación de las propiedades y hace que el barrido visual sea instantáneo durante una revisión de código o al buscar problemas.
  • Anchos de sangría configurables: Dos espacios es la convención de JavaScript, cuatro es la norma en Python y en gran parte del mundo del backend, y una tabulación dura permite que cada lector elija su propio ancho. Ninguna es más correcta que las otras; la única respuesta equivocada es mezclarlas en un mismo archivo.
  • Estilo de llaves y formato de delimitadores: Elige entre las llaves de apertura compactas tradicionales (estilo K&R, en la misma línea) y un formato expandido que maximiza la lectura vertical en arrays de colecciones profundamente anidados.
  • Escape unicode seguro: Elige si los caracteres no ASCII (como cadenas multilingües, emojis o símbolos monetarios internacionales) se conservan en UTF-8 nativo o se escapan a seguras secuencias de escape hexadecimales \uXXXX según la sección 7 del RFC 8259.
  • Eliminación de comentarios JSONC: Tolera los comentarios del desarrollador ( // y /* */ ) que suelen aparecer en archivos de configuración como tsconfig.json o los ajustes de VS Code, y los convierte en JSON estándar conforme al RFC.
  • Garantía de cómputo local: El embellecimiento ocurre 100% en el navegador. Las cargas propietarias, los tokens de API y los registros de clientes nunca cruzan la red.

El embellecedor funciona analizando el texto de entrada en un AST, recorriendo los nodos de forma recursiva con seguimiento de la profundidad, emitiendo espacios o tabulaciones según los anchos de sangría configurados, insertando saltos de línea entre los pares de objetos y los elementos de los arrays, y añadiendo las llaves de cierre correspondientes en los niveles de sangría que corresponden.

Entrada minificada sin formato

{"id":42,"title":"Log Event","active":true,"tags":["prod","payment"]}

Salida de ejemplo

{
  "active": true,
  "id": 42,
  "tags": [
    "prod",
    "payment"
  ],
  "title": "Log Event"
}

¿Qué opciones y casos límite admite Embellecer JSON?

Referencia técnica y opciones
ParámetroTipoValor predeterminadoComportamiento y casos límite
Indentación: 2 espaciosEstilo de formato2 espaciosConvención estándar web y TypeScript que minimiza el desplazamiento horizontal en árboles con anidamiento profundo.
Indentación: 4 espaciosEstilo de formato4 espaciosIndentación visual de alto contraste, favorecida en sistemas backend, Python y terminales de línea de comandos.
Indentación: TabuladorEstilo de formato\tCaracteres de tabulación hardware que permiten a cada persona desarrolladora personalizar el ancho de tabuladores en su IDE local.
Ordenar clavesNormalizacióntrueOrdena alfabéticamente todas las claves de diccionario en cada nivel de anidamiento para un escaneo visual consistente y salida reproducible.
Escapar UnicodeOpción de codificaciónfalseCodifica caracteres fuera del ASCII en secuencias hex \uXXXX para capas de transporte legado que solo admiten ASCII.
Eliminación de comentarios JSONCRecuperación de sintaxisActivoElimina comentarios de una y múltiples líneas de las entradas JSONC sin corromper literales de cadena que contengan barras.
Límite de entradaLímite de rendimiento8 MBObligatorio, no aspiracional. El formato se ejecuta en el hilo principal, por lo que un pegado mayor es rechazado con una explicación en lugar de congelar la pestaña. Por encima de 2 MB aparece una advertencia. Para documentos más grandes, usa «Comparar JSON», que trabaja en un Web Worker.

Preguntas frecuentes

¿En qué se diferencia un embellecedor de un formateador?

Aunque ambos comparten el motor de serialización central, un embellecedor prioriza la ergonomía visual, la legibilidad y la comprensión humana (como la ordenación alfabética de claves, el contraste claro y las opciones de disposición de llaves), mientras que un formateador se centra en la conformidad sintáctica estricta, la eliminación de comentarios JSONC y las convenciones de formato de la CLI.

¿Por qué ordenar alfabéticamente las claves JSON?

En JSON (RFC 8259), el orden de las claves es arbitrario. Al inspeccionar cargas complejas con decenas de claves, tenerlas ordenadas alfabéticamente permite a las personas desarrolladoras localizar campos concretos con rapidez sin buscar por todo el objeto, y evita que los commits de git muestren diffs falsos causados por un orden de serialización aleatorio de las claves.

¿Cómo gestiona el embellecedor los tabuladores frente a los espacios?

Puedes elegir 2 espacios, 4 espacios o caracteres de tabulación dura. Los espacios garantizan un renderizado idéntico en todos los editores, mientras que las tabulaciones respetan la preferencia personal de ancho de tabulación de cada ingeniero.

¿Puedo pegar JSON con comentarios en el embellecedor?

¡Sí! El embellecedor tolera los comentarios de una línea (//) y de varias líneas (/* */), los elimina limpiamente conservando la sintaxis válida del RFC 8259 en la salida, y te avisa si se eliminó algún comentario.

¿Cuándo conviene activar el escape Unicode?

Activa el escape Unicode cuando envíes cargas JSON a APIs de backend heredadas o a protocolos que solo admitan transmisión ASCII de 7 bits. Para las API HTTP modernas, se recomienda UTF-8 nativo.

¿Se suben mis datos embellecidos a algún servidor?

No. Toda la lógica de análisis y formato se ejecuta estrictamente en el runtime local de tu navegador. No se sube ni un byte, lo que garantiza el pleno cumplimiento del GDPR y de la política de seguridad interna.