数据分析

EasyStarter Web 端已内置两套数据分析方案，均为可选，未配置环境变量时自动跳过加载：

方案	用途
Google Analytics 4	通用流量分析、转化漏斗、受众报告
OpenPanel	开源、隐私友好的产品分析（事件、留存、漏斗）

两者同时启用、互不干扰；只用其中之一也可以，把另一个环境变量留空即可。

建议只埋关键漏斗事件，例如注册完成、登录成功、订阅支付、核心生成任务完成、作品提交等。模板默认保留 GA4 的页面浏览统计，OpenPanel 不自动监听每次路由变化，避免免费额度被普通页面切换快速消耗。

Google Analytics 4

创建 GA4 媒体资源并获取 Measurement ID

官方文档：查找 Google 跟踪 ID / Measurement ID

前往 analytics.google.com 登录账号
进入 管理（Admin） → 创建 → 媒体资源（Property），填入产品名、时区、币种
在新建的媒体资源下选择 数据流（Data Streams） → 添加流 → 网站
输入网站 URL（例如 https://yourdomain.com），完成创建
在数据流详情页复制 测量 ID（Measurement ID），格式为 G-XXXXXXXXXX

填入环境变量

本地开发（apps/web/.env.development）：

apps/web/.env.development

VITE_GA_MEASUREMENT_ID=G-XXXXXXXXXX

本地生产部署（apps/web/wrangler.jsonc 的 vars 字段，明文，无需 Secret）：

apps/web/wrangler.jsonc

{
  "vars": {
    "VITE_GA_MEASUREMENT_ID": "G-XXXXXXXXXX",
    // ...
  }
}

apps/web/.env.production

VITE_GA_MEASUREMENT_ID=G-XXXXXXXXXX

VITE_ 前缀的变量会被打包进客户端 bundle，不属于敏感凭据，直接写在 wrangler.jsonc / CI 构建变量中即可，不需要 pnpm run secrets:bulk:production。.env.production 已加入 .gitignore，不会被提交。

按需上报关键事件

Web 端提供显式调用的统计 helper。业务代码只需要在真正有分析价值的转化节点调用：

import { trackGoogleEvent } from "@/lib/analytics/google-analytics";
import { trackOpenPanelEvent } from "@/lib/analytics/openpanel";

trackGoogleEvent("sign_up", {
  method: "google",
});

trackOpenPanelEvent("subscription_started", {
  plan: "pro",
});

如果某个页面确实需要作为产品漏斗的一步，可以手动记录 OpenPanel screen view：

import { trackOpenPanelScreenView } from "@/lib/analytics/openpanel";

trackOpenPanelScreenView("/pricing");

不要把所有路由切换都当成产品事件。先定义 3-5 个关键漏斗节点，再逐步补充事件，比一开始全量上报更容易控制额度，也更容易读懂数据。

OpenPanel

OpenPanel 是开源的产品分析平台，可自托管也可使用 Cloud 版（免费额度对个人项目足够）。EasyStarter 默认接入 Cloud 版。

注册 OpenPanel 并创建项目

官方文档：Web SDK

前往 openpanel.dev 注册账号
在 Dashboard 中点击 Create Project
填写 Project name
保持 Website 开启，关闭暂时不需要的 App、Backend / API
在 Domain 填写生产网站域名，例如 https://yourdomain.com
在 Allowed domains 填写允许写入事件的域名，例如 https://yourdomain.com
点击 Create project
创建完成后，在项目的客户端信息中复制 Website 对应的 Client ID（UUID 格式）

填入环境变量

本地开发（apps/web/.env.development）：

apps/web/.env.development

VITE_OPENPANEL_CLIENT_ID=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx

本地生产部署（apps/web/wrangler.jsonc）：

apps/web/wrangler.jsonc

{
  "vars": {
    "VITE_OPENPANEL_CLIENT_ID": "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
    // ...
  }
}

apps/web/.env.production

VITE_OPENPANEL_CLIENT_ID=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx

同样属于公开变量。CI 部署时把它配置到平台的**构建环境变量（Build variables）**中即可，不必使用 Secrets。