>_devtools-hub

JSON Size Analyzer

JSONのキーごとのサイズ貢献度をツリー表示で可視化

JSON開発者向けパフォーマンス

JSONを貼り付けて「解析」を押すと、各キー・ノードの UTF-8 バイトサイズをツリー形式で表示。サイズ割合をプログレスバーで可視化し、「どのキーが一番重いか」を一目で確認できます。API レスポンス最適化・設定ファイルの肥大化調査に役立ちます。

広告

JSON Size Analyzer

Features

  • JSONを貼り付けてキーごとのUTF-8バイトサイズを算出
  • ツリー形式で展開・折りたたみ可能
  • 全体に対するサイズ割合をプログレスバーで表示
  • string/number/boolean/object/array/null の型を色分け
  • サイズ降順でキーをソート(重いものが上に)

この作業の手順ガイド


JSONのサイズを最適化する — 肥大化の原因を見つける方法

APIレスポンスやアプリの設定ファイルは、気づかないうちにJSONが肥大化することがあります。JSON Size Analyzerを使うと、どのキー・ネストが最もサイズを占めているかをツリー表示で可視化し、最適化の優先順位をつけられます。

JSONサイズがパフォーマンスに与える影響

REST APIでは毎回のレスポンスにJSONが乗るため、キーの長さや不要なフィールドが積み重なるとネットワーク転送量が増加します。モバイル環境では特に顕著で、100KBのJSONを毎分フェッチするだけで6MB/時間の通信量になります。gzip圧縮で大幅に削減できますが、元のサイズを把握しておくことが最適化の第一歩です。

キーの短縮とフィールドの削減

一般的なJSON最適化として「キー名の短縮」があります。authorizationをauth、descriptionをdescにするだけで、大量のレコードでは数KBの削減になります。また、null値・空配列・デフォルト値のフィールドを省略することも効果的です。JSON Size Analyzerのツリービューでサイズ上位のキーを確認して削減対象を見極めましょう。

ネスト構造とフラット化のトレードオフ

ネストが深いほどJSON構造は読みやすくなりますが、キー名の繰り返しによりサイズが増えます。user.address.cityのように深くネストする代わりに、user_address_cityのようにフラット化することでキー数は増えますがバイト数が減るケースがあります。JSON FlattennerとSize Analyzerを組み合わせて比較するのが効果的です。

デスクトップ版でのファイル解析

デスクトップ版のJSON Size Analyzerでは、OSダイアログから.jsonファイルを直接開けます。大きなファイルも貼り付け不要でそのまま解析でき、数MBを超えるJSONでもスムーズに処理できます。サイズレポートはCSVとしてエクスポートして記録に残すことができ、デプロイ前後のAPIレスポンスサイズの変化を追跡するのに役立ちます。フォルダを指定して複数ファイルを一括解析するバッチモードも搭載しており、マイクロサービスの各エンドポイントを横断的に比較してサイズの大きいものを特定できます。

広告

Related Tools

Responsive Image Generator

1枚の画像から表示幅ごとの画像と srcset つきの img タグを作る

画像最適化パフォーマンス

使ってみる →

Lockfile Diff

package-lock.json の更新前後を比較 — 版の動きをメジャー/マイナー/パッチで分類

npmバージョン管理開発者向け

使ってみる →

Text Encoding Checker

文字コードを判定して UTF-8 に変換 — 化けた文字列の復元も

テキストエンコード開発者向け

使ってみる →

Line Ending Inspector

改行コードを検査 — CRLF / LF / CR の内訳と混在、BOMの有無

テキストエンコード開発者向け

使ってみる →

このツールを共有する