Start Coding

JSON5: JSON for Humans

JSON5 is an extension of JSON (JavaScript Object Notation) that aims to make it easier for humans to write and maintain. It adds several features to improve readability and reduce errors, while remaining a strict subset of JavaScript.

Key Features of JSON5

  • Comments: Single-line (//) and multi-line (/* */) comments are supported
  • Trailing commas: Allowed in objects and arrays
  • Unquoted object keys: If they're valid identifiers
  • Single and multi-line strings: Using single quotes or backticks
  • Hexadecimal numbers: Starting with 0x
  • Infinity and NaN: As valid number values
  • Plus sign in numbers: Allowed for positive numbers

JSON5 Syntax Examples

1. Comments and Trailing Commas

{
    // This is a single-line comment
    "name": "John Doe",
    "age": 30,
    "hobbies": [
        "reading",
        "cycling",
        "photography", // Trailing comma is allowed
    ],
    /* This is a
       multi-line comment */
}

2. Unquoted Keys and Various Number Formats

{
    unquoted: 'and you can quote me on that',
    singleQuotes: 'I can use "double quotes" here',
    lineBreaks: "Look, Mom! \
No \\n's!",
    hexadecimal: 0xdecaf,
    leadingDecimalPoint: .8675309,
    andTrailing: 8675309.,
    positiveSign: +1,
    trailingComma: 'in objects, too',
    "backwardsCompatible": "with JSON",
}

Benefits of Using JSON5

JSON5 offers several advantages over standard JSON syntax:

  1. Improved readability: Comments and flexible formatting make the data structure easier to understand.
  2. Reduced errors: Trailing commas and relaxed syntax rules help prevent common mistakes.
  3. Easier maintenance: The ability to add comments aids in documenting complex data structures.
  4. Compatibility: JSON5 is a superset of JSON, so valid JSON is also valid JSON5.

Using JSON5 in Your Projects

To use JSON5 in your projects, you'll need to use a JSON5 parser instead of a standard JSON parser. Here's an example using the official JSON5 library for JavaScript:

import JSON5 from 'json5'

const data = JSON5.parse(`{
    // comments are allowed
    unquoted: 'and you can quote me on that',
    singleQuotes: 'I can use "double quotes" here',
    lineBreaks: "Look, Mom! \
No \\n's!",
    hexadecimal: 0xdecaf,
    leadingDecimalPoint: .8675309,
    andTrailing: 8675309.,
    positiveSign: +1,
    trailingComma: 'in objects, too',
    "backwardsCompatible": "with JSON",
}`)

console.log(data)

Considerations When Using JSON5

  • Compatibility: While JSON5 is backwards-compatible with JSON, the reverse is not true. Standard JSON parsers cannot handle JSON5-specific features.
  • Performance: JSON5 parsing may be slightly slower than standard JSON parsing due to the additional features.
  • Ecosystem support: Not all tools and libraries support JSON5 out of the box, so you may need to use specific JSON5 libraries or converters.
  • Standardization: JSON5 is not an official standard like JSON, which may limit its adoption in some contexts.

Conclusion

JSON5 extends the capabilities of JSON to make it more human-friendly and easier to maintain. While it's not a replacement for standard JSON in all scenarios, it can be a valuable tool for configuration files, data storage, and other use cases where readability and maintainability are priorities. When deciding whether to use JSON5, consider your project's requirements, the tools and libraries you're using, and the potential trade-offs in terms of performance and compatibility.