我们如何使用 Next.js 和 38 语言翻译构建了一个拥有 8000+ 游戏的游戏门户

Source: Dev.to

技术栈

• 框架：Next.js 16 + App Router
• 数据库：Neon PostgreSQL + Prisma 7 ORM
• 托管：DigitalOcean VPS + Cloudflare CDN
• 图片 CDN：自建基于 nginx 的 CDN（img.sonsaur.com），提供预先压缩的 AVIF 缩略图
• 搜索：PostgreSQL trigram 索引（pg_trgm）实现模糊游戏搜索
• AI 翻译：Gemini API，使用 60 把密钥轮转以管理速率限制
• 进程管理：PM2，自动重启并限制内存

图片 CDN 挑战

面对 8,000+ 款游戏，每款都需要缩略图，图片优化至关重要。我们构建了自定义图片流水线：

• 原始图片以 512 px 的 AVIF 格式存储
• 预生成 128 px（约 6 KB）和 256 px（约 13 KB）两种尺寸的变体
• 通过专用 nginx 子域名（img.sonsaur.com）提供服务
• 零 JavaScript 的图片组件（使用普通 “ 标签实现零水合成本）

结果：游戏卡片的图片负载降低了 84 %。

将 8,000 款游戏翻译成 38 种语言

这是最有趣的挑战。我们不仅要翻译 UI（已使用 next-intl 处理），还要翻译游戏专属内容：描述、玩法指南、技巧和 FAQ。

我们的做法：

• 在多个项目中分配 60 把 Gemini API 密钥
• 每 2 分钟运行一次 cron 任务，每批处理 60 款游戏（每把密钥处理 1 款）
• 顺序处理以防止 Node.js 流式传输崩溃
• 密钥冷却 2 分钟，所有密钥耗尽后暂停 10 分钟
• Tier 1 速率限制：每把密钥每个项目每天 1,500 次请求

在满负荷运行时，我们每天可翻译约 43,200 个游戏页面（覆盖所有语言）。

性能结果

• Lighthouse：Performance 79，Accessibility 93，Best Practices 100，SEO 100
• 首次游戏加载：3 秒以内
• 后续导航：几乎即时（Next.js 预取）
• 图片 CDN：128 px 缩略图平均 6 KB（原图 34 KB）

下一步

• 原生 Android 与 iOS 应用
• 完成所有 38 种语言的全覆盖翻译
• 持续向库中添加新游戏

快来看看吧：sonsaur.com

欢迎随时提问任何关于技术栈的细节。Next.js + Neon PostgreSQL + 自建图片 CDN 的组合在此场景下表现非常出色。