超低成本展示型独立站选型与原理

你有没有过这样的冲动：想做一个个人品牌展示、作品集、案例集，或者一个独立的项目页面，但又不想花钱买服务器、买域名、买 SSL？

答案是：完全可以免费实现，而且效果比你想象中要好。

这篇是「超低成本展示型独立站」系列的第一篇，教你选择最优方案 + 核心原理。后面会依次讲搭建、内容规划、部署优化等。

为什么是 Astro + Vercel/Netlify + Supabase + Cloudflare？

2026 年，个人开发者/创作者想搭建展示型独立站的成本有几个阶段：

我们的核心组合：Astro + Vercel/Netlify + Supabase free tier + Cloudflare

1. Astro —— 静态站点生成器（Static Site Generator）

为什么选择 Astro？

• 极致性能：HTML 直接输出，无需 Node.js 运行时（生产环境极致快）
• 内置集成丰富（Tailwind、MDX、Content Collections 等）
• 开发体验极好，VS Code 插件支持好
• 社区活跃，生态完善

Astro 的核心优势：

• 服务器端渲染（SSR）可选
• 静态导出 + ISR
• 极小的构建产物

2. Vercel / Netlify —— 一键部署 + 边缘网络

Vercel（推荐）：

• 免费计划：无限部署 + 自定义域名
• 边缘计算（Edge Network）极快
• 内置预览链接、分支部署
• 完美支持 Astro

Netlify：

• 同样免费
• 也支持 Astro
• 适合不想用 Vercel 账号的人

3. Supabase free tier —— 免费数据库

展示型站一般不需要复杂业务逻辑，但有时候需要：

• 联系表单提交记录
• 留言板
• 用户上传头像/作品
• 简单 CRM

Supabase 免费层：

• 无限数据库（Postgres）
• 免费 API（10k requests/月）
• 内置 Auth
• Edge Functions

4. Cloudflare —— 加速 + 安全 + 免费域名

Cloudflare 的免费福利：

• 免费 CDN + 边缘计算
• 免费 SSL（HTTPS）
• 免费域名注册（blktech.cn 之类的）
• 免费 DDoS 保护
• 免费 Workers

完整免费方案对比表

推荐起步路径（3 步走）

1. 本地开发：Astro + Tailwind
2. 部署到 Vercel：一键部署，获得预览链接 + 自定义域名
3. 加 Cloudflare：加速、HTTPS、Workers

写这篇系列的目的

本系列将一步步带你：

• 搭建一个真正好看、加载快的展示型独立站
• 掌握内容规划技巧（什么时候该用博客、什么时候该用静态页面）
• 实现个性化（个性化主页、作品分类、案例筛选）
• 后期优化（SEO、性能、Analytics）

系列导航

1. 当前：选型与原理
2. 快速搭建：Astro + Tailwind 展示模板
3. 内容规划：页面结构、SEO 与 GEO
4. 部署上线：Vercel、Netlify 与自定义域名
5. 进阶优化：性能、Analytics 与个性化
6. 配套资源：模板、组件与 Prompt
7. 从 0 到 1 完整指南