JSON Size Analyzer
Analyze JSON field sizes with an interactive tree. See which fields take the most space and optimize your payload.
Total Size
495 B
Fields
34
Max Depth
4
Largest Field
—
What Is JSON Size Analyzer?
JSON Size Analyzer breaks down a JSON payload field by field, showing exactly how many bytes each key and value contributes. The interactive tree lets you expand nested objects and arrays to pinpoint which parts of your data are the heaviest — similar to how a bundle analyzer works for JavaScript.
How to Use
- Paste any valid JSON into the input area
- The tree view renders instantly with size bars for each field
- Click a row to expand or collapse nested objects and arrays
- The bar width shows each field's share of the total payload size
- Use the summary panel to see total size, field count, and max depth
Features
- Accurate UTF-8 byte counting via TextEncoder
- Interactive expand/collapse tree for nested structures
- Color-coded size bars (green → red) relative to total payload
- Type badges for object, array, string, number, boolean, null
- Expand All / Collapse All controls
- Summary: total size, field count, max depth, largest field
FAQ
How is size calculated?
Each field's size is the UTF-8 byte length of its serialized JSON value (via JSON.stringify). Parent sizes include all nested children, so the root size equals the full payload size.
What does "self size" mean?
Self size is the overhead of the field itself — the key name, braces/brackets, and any primitive value — excluding the size of its children. It helps identify structural overhead vs. data weight.
Why is my JSON larger than expected?
Long key names, deeply nested structures, and repeated string values all add up. Consider shortening keys, flattening structures, or using a binary format like MessagePack for size-sensitive applications.
Is my data sent anywhere?
No. All analysis runs entirely in your browser. Nothing is transmitted to any server.