{
"users": [
{ "id": 1, "name": "Alice", "role": "admin" },
{ "id": 2, "name": "Bob", "role": "user" }
]
}
If you wanted to represent the same data in TOON, it would look like this:
users[2]{id,name,role}:
1,Alice,admin
2,Bob,user
Why is TOON Important Now?
{ "products": [ ... 300, "items" ... ] }
JSON vs TOON – Learn With Examples
1. A Simple Object
{ "name": "Alice", "age": 30, "city": "Bengaluru" }
And here’s how it works with TOON:
name: Alice
age: 30
city: Bengaluru
2. Array of Values
{ "colors": ["red", "green", "blue"] }
With TOON:
colors[3]: red,green,blue
3. Array of Objects
{
"users": [
{ "id": 1, "name": "Alice" },
{ "id": 2, "name": "Bob" }
]
}
With TOON:
users[2]{id,name}:
1,Alice
2,Bob
4. Nested Objects
{
"user": {
"id": 1,
"name": "Alice",
"profile": { "age": 30, "city": "Bengaluru" }
}
}
With TOON:
user:
id: 1
name: Alice
profile:
age: 30
city: Bengaluru
Indentation represents nesting. It’s almost YAML-like, but it’s still structured.
5. Array of Objects With Nested Fields
With JSON:
{
"teams": [
{
"name": "Team Alpha",
"members": [
{ "id": 1, "name": "Alice" },
{ "id": 2, "name": "Bob" }
]
}
]
}
With TOON:
teams[1]:
- name: Team Alpha
members[2]{id,name}:
1,Alice
2,Bob
How to Use TOON With JavaScript / TypeScript
In most cases, TOON is not meant to be handwritten. Most TOON data will be generated automatically by software, or you’ll need to encode existing data (say, JSON data) into the TOON format.
And there’s good news – TOON already has an official NPM package that you can use in your JavaScript/TypeScript project to convert your JSON data to TOON and vice versa.
Install it using the following command:
npm install @toon-format/toon # Or yarn add, pnpm install, etc
The easiest way to create TOON code is by converting JSON to TOON. You can use the encode() method from the above-mentioned NPM package:
import { encode } from "@toon-format/toon";
<br>
const data = {
users: [
{ id: 1, name: "Alice", role: "admin" },
{ id: 2, name: "Bob", role: "user" },
],
};
<br>
const toonString = encode(data);
console.log(toonString);
Output:
users[2]{id,name,role}:
1,Alice,admin
2,Bob,user
To do the reverse (TOON => JSON), you need to use the decode() method:
import { decode } from "@toon-format/toon";
<br>
const toonString = `
users[2]{id,name,role}:
1,Alice,admin
2,Bob,user
`;
<br>
const jsonObject = decode(toonString);
console.log(jsonObject);
Output:
{
"users": [
{ "id": 1, "name": "Alice", "role": "admin" },
{ "id": 2, "name": "Bob", "role": "user" }
]
}
TOON has already been explored for:
Just as JSON has been a standard for the Web’s data exchange, TOON may soon be standardized for AI data interchange. So next time you craft a prompt or pass structured data to an AI model, try it in the TOON format. You may notice the model gets faster and cheaper.