監視プラットフォーム

Plausible Analytics

概要

Plausible Analyticsはプライバシー重視の軽量Webアナリティクスツールです。クッキー不要でGDPR準拠、シンプルで直感的なダッシュボードを提供する次世代分析ツールです。プライバシー意識の高まりと共に急成長し、GoogleアナリティクスのプライバシーやUIの複雑さに不満を持つユーザーの代替選択肢として人気を博しています。

詳細

Plausible Analyticsは「シンプルさ」と「プライバシー」を重視する現代のWebアナリティクスニーズに応えるプラットフォームとして設計されており、従来の複雑な分析ツールに対するアンチテーゼとして位置付けられています。

主要機能

• プライバシーファースト: Cookie不要でGDPR、CCPA完全準拠
• 軽量スクリプト: 45KB未満の軽量なトラッキングスクリプト（GAの17分の1）
• リアルタイムダッシュボード: シンプルで直感的なレポート画面
• オープンソース: 完全にオープンソースで透明性確保
• 自動化レポート: 週次・月次の自動メールレポート
• ゴール設定: コンバージョンとカスタムイベント追跡
• 国とデバイス分析: 地理的分布とデバイス情報

技術的特徴

• Cookie不要: ユーザー同意バナー不要
• 高速ロード: ページ読み込み速度への影響最小化
• サーバーサイド: EUのプライベートクラウドでデータ処理
• API提供: データ取得とカスタム統合のためのAPI
• セルフホスティング: 自社サーバーでの運用も可能

メリット・デメリット

メリット

• プライバシー規制に完全準拠（GDPR、CCPA等）
• 非常に軽量でページ速度に影響しない
• シンプルで使いやすいインターフェース
• Cookie不要でユーザー同意バナー不要
• オープンソースで透明性が高い
• 自動レポート機能
• セルフホスティング可能

デメリット

• Google Analyticsと比較して機能が限定的
• 高度な分析やセグメント機能が不足
• 既存のマーケティングツールとの統合が限定的
• 無料版なし（有料のみ）
• データ保持期間が短め
• エンタープライズ向け機能の不足

参考ページ

• Plausible Analytics公式サイト
• Plausible Documentation
• Plausible GitHub
• Privacy Policy

設定・監視例

基本セットアップ

<!-- Plausible Analytics トラッキングコード -->
<script defer data-domain="yourdomain.com" src="https://plausible.io/js/script.js"></script>

<!-- カスタムドメイン使用の場合 -->
<script defer data-domain="yourdomain.com" src="https://analytics.yourdomain.com/js/script.js"></script>

<!-- 除外設定付き -->
<script defer data-domain="yourdomain.com" data-exclude="/admin/*,/dashboard/*" src="https://plausible.io/js/script.js"></script>

メトリクス収集

// カスタムイベント追跡（script.outbound-links.js使用）
<script defer data-domain="yourdomain.com" src="https://plausible.io/js/script.outbound-links.js"></script>

// ゴール設定（JavaScriptイベント）
function triggerPlausibleEvent(eventName, options = {}) {
  if (window.plausible) {
    window.plausible(eventName, options);
  }
}

// カスタムイベント送信例
triggerPlausibleEvent('Newsletter Signup');
triggerPlausibleEvent('Download', { props: { method: 'PDF' } });

// 外部リンククリック自動追跡
<script defer data-domain="yourdomain.com" src="https://plausible.io/js/script.outbound-links.js"></script>

// ファイルダウンロード追跡
<script defer data-domain="yourdomain.com" src="https://plausible.io/js/script.file-downloads.js"></script>

アラート設定

// Stats API を使用したデータ取得
const API_TOKEN = 'your-api-token';
const SITE_ID = 'yourdomain.com';

async function getPlausibleStats() {
  const response = await fetch(`https://plausible.io/api/v1/stats/aggregate?site_id=${SITE_ID}&period=day&metrics=visitors,pageviews,bounce_rate,visit_duration`, {
    headers: {
      'Authorization': `Bearer ${API_TOKEN}`
    }
  });
  
  const data = await response.json();
  return data.results;
}

