JSONビューティファイア
JSONビューティファイアーは、整形されていない、最小化された、あるいは乱れたJSONデータを、視覚的にすっきりした人間が読めるコードへ変換します。カスタマイズ可能なインデント幅(2スペース、4スペース、タブ)、視認性のためのアルファベット順キー並べ替え、Unicodeエスケープの制御、コメントの許容を備え、処理は完全にブラウザ内で実行されます。
JSONビューティファイアはどう動きますか?
現代のAPIアーキテクチャでは、ログもネットワークトレースもWebhookのペイロードも、連続した1行の文字列として届きます。最小化されたテキストを目で追って監査するのは認知的な疲労が激しく、セキュリティ上の欠陥や欠落したトークン、不正なデータ型を見逃す可能性を高めます。
ToolsByUsのJSONビューティファイアーは、構造化されたASTへのデシリアライズと規律あるインデント生成によって、視覚的な階層を立て直します。
- 予測可能な辞書順ソート:
Sort Keysを有効にすると、ドキュメント階層の全レベルでオブジェクトのプロパティがアルファベット順に並びます。プロパティの位置が標準化され、コードレビューやトラブルシューティングの際に視覚的な走査が瞬時に行えます。 - 設定可能なインデント幅:2スペースはJavaScriptの慣習、4スペースはPythonをはじめバックエンド世界の標準、ハードタブは読者一人ひとりが幅を選べる方式です。どれが正しいということはなく、唯一の誤りは1つのファイルに混在させることです。
- 括弧スタイルと区切り文字の整形:従来型のコンパクトな開き括弧(同一行に置くK&Rスタイル)と、深くネストしたコレクション配列で縦方向の視認性を最大化する展開形式から選べます。
- 安全なUnicodeエスケープ:非ASCII文字(多言語の文字列、絵文字、各国の通貨記号など)を、UTF-8のまま保持するか、RFC 8259 Section 7に従って安全な
\uXXXXの16進エスケープシーケンスへ変換するかを選べます。 - JSONCコメントの除去:
tsconfig.jsonやVS Codeの設定ファイルなどにありがちな開発者コメント(//と/* */)を許容し、RFCに準拠した標準のJSONへ変換します。 - ローカル処理の保証:整形は100%ブラウザ内で行われます。機密性の高いペイロード、APIトークン、顧客レコードがネットワークを流れることはありません。
ビューティファイアーの動作は次のとおりです。入力テキストをASTにパースし、深さを追跡しながらノードを再帰的に走査し、設定したインデント幅に従ってスペースかタブを出力し、オブジェクトのペアと配列の項目の間に改行を挿入し、対応するインデントの深さに対応する閉じ括弧を付加します。
最小化された未整形の入力
{"id":42,"title":"Log Event","active":true,"tags":["prod","payment"]}出力例
{
"active": true,
"id": 42,
"tags": [
"prod",
"payment"
],
"title": "Log Event"
}JSONビューティファイアが対応するオプションとエッジケースは?
| パラメータ | 型 | デフォルト | 動作とエッジケース |
|---|---|---|---|
| インデント: 2スペース | 書式スタイル | 2スペース | 標準的なWebとTypeScriptの規約で、深くネストされたツリーでの水平スクロールを最小化します。 |
| インデント: 4スペース | 書式スタイル | 4スペース | バックエンドシステム、Python、コマンドラインターミナルで好まれる、高いコントラストの視覚的インデントです。 |
| インデント:タブ | 書式スタイル | \t | ハードウェアタブ文字で、各開発者がローカルのIDEでタブ幅をカスタマイズできます。 |
| キーのソート | 正規化 | true | すべてのネストレベルで辞書キーをアルファベット順にソートし、一貫した視覚スキャンと再現可能な出力を実現します。 |
| Unicodeのエスケープ | エンコードオプション | false | ASCII範囲外の文字を\uXXXXの16進シーケンスにエンコードし、ASCIIのみのレガシートランスポート層で使用できるようにします。 |
| JSONCコメントの削除 | 構文復元 | 有効 | JSONC入力からスラッシュを含む文字列リテラルを破壊せずに、単一行と複数行のコメントを削除します。 |
| 入力上限 | パフォーマンス制限 | 8 MB | 強制値であり、目標値ではありません。フォーマットはメインスレッドで実行されるため、大きな貼り付けはタブをフリーズさせるよりも説明付きで拒否されます。2MBを超えると注意が表示されます。より大きなドキュメントには、Web Workerで処理される「JSON差分比較」を使用してください。 |
よくある質問
ビューティファイアーとフォーマッターの違いは何ですか?
どちらも同じ直列化エンジンを核にしていますが、ビューティファイアーは視覚的な使いやすさ、読みやすさ、人間の理解(アルファベット順のキー並べ替え、はっきりしたコントラスト、括弧レイアウトのオプションなど)を重視します。一方のフォーマッターは、厳密な構文準拠、JSONCコメントの除去、CLI向けの整形規約に焦点を当てます。
JSONのキーをアルファベット順に並べ替えると何が良いのですか?
JSON(RFC 8259)では、キーの順序は任意です。数十個のキーを持つ複雑なペイロードを調べるとき、キーがアルファベット順に並んでいれば、オブジェクト全体を探さずに目的のフィールドへ素早くたどり着けます。さらに、キーが場当たり的な順序で直列化されることによる見せかけの差分ノイズが、gitのコミットに現れなくなります。
ビューティファイアーはタブとスペースをどう扱いますか?
2スペース、4スペース、ハードタブ文字から選べます。スペースならどのエディタでも同じ表示になり、タブならエンジニア一人ひとりのエディタでのタブ幅の好みを尊重できます。
コメント入りのJSONをビューティファイアーに貼り付けられますか?
はい、できます。ビューティファイアーは1行コメント(//)と複数行コメント(/* */)を許容し、出力では有効なRFC 8259構文を保ちながらコメントをきれいに除去します。コメントが除去された場合は通知します。
Unicodeエスケープはいつ有効にすべきですか?
7ビットASCIIの送信しかサポートしないレガシーなバックエンドAPIやプロトコルへJSONペイロードを送るときに有効にしてください。現代のHTTP APIでは、UTF-8のままにすることをお勧めします。
整形したデータはサーバーにアップロードされますか?
いいえ。パースと整形のロジックはすべて、ローカルのブラウザランタイム内で厳密に実行されます。アップロードされるバイトはゼロで、GDPRや社内セキュリティポリシーへの完全な準拠が保たれます。