重构 iwangpo.com：一个全栈 Side Project 的四个月

发表于 分类于
记录从零重构个人网站的全过程——技术选型、Hexo 迁移、自动化部署、性能优化，以及 Side Project 带给我的意外收获

🏗️ “做 Side Project 最好的时机是十年前，其次是现在。”

🤷 为什么重做网站

旧的 iwangpo.com 跑了两年多，累积了一些技术债：

  • Hexo 版本老旧，插件兼容性差
  • Nginx 配置碎片化，加一个子域名要改三处
  • SSL 证书管理依赖手动 renewal
  • 没有 CI/CD，每次更新要手动 hexo generate && rsync

与其修修补补，不如从头重构。

🧰 技术选型

组件 选择 理由
静态生成 Hexo + NexT 8.27 熟悉，Markdown 工作流不变
Web Server Nginx + HTTP/2 性能稳定，配置可控
SSL Certbot + DNS Challenge 通配符证书，全自动续期
代理 Xray + VLESS + XHTTP 自用隧道，跑在独立端口
进程守护 Supervisor 轻量可靠

📐 架构设计

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
                ┌──────────────┐
                │  Cloudflare  │
                └──────┬───────┘
                       │
                ┌──────▼───────┐
                │    Nginx     │
                │  (port 443)  │
                └──┬───┬───┬──┘
                   │   │   │
         ┌─────────┘   │   └──────────┐
         ▼             ▼              ▼
┌────────────┐ ┌────────────┐ ┌────────────┐
│ iwangpo.com│ │ bghunt.cn  │ │ subdomain  │
│  (static)  │ │  (static)  │ │  (proxy)   │
└────────────┘ └────────────┘ └────────────┘

核心设计原则：一个文件管一个域名的所有子域名。

🔧 几个有意思的实现

1. Nginx 配置模块化

之前的配置 18 个 server 块散落四处。优化后用了 map 做动态路由：

1
2
3
4
5
6
7
8
9
10
11
12
13
map $host $backend_port {
    api.bghunt.cn     7086;
    silly.bghunt.cn   7089;
    default           7086;
}

server {
    listen 443 ssl http2;
    server_name api.bghunt.cn silly.bghunt.cn ...;
    location / {
        proxy_pass http://127.0.0.1:$backend_port;
    }
}

2. 证书自动续期的教训

最坑的是 certbot 升级后 dns-cloudflare 插件消失，导致 iwangpo.com 证书过期了整整 50 天才发现。

解决方法：在 supervisor 配置里加了 certbot 的定期检查，同时写了份 AGENTS.md 文档记录所有关键配置（这样不管谁来接手都能快速定位问题）。

3. 代理通道升级

从旧的 Shadowsocks 无缝迁移到 VLESS + XHTTP，新增了 uTLS 指纹伪装。整套跑在 Supervisor 守护下，出问题自动重启。

📊 性能对比

指标 重构前 重构后
首页加载 (3G) 2.8s 0.9s
SSL 评分 B A+
首次内容绘制 1.6s 0.4s
Gzip 压缩率 未启用 ~72%
缓存命中率 0% ~85%

工具用到了：Lighthouse、SSL Labs、WebPageTest。

🎁 意外收获

写字变多了。

重构网站的过程强迫我整理了之前的文章目录，发现自己 2025 年写了 20 多篇，2026 年前两个月只写了一篇。这让我重新意识到：写作是最高效的学习方式之一。

具体的好处：

  • 技术决策记录下来了，下次不纠结
  • 徒步笔记写出来，一年的回忆有了锚点
  • 投资复盘让策略偏差变得可见

🗺️ 后续计划

  • 接入 CDN（Cloudflare 全站加速）
  • 考虑从 Hexo 迁移到 Astro（更现代化）
  • 设计一个自定义 NexT 主题变体
  • 加一个 Newsletter 订阅

🚀 Side Project 最大的意义不是结果，而是过程中逼自己完成的工作流、文档和决策习惯——这些会在未来的项目中持续复利。