// カスタムアラート実装例
async function checkDailyTraffic() {
  try {
    const stats = await getPlausibleStats();
    const visitors = stats.visitors.value;
    
    if (visitors < 100) {
      console.log('Traffic alert: Low visitor count detected');
      // Slack/Discord等への通知処理
    }
  } catch (error) {
    console.error('Failed to fetch Plausible stats:', error);
  }
}

ダッシュボード作成

// Plausible Stats API でカスタムダッシュボード作成
class PlausibleDashboard {
  constructor(apiToken, siteId) {
    this.apiToken = apiToken;
    this.siteId = siteId;
    this.baseUrl = 'https://plausible.io/api/v1/stats';
  }

  async getBreakdown(property, period = '30d') {
    const response = await fetch(`${this.baseUrl}/breakdown?site_id=${this.siteId}&period=${period}&property=${property}`, {
      headers: { 'Authorization': `Bearer ${this.apiToken}` }
    });
    return response.json();
  }

  async getTimeseries(period = '30d', interval = 'date') {
    const response = await fetch(`${this.baseUrl}/timeseries?site_id=${this.siteId}&period=${period}&interval=${interval}`, {
      headers: { 'Authorization': `Bearer ${this.apiToken}` }
    });
    return response.json();
  }

  async generateReport() {
    const [pages, countries, devices, timeseries] = await Promise.all([
      this.getBreakdown('event:page'),
      this.getBreakdown('visit:country'),
      this.getBreakdown('visit:device'),
      this.getTimeseries()
    ]);

    return {
      topPages: pages.results,
      topCountries: countries.results,
      deviceBreakdown: devices.results,
      trafficTrend: timeseries.results
    };
  }
}

ログ分析

// セルフホスティング環境での設定
// docker-compose.yml例
version: "3.3"
services:
  plausible_db:
    image: postgres:14-alpine
    restart: always
    volumes:
      - db-data:/var/lib/postgresql/data
    environment:
      - POSTGRES_PASSWORD=postgres

  plausible_events_db:
    image: clickhouse/clickhouse-server:22.6-alpine
    restart: always
    volumes:
      - event-data:/var/lib/clickhouse
    ulimits:
      nofile:
        soft: 262144
        hard: 262144

  plausible:
    image: plausible/analytics:v2.0
    restart: always
    command: sh -c "sleep 10 && /entrypoint.sh db createdb && /entrypoint.sh db migrate && /entrypoint.sh run"
    depends_on:
      - plausible_db
      - plausible_events_db
    ports:
      - 8000:8000
    env_file:
      - plausible-conf.env

volumes:
  db-data:
    driver: local
  event-data:
    driver: local

インテグレーション設定

// Next.js での Plausible 統合
// pages/_app.js
import Script from 'next/script'

function MyApp({ Component, pageProps }) {
  return (
    <>
      <Script
        defer
        data-domain="yourdomain.com"
        src="https://plausible.io/js/script.js"
      />
      <Component {...pageProps} />
    </>
  )
}

// React Hook for Plausible
import { useEffect } from 'react';
import { useRouter } from 'next/router';

export function usePlausible() {
  const router = useRouter();

  useEffect(() => {
    const handleRouteChange = () => {
      if (window.plausible) {
        window.plausible('pageview');
      }
    };

    router.events.on('routeChangeComplete', handleRouteChange);
    return () => {
      router.events.off('routeChangeComplete', handleRouteChange);
    };
  }, [router.events]);

  const trackEvent = (eventName, options = {}) => {
    if (window.plausible) {
      window.plausible(eventName, options);
    }
  };

  return { trackEvent };
}

// WordPress プラグイン設定
// functions.php に追加
function add_plausible_analytics() {
    ?>
    <script defer data-domain="<?php echo get_site_url(); ?>" src="https://plausible.io/js/script.js"></script>
    <?php
}
add_action('wp_head', 'add_plausible_analytics');