Unlighthouse：Google Lighthouseでサイト全体をスキャンする
Unlighthouse: Google Lighthouse でサイト全体をスキャンする
Unlighthouse はオープンソースで、Node ベースのコマンドラインインターフェースです。ウェブサイトのすべてのページに対して Google Lighthouse の監査を実行します。スマートなサンプリングシステム、最小限の構成モデル、そして生の Lighthouse データを実用的な洞察へと変化させるクリーンな UI を提供します。
Google Lighthouse とは？
Google Lighthouse はウェブパフォーマンス、アクセシビリティ、ベストプラクティス、SEO、プログレッシブウェブアプリの準備状況を測定する人気の監査ツールです。しかし公式の Lighthouse CLI は個々の URL を監査するように設計されており、サイト全体ではありません。数十、数百ページある大規模アプリケーションの場合、すべてのページで手動で Lighthouse を実行するのは非実用的です。
なぜ Unlighthouse なのか？
Unlighthouse は、ドメイン全体で Lighthouse の実行を自動化することで、この課題を解決します。
- スマートサンプリング – デフォルトで、設定可能な戦略に基づいて URL の一部をクロールし、実行時間を大幅に短縮しつつ監査の網羅性を保ちます。
- ゼロコンフィグコア –
--site <url>を指定するだけで、クロール、Lighthouse 実行、レポート生成をすべてツールが行います。 - モダン UI – 軽量な Web インターフェースを通じて結果を表示し、開発者に即時の視覚フィードバックを提供します。
- Node & Docker 対応 – Node >=20 が搭載された任意のマシンまたは Docker で動作し、CI 統合を簡単にします。
- MIT ライセンス – ライセンスの心配は不要で、商用プロジェクトでも自由に利用できます。
クイックスタート
# npm でインストール
npx unlighthouse --site https://your‑domain.com
# PNPM で実行
pnpm dlx unlighthouse --site https://your‑domain.com
./output/your‑domain.com で、そこで index.html を開いてダッシュボードを確認できます。
設定オプション
Unlighthouse はさまざまなフラグとより高度なセットアップのための unlighthouse.config.ts ファイルをサポートします。
| Flag | Description | Example |
|---|---|---|
--debug |
詳細なデバッグログを有効にします | --debug |
--depth <n> |
最大クロール深度（デフォルト5） | --depth 3 |
--output-dir <dir> |
カスタムレポートディレクトリ | --output-dir ./reports |
--config <path> |
カスタム設定ファイルへのパス | --config ./my-config.ts |
サンプル設定
// unlighthouse.config.ts
import { defineUnlighthouseConfig } from "unlighthouse"
export default defineUnlighthouseConfig({
site: "https://example.com",
// このパターンに一致するページのみを監査します
include: ["/blog/*", "/products/*"],
// 管理ページを除外します
exclude: ["/admin/**"],
// 並列処理を 2 つ使用します
workers: 2,
// 重要な Lighthouse カテゴリを有効にします
lighthouse: {
categories: ["performance", "accessibility", "seo"],
},
})
CI での実行
Unlighthouse は CI への親和性があります。レポートフォルダをバージョン管理に保存するか、静的ホスティングサービスに公開してください。以下は GitHub Actions の例です：
name: Site Audit
on: [push]
jobs:
audit:
runs-on: ubuntu‑latest
steps:
- uses: actions/checkout@v3
- name: Install Node
uses: actions/setup-node@v3
with:
node-version: 20
- name: Run Audit
run: |
npx unlighthouse --site https://your‑site.com --output-dir ./audit
- name: Upload Report
uses: actions/upload-artifact@v3
with:
name: lighthouse-report
path: ./audit
高度な機能
1. サンプルベースの監査
Unlighthouse はページの一部のみをクロールすることで監査時間を短縮します。--sample-rate フラグ（0〜1）で調整したり、設定ファイルでカスタムサンプリング戦略を作成したりできます。
2. Lighthouse 設定の調整
カスタム lighthouse.json 設定を渡したり、設定内の lighthouse プロパティを介してデフォルトを変更したりできます。典型的な調整には、サードパーティの監査を無効にするか、スコア閾値をカスタマイズすることが含まれます。
3. API 統合
認証を必要とする動的サイトの場合、Unlighthouse は --cookies-file や --user-data-dir のような Chrome 起動引数をサポートします。また、Node スクリプトに埋め込み、プログラム的に監査をトリガーすることも可能です。
4. マルチプロトコル対応
主に HTTP ベースですが、ローカル開発サーバー (http://localhost:3000) やリモートステージング環境を指し示すこともできます。デフォルトで robots.txt を尊重しますが、必要に応じて --ignore‑robots で上書き可能です。
実際の使用例
| Project | Unlighthouse がどう役立ったか |
|---|---|
| E‑commerce Platform | 400 件以上の商品ページを 30 分以内に監査し、ページ速度スコアを 20 ポイント落とした遅い画像ロードループを発見しました。 |
| Content‑Heavy Blog | 2,000 件以上の投稿をスキャンし、古いコンテンツに壊れた外部リンクがあることを発見し、SEO ペナルティを招く原因となっていた。 |
| Internal SaaS | performance と seo カテゴリのみを有効にして 50 件以上の内部ページの監査時間を短縮し、開発時間を数時間節約しました。 |
貢献ガイドライン
Unlighthouse はコミュニティ主導です。バグ報告、機能リクエスト、議論など、すべて歓迎します！
- Issue（課題） – GitHub イシューでバグや機能リクエストを登録してください。
- Pull Request（PR） –
CONTRIBUTING.mdの貢献ガイドに従い、セマンティックバージョニングと CI 自動リントを採用しています。 - スポンサー – GitHub Sponsors でのスポンサーシップを受け付けています。寄付はリリースとドキュメントの維持に役立ちます。
最後に
Unlighthouse は、手動設定の煩わしさなしに Lighthouse の全機能をサイト全体に適用します。フロントエンドエンジニア、DevOps エンジニア、またはパフォーマンスと SEO の改善を目指すサイトオーナーにとって、このツールは重要なギャップを埋めます。軽量・高速・完全オープンソースで、現代の Web ワークフローに最適です。
今日から始めましょう – npx unlighthouse --site https://your‑site.com を実行し、監査データが実際の改善へと変わるのを目で確かめてください。