性能审计与上线仪式
确保项目在上线前具备权威性和可衡量性的最终检查清单。
PRID: 1207
VERIFIED
1 min read
🚀 性能审计与上线仪式
本仪式确保您的项目在上线到生产环境边缘节点前,不仅具备“功能性”,还具备“权威性”和“可衡量性”。
1. 数据分析与监控设置
为了追踪用户行为和站点健康状况,我们集成了 Google Analytics 4 和 Microsoft Clarity。
A. 配置步骤
打开 site.config.ts 并找到 analytics 块:
typescriptanalytics: { googleAnalyticsId: "G-XXXXXXXXXX", // 您的 GA4 衡量 ID microsoftClarityId: "XXXXXXXXXX", // 您的 Clarity 项目 ID }
B. 验证
- GA4: 部署后查看 Google Analytics 的实时报告。
- Clarity: 打开 Clarity 控制面板查看热力图和会话录制。
- 静默保护: 引擎在
index.html中内置了脚本保护逻辑,如果追踪脚本被广告拦截器拦截,应用也不会崩溃。
2. 性能基准 (Antigravity 协议)
我们的目标是 Lighthouse 满分。
核心网页指标目标:
| 指标 | 目标 | 我们如何做到 |
|---|---|---|
| LCP | < 1.2s | 字体预加载 + 零 JS 初始外壳。 |
| CLS | 0.0 | 为所有图片使用宽高比占位符。 |
| INP | < 200ms | React 19 Transitions + TanStack Router 预取。 |
3. 沙箱数据流水线 (机制回顾)
正如讨论的那样,在 AI Studio 沙箱 环境下:
- 注册表 (Registry) (
src/data/*.ts) 作为我们的“内存文件系统”。 - 脱水机 (Hydrator) (
useDocsDB) 在启动时读取此注册表。 - 引擎 (Engine) (
sql.js) 在浏览器内存中构建 SQL 数据库。 - 结果: 您在零服务器配置的情况下获得了全文搜索和数据库能力。
4. 上线前 SEO 最终检查
- 运行
node scripts/generate-seo.mjs刷新 sitemap/llms.txt。 - 验证
canonical标签指向您的正式域名。 - 运行
npm run check-i18n确保国际化完整性。
状态:已就绪,准备全球分发。