Red Squares：把 GitHub 宕机记录做成贡献图的趣味项目

GitHub 的贡献图（Contribution Graph）上那些绿色小方块，是很多开发者每天打开 GitHub 的动力来源。最近有个有趣的项目叫 Red Squares，把 GitHub 的绿色贡献图变成了红色——不过不是记录你的提交，而是记录 GitHub 官方的宕机时间。

项目是什么

Red Squares 是一个开源的 Web 应用，它用 GitHub 贡献图的样式，把 GitHub.com 的平台宕机事件可视化出来。绿色代表正常运行，红色（不同深浅）代表不同程度的宕机。

在线体验：https://red-squares.cian.lol/

为什么做这个

GitHub 的贡献图激励开发者每天提交代码，但它也有一个”副作用”——很多开发者为了保持绿格子，会做一些无意义的提交。Red Squares 用同样的视觉语言，但展示的是”GitHub 自己今天掉链子了几次”，带有一种善意的讽刺意味。

技术实现

项目的技术栈：

• 数据来源：GitHub Status API 和 GitHub 自己的状态页面数据
• 前端：React + Vite，纯前端渲染
• 样式：模仿 GitHub 贡献图的 CSS 样式
• 部署：静态站点，可以部署到任何地方

对站长的启发

1. 监控可视化很重要

Red Squares 的可视化思路可以借鉴。如果你运营多个服务，可以做一个类似的仪表盘：

• 用颜色深浅表示服务健康度
• 一眼看出哪些服务最近不稳定
• 方便排查周期性问题（比如每天某个时段容易出问题）

2. Uptime 监控工具推荐

如果你也想监控自己网站的可用性，这些开源工具值得一试：

• Uptime Kuma：最流行的开源监控工具，界面好看功能全
• Gatus：Go 语言写的健康检查工具，配置简洁
• Statping：支持多种通知方式的状态页
• Cachet：开源的状态页系统，适合对外展示

3. GitHub 可靠性数据

从 Red Squares 的数据可以看到，即使是 GitHub 这样的大平台，也不是 100% 可靠的。关键业务代码和数据一定要有本地备份或多平台同步。

类似有趣的 GitHub 相关项目

• GitHub Skyline：把你的 GitHub 贡献数据做成 3D 城市天际线
• GitHub Unwrapped：年度 GitHub 活动回顾视频
• Profile README：GitHub 个人主页的 README 展示
• Star History：查看 GitHub 项目的 Star 增长曲线

简评

Red Squares 是一个轻松有趣的小项目，技术上不复杂，但创意很好。它提醒我们两件事：一是不要过于迷信绿格子，二是再大的平台也会宕机。对于站长来说，做好自己服务的监控和备份，比追求 GitHub 贡献图全绿更重要。

来源：
Red Squares – GitHub outage contribution graph
Hacker News 讨论