前言
网站跑了一周多,功能基本齐全了。今天抽空做了一轮性能优化和安全加固,把能抠的细节都抠了一遍。
1. 性能优化
1.1 内容压缩
静态资源已经配置了 gzip 压缩,CSS 文件传输量从 20KB 压缩到 6KB 左右。Nginx 的 gzip 配置如下:
gzip on;
gzip_types text/css application/javascript text/plain;
gzip_min_length 256;
gzip_proxied any;
1.2 HTTP 缓存策略
CSS/JS/图片等静态文件已配置 30 天缓存 + immutable:
Cache-Control: public, max-age=2592000, immutable
用户第二次访问时这些文件直接从本地缓存读取,不再请求服务器。
1.3 按需加载
之前已经做了的工作:
- 首页只加载必要 CSS,hljs 高亮库只在前台文章页加载
- fonts.css 从 3MB 压缩到 1.6KB(gzip),砍掉所有不需要的字符集
- 字体文件加了
preload,提升加载优先级 - 图片全部
loading="lazy"懒加载
结果:首页首屏下载从 ~200KB 降到 ~14KB(减少 93%)
2. 安全加固
2.1 安全响应头
所有页面返回以下安全头:
| 响应头 | 作用 |
|---|---|
X-Content-Type-Options: nosniff |
防止 MIME 类型嗅探 |
X-Frame-Options: SAMEORIGIN |
防止被别站 iframe 嵌入 |
X-XSS-Protection: 1; mode=block |
反射型 XSS 防护 |
Referrer-Policy: strict-origin-when-cross-origin |
控制来源泄露 |
Strict-Transport-Security |
强制 HTTPS 访问 |
2.2 API 限流
全量 API 接口加上了限流保护:15 分钟内最多 200 次请求,超过返回错误,防止恶意刷接口。
2.3 后台登录防护
- 暴力破解限制:连续 5 次密码错误锁定对应 IP 15 分钟
- 管理员密码错误次数在 session 里额外计数
- 登录成功/失败都记录操作日志
2.4 版本号隐藏
app.disable('x-powered-by') 隐藏 Express 版本号,避免暴露技术栈信息。
3. 用户体验
3.1 文章阅读体验
- 文章页顶部的阅读进度条
- 自动生成目录(侧边栏),带滚动高亮
- 代码块一键复制按钮
- 上下篇导航,键盘方向键翻页
- 回到顶部按钮
3.2 全局功能
- 回到顶部按钮(所有页面统一)
- 移动端汉堡菜单,点击外部自动关闭
- 暗/亮色主题切换,记住用户偏好
- 404 页面美化引导
- 文章打印优化
3.3 SEO 优化
robots.txt+sitemap.xml自动生成- JSON-LD 结构化数据(文章/网站)
- Open Graph 社交分享标签
- RSS 订阅 Feed
- Canonical URL 防重复收录
4. 当前状态
| 指标 | 数值 |
|---|---|
| 文章数量 | 20+ 篇 |
| 首页首屏 | ~14KB |
| 缓存命中率 | 高(30 天缓存) |
| 安全评级 | 6 项安全头 |
| 健康检查 | /health 正常 |
| 自动备份 | 每日 2 点,保留 7 份 |
5. 下一步
功能层面暂时够用,后续可能考虑:
- 评论系统接入(Giscus 基于 GitHub Discussions)
- 后台文章列表搜索/筛选
- 移动端首屏渲染优化
- 图片上传到云存储(目前用 URL 引用)
先这样,有 bug 再修,有需求再加。
2026-04-07