JSON Tools 在线 JSON 工具集

What it is / 项目是什么

The fast, private JSON toolkit developers actually use — formatter, validator, viewer, and converters. Everything runs in your browser; nothing leaves your device.

给开发者用的 JSON 工具集：格式化、校验、可视化、互转。所有处理都在浏览器里完成，数据不离开你的设备。

How it works / 实现原理

所有功能在浏览器内运行，不上传任何 JSON 内容到服务器。格式化和校验使用原生 JSON.parse + 自定义错误位置标注，能精确指出语法错误所在的行列。可视化部分用懒加载渲染，几 MB 的 JSON 也能流畅展开；互转目前支持 JSON ↔ YAML / CSV / TypeScript 类型 / Markdown 表格，常用方向都做了优化。

Who it is for / 适合谁

需要日常处理 JSON 的前后端工程师、QA 和数据相关角色。

Typical use cases / 常见使用场景

• 调试 API 返回的复杂 JSON 结构
• 把后端响应贴进来生成 TypeScript 类型定义
• 把 CSV 数据快速转成 JSON 喂给前端

Key features / 主要功能

• JSON 格式化、压缩与语法校验
• 树状可视化查看大 JSON 结构
• JSON 与常见格式互转，全程浏览器本地处理

Design notes / 设计取舍

JSON 工具是开发者每天用的东西，但很多在线版本要么有广告、要么要求登录、要么把你的数据上传到服务器（出现过真实的数据泄露事件）。JSON Tools 的设计原则是：永远不上传、永远不要求登录、永远不收集数据。代价是无法做"跨设备保存"这种特性，但这正是它和企业级 JSON 工具的本质区别。

Technology stack / 技术栈

Each layer below was chosen for what it lets the project avoid as much as what it enables. Together they shape the latency, the build pipeline, and how quickly new ideas can be tried in production.

下面这些选择，更多是为了排除某些复杂度，而不只是为了“用上”。它们共同决定了项目的延迟特性、构建流水线，以及把一个想法跑通的最短路径。

• Next.js

  A React framework with server-side rendering, file-based routing, and a streaming runtime. Powers SEO-friendly pages and incremental builds.

• TypeScript

  A typed superset of JavaScript that catches mismatches at compile time. Helps keep the codebase maintainable as projects grow.

• Tailwind

  A utility-first CSS framework that composes styles directly in markup. Keeps visual decisions close to the component and avoids unused CSS bloat.

FAQ / 常见问题