Browser Detective — ブラウザが公開している情報を可視化する
Browser Detective は、Webページから読み取れるブラウザ・端末のシグナルを34枚のカードとして表示し、それぞれが何を明かすのか、どう低減すればよいのかを平易な言葉で解説する静的サイトです。データは端末内で完結し、サーバーも解析ツールも存在しません。
計測している項目
ダッシュボードはシグナルを8行に分類して表示します。関連する値が隣り合うように並べ、各カードには平易な解説と対策のヒントを添えています。
- システム: OS、ブラウザとそのバージョン、プラットフォーム、端末の種別
- ハードウェア: CPUコア数、報告されるメモリ量、GPUのレンダラ文字列、バッテリー残量と充電状態
- GPUの上限: 最大テクスチャサイズ、最大ビューポート、シェーダの精度、アンチエイリアスの対応状況
- ディスプレイ: 解像度、向き、色深度、色域(sRGB / P3 / Rec.2020)、HDR対応、色反転の設定
- 入力と環境設定: タッチ点数、ポインタの種類とホバー可否、ダークモード、視差効果を減らす設定
- ネットワークと位置: 回線種別と推定速度、WebRTCの可否、公開IP、ISP、おおよその位置、タイムゾーン、受理言語
- プライバシー関連: Cookieの可否、Do Not Track、WebDriverの検出、利用可能なAPIの数
- フィンガープリント: Canvasフィンガープリントのハッシュと、複数シグナルを組み合わせたハッシュ
単体の値より「組み合わせ」が問題になる理由
個々の値のほとんどは、単体では何百万人もの利用者と共通です。画面解像度だけでは個人を特定できませんし、タイムゾーンも同様です。問題は、フィンガープリントが「唯一の値」を必要としない点にあります。情報量の小さい値でも、組み合わせることで母集団を一人に絞り込めてしまいます。
そこでこのツールは、レンダラ文字列・画面サイズ・プラットフォーム・タイムゾーン・言語・コア数・メモリから複合ハッシュを計算し、それぞれがどれだけ区別に寄与するかを示します。Canvasフィンガープリントは別枠で表示しています。グラフィックスドライバ、フォントのラスタライザ、描画経路に依存するため、単体でほぼ個人を特定しうる数少ないシグナルだからです。
実務上の結論として、ひとつのシグナルを塞いでも効果は限定的です。複数のカテゴリにわたって区別可能な値を減らすことが有効で、そのため単純な合否ではなくカバレッジのスコアとして表示しています。
設計上の判断
静的エクスポートを選んだのは意図的です。「データは端末から出ない」と主張するツールが、そのデータを受け取るサーバーを持つことは矛盾します。そのためビルド結果は素のHTMLとJavaScriptのみで、任意の静的ホスティングで配信できます。オフラインでも同じ結果が得られます。
ブラウザAPIはすべて使用前に機能検出しています。これらのAPIは一様には利用できません。Battery Status APIはFirefoxとSafariに存在せず、deviceMemoryはChromium系のみ、色域の検出にはCanvasの対応が必要です。APIが無い場合は、0を表示するのではなく「報告なし」と明示します。0は「実際に0だった」場合と区別がつかないためです。
ハイドレーションは useSyncExternalStore と明示的なサーバースナップショットで処理しています。ブラウザ依存の値はサーバーでは描画できないため、各ストアがサーバー用の値を返し、クライアント側に実データが揃うまでローディング状態を表示します。端末情報を描画する際に通常発生するミスマッチを避けるための構成です。
プライバシー研究との関係
ここで扱っているシグナルは、公開されているブラウザフィンガープリント研究で使われるものと大きく重なります。本ツールは研究用の計測器ではなく確認用のユーティリティであり、母集団におけるエントロピーを測定するものではありません。ただし、通常は測定される側から見えない「入力そのもの」を可視化することを目的としています。
主な特徴
- ハードウェア検出
- ネットワーク・位置情報
- Canvasフィンガープリント
- プライバシー重視の設計