lenmei233's Blog

苦难就是苦难

Tue, 23 Dec 2025 00:00:00 GMT

苦难就是苦难

我们这个时代，最伟大的发明，不是人工智能，不是基因编辑，而是“苦难美学”。我们成了最顶尖的炼金术士，能将任何一坨散发着恶臭的、由血汗和绝望构成的苦难，提炼成闪闪发光的“正能量”金牌，然后挂在每个人的脖子上，美其名曰“榜样”。

你看那个凌晨四点就在街角卖早餐的阿姨，她不是被生活逼得没有选择，她是“城市唤醒师”，是“勤劳的化身”。她的关节炎不是病，是“奋斗的勋章”。她那双布满老茧、油污洗不掉的手，不是劳损的证据，而是“最动人的艺术品”。我们举着手机，对着她因常年吸入油烟而嘶哑的嗓门录下视频，配上激昂的音乐，发到网上，收获一片点赞和“阿姨加油！”的评论。然后心安理得地买完早餐，开着空调的汽车去上班，心里还为自己传播了“正能量”而感动不已。

你看那个为了省钱，一顿饭只吃一个馒头配咸菜的大学生。他不是贫穷，他是在“体验极简主义”，是“自律的典范”。他的胃病不是病，是“对物欲横流社会的无声抗议”。媒体把他请上节目，让他分享“如何用一百块活一个月”的经验，主持人声泪俱下地赞美他的“精神富足”。电视机前的观众们一边吃着外卖，一边感叹“现在的大学生真有毅力”，却绝口不提助学贷款的繁琐和兼职机会的稀少。

我们最擅长的，就是给苦难裹上一层糖衣，然后逼着你吞下去，还要你面带微笑地说声“谢谢”。那个在暴雨中送货的外卖小哥，不是在用生命换几块钱的配送费，他是“风雨无阻的城市骑士”。那个为了给孩子治病而打三份工的父亲，不是被医疗压垮的普通人，他是“伟大的父爱化身”。那个连续加班一个月后猝死在工位上的年轻人，不是过劳死的牺牲品，他是“燃烧自己，照亮公司的敬业标兵”。

于是，苦难被神圣化了。痛苦成了荣耀的阶梯，绝望成了励志的鸡汤。我们不再追问：为什么一个社会需要有人凌晨四点起来卖早餐？为什么一个大学生要靠一个馒头度日？为什么外卖小哥要在暴雨中搏命？为什么一个父亲要被逼到那种地步？为什么年轻人要“燃烧”自己？

不，我们不问。问这些问题，就等于撕开了那层精美的糖纸，露出了里面苦涩的、令人作呕的真相。真相是，很多苦难本可以不发生。真相是，赞美苦难，就是在为制造苦难的体系辩护。它巧妙地将矛头从结构性问题，转向了个人的“意志力”和“心态”。你过得不好，不是社会的问题，是你不够“坚强”，不懂得在“苦难中开花”。

这是一种极其残忍的集体催眠。我们一边消费着他人的苦难，一边将其包装成精神食粮喂给自己，以此来麻痹自己的良知，消解自己的不安。我们赞美苦难，是因为我们害怕自己成为下一个苦难者，所以我们宁愿相信，苦难是一种值得追求的品质，而不是一个需要被消灭的敌人。

但炼金术终究是骗术。糖衣融化之后，剩下的还是那坨苦涩的、恶臭的玩意儿。苦难不会因为被赞美就变得甜美，它只会带来创伤、不公和绝望。那个卖早餐的阿姨，她想要的不是“城市唤醒师”的虚名，而是一个能让她睡到自然醒的安稳晚年。那个吃馒头的学生，他想要的不是“极简主义”的标签，而是一顿营养均衡的午餐。

所以，收起那套“苦难美学”的辞藻吧。苦难就是苦难，它丑陋、痛苦、毫无价值。一个真正健康和文明的社会，不应该是赞美谁更能忍受苦难，而是应该努力去创造一个没有人需要去忍受不必要苦难的环境。

别再把勋章挂在伤口上了，那很疼。

前端开发：为什么要优先选择SVG图标而非PNG/JPG

Sun, 14 Dec 2025 00:00:00 GMT

前言

作为一名深耕前端的开发者，我曾在图标选型上踩过不少坑。还记得刚入行时，项目里塞满了PNG格式的图标，每次适配不同分辨率的设备，都要准备 @1x 、 @2x 、 @3x 多套资源，不仅文件夹臃肿不堪，还经常出现图标模糊、拉伸变形的问题。

后来接触到SVG图标，才发现这才是前端图标的“最优解”。它不仅完美解决了位图的适配痛点，还能大幅优化项目性能、提升开发效率。如今在我的前端项目里，SVG图标已经成为标配，那些PNG、JPG格式的图标，早已被我扔进了“淘汰清单”。

如果你还在为图标适配、体积优化头疼，那这篇文章一定会给你带来新的启发。

让我们开始吧

首先我们需要用到下列东西

能够独立思考的大脑 x 1：用于理解SVG的矢量特性和前端应用场景
代码编辑器 x 1：推荐VS Code，搭配SVG相关插件可提升开发效率
矢量绘图工具 x 1：如Figma、Inkscape，用于设计或编辑SVG图标
前端项目环境 x 1：用于实战SVG图标的引入与使用
一颗追求极致性能的心 x 1：毕竟优秀的前端开发者，都对性能有执念

SVG是什么？为什么前端要优先用它做图标？

SVG的全称是可缩放矢量图形，它是一种基于XML的矢量图像格式。与PNG、JPG这类基于像素的位图不同，SVG通过数学公式描述图形的路径、形状和颜色，这就决定了它天生适合作为前端图标使用。

图标对比位图图标的核心优势：

无限缩放不失真：无论放大多少倍，边缘始终清晰锐利，完美适配从手机到4K大屏的所有设备
体积更小更轻量：结构简单的SVG图标体积远小于同等视觉效果的PNG，尤其在高分辨率场景下优势明显
灵活可控可定制：可直接通过CSS修改颜色、大小、透明度，甚至实现动画效果，无需更换图片资源
支持语义化与无障碍：作为XML文档，SVG可添加 title 、 desc 标签，提升页面的无障碍访问性

快速上手SVG图标

获取SVG图标

获取SVG图标的方式有很多，推荐几种常用途径：

开源图标库：如Iconfont、Font Awesome、Material Icons，可直接下载SVG格式图标
矢量工具绘制：用Figma、Sketch等工具设计图标，导出为SVG文件
在线转换：将现有位图通过在线工具转换为SVG（注意转换后的文件可能需要手动优化）

前端引入SVG图标的三种方式

方式一：直接内联到HTML中这是最灵活的方式，可直接通过CSS控制样式：

方式二：作为图片资源引入与引入PNG的方式类似，简单快捷但样式可控性较弱：

方式三：使用SVG Sprite雪碧图适合项目中有大量图标的场景，可减少HTTP请求：

<svg xmlns="http://www.w3.org/2000/svg" style="display: none;"> <symbol id="icon-user" viewBox="0 0 24 24"> <path d="M12 12C14.21 12 16 10.21 16 8C16 5.79 14.21 4 12 4C9.79 4 8 5.79 8 8C8 10.21 9.79 12 12 12ZM12 14C9.33 14 4 15.34 4 18V20H20V18C20 15.34 14.67 14 12 14Z"/> </symbol> <symbol id="icon-settings" viewBox="0 0 24 24"> <path d="M19.14,12.94c0.04-0.3,0.06-0.61,0.06-0.94c0-0.32-0.02-0.64-0.07-0.94l2.03-1.58c0.18-0.14,0.23-0.41,0.12-0.61 l-1.92-3.32c-0.12-0.22-0.37-0.29-0.59-0.22l-2.39,0.96c-0.5-0.38-1.03-0.7-1.62-0.94L14.4,2.81c-0.04-0.24-0.24-0.41-0.48-0.41 h-3.84c-0.24,0-0.43,0.17-0.47,0.41L9.25,5.35C8.66,5.59,8.12,5.92,7.63,6.29L5.24,5.33c-0.22-0.08-0.47,0-0.59,0.22L2.74,8.87 C2.62,9.08,2.66,9.34,2.86,9.48l2.03,1.58C4.84,11.36,4.8,11.69,4.8,12s0.02,0.64,0.07,0.94l-2.03,1.58 c-0.18,0.14-0.23,0.41-0.12,0.61l1.92,3.32c0.12,0.22,0.37,0.29,0.59,0.22l2.39-0.96c0.5,0.38,1.03,0.7,1.62,0.94l0.36,2.54 c0.05,0.24,0.24,0.41,0.48,0.41h3.84c0.24,0,0.44-0.17,0.47-0.41l0.36-2.54c0.59-0.24,1.13-0.56,1.62-0.94l2.39,0.96 c0.22,0.08,0.47,0,0.59-0.22l1.92-3.32c0.12-0.22,0.07-0.47-0.12-0.61L19.14,12.94z M12,15.6c-1.98,0-3.6-1.62-3.6-3.6 s1.62-3.6,3.6-3.6s3.6,1.62,3.6,3.6S13.98,15.6,12,15.6z"/> </symbol> </svg>

<svg class="icon" width="24" height="24"> <use xlink:href="#icon-user"></use> </svg>

给SVG图标添加动画效果

SVG的强大之处在于支持丰富的动画，比如给图标加个旋转效果：

.icon-rotate { animation: rotate 2s linear infinite; }

@keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

SVG图标使用的最佳实践

优化SVG文件体积

删除冗余代码：导出的SVG可能包含大量无关的注释、属性，可通过SVGOMG等工具压缩
合并路径：将多个小路径合并为一个，减少代码量
使用 viewBox 属性：去掉固定的 width 和 height ，通过 viewBox 实现自适应缩放

避免这些常见误区

不要滥用位图转SVG：复杂位图转换后的SVG体积可能比原图更大，效果也不佳
注意兼容性：低版本IE对SVG的支持有限，可通过降级方案或polyfill处理
避免内联过多大尺寸SVG：大量内联SVG会增加HTML文件体积，影响首屏加载速度

常用工具与资源推荐

图标库：Iconfont（阿里图标库）、Font Awesome、Remix Icon
压缩工具：SVGOMG、SVG Cleaner
编辑工具：Figma、Inkscape、Affinity Designer
在线生成工具：SVG Repo、Flaticon

结语

从位图到SVG，不仅仅是图标的格式切换，更是前端开发理念的升级——追求更优的性能、更灵活的可控性、更极致的用户体验。

SVG图标凭借其矢量特性、轻量体积和高度可定制性，已经成为现代前端开发的标配。它不仅能帮我们解决多端适配的痛点，还能让图标真正融入前端工程化体系，与代码、样式无缝协作。

现在，每当我开始一个新的前端项目，第一件事就是搭建SVG图标体系。这已经成为我的开发习惯，也是我推荐给所有前端开发者的最佳实践。

SVG图标的魅力在于：无限缩放不失真，轻量灵活可定制，简单高效易维护。

开始使用SVG图标吧，你会发现前端开发的体验会提升一个档次！

Docker：轻量级容器化技术的实战指南

Wed, 19 Nov 2025 00:00:00 GMT

前言

最近这段平常的学习空闲时间，闲来无事，回顾我这些年的开发历程，从最初的手动部署环境，到使用虚拟机，再到现在的容器化技术，真是感慨万千。记得刚开始工作的时候，每次为新项目配置开发环境都是一场噩梦——不同项目需要不同版本的依赖，经常出现"在我机器上能跑"的经典问题。

后来接触了虚拟机，虽然解决了环境隔离的问题，但虚拟机太重了，启动慢，占用资源多，迁移也不方便。直到我发现了Docker这个神器，才真正体会到什么是"一次构建，到处运行"的便利。

作为一个Coder，怎么能不掌握Docker呢？这相当于是你在云时代的生存技能，是团队协作的基石，更是现代应用部署的标准配置。

所以在其我的开发流程中，Docker已经成为了不可或缺的一部分。它不仅让我摆脱了环境配置的困扰，还让我的应用部署变得异常简单和可靠。

让我们开始吧

首先我们需要用到下列东西

能够独立思考的大脑 x 1：用于理解Docker的核心概念和解决可能遇到的问题
Docker Desktop x 1：Windows/Mac用户可以直接下载这个集成环境，Linux用户需要单独安装Docker引擎
Docker Hub账号 x 1：用于拉取和推送镜像，类似于GitHub之于代码
**Git版本控制工具(链接1)** x 1：用于管理你的Dockerfile和docker-compose.yml文件
一个好奇的心 x 1：Docker的世界很有趣，值得你深入探索

Docker是什么？为什么需要它？

Docker是一个开源的容器化平台，它让你能够将应用及其所有依赖打包到一个轻量级、可移植的容器中。与传统的虚拟机不同，Docker容器共享主机操作系统内核，因此更加轻量级和高效。

Docker的核心优势：

轻量级：容器启动秒级完成，资源占用少
可移植性：一次构建，到处运行
隔离性：每个容器都是独立的运行环境
效率：比虚拟机更高效，性能损失小

快速上手Docker

1. 安装Docker

Mac/Windows用户：

直接下载Docker Desktop并安装，按照向导完成设置即可。

Linux用户(Ubuntu为例)：

# 卸载旧版本
sudo apt-get remove docker docker-engine docker.io containerd runc

# 安装必要依赖
sudo apt-get update
sudo apt-get install \
    ca-certificates \
    curl \
    gnupg \
    lsb-release

# 添加Docker官方GPG密钥
sudo mkdir -p /etc/apt/keyrings
curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /etc/apt/keyrings/docker.gpg

# 设置仓库
echo \
  "deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.gpg] https://download.docker.com/linux/ubuntu \
  $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null

# 安装Docker引擎
sudo apt-get update
sudo apt-get install docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin

# 验证安装
sudo docker run hello-world

2. Docker核心概念

镜像(Image)：只读的模板，包含运行应用所需的代码、运行时、库和环境变量
容器(Container)：镜像的可运行实例
Dockerfile：定义如何构建镜像的文本文件
Docker Hub：官方的镜像仓库，类似于GitHub之于代码

3. 第一个Docker实践：运行一个Nginx web服务器

# 拉取官方Nginx镜像
docker pull nginx

# 运行Nginx容器
docker run -d -p 8080:80 --name my-nginx nginx

# 访问 http://localhost:8080 查看运行结果

就这么简单！你已经成功运行了一个Web服务器。

4. 创建自己的Docker镜像

让我们创建一个简单的Node.js应用的Docker镜像：

1. 项目结构：

my-node-app/
├── app.js
├── package.json
└── Dockerfile

2. Dockerfile示例：

# 使用官方Node.js镜像作为基础镜像
FROM node:18-alpine

# 设置工作目录
WORKDIR /usr/src/app

# 复制package.json和package-lock.json
COPY package*.json ./

# 安装依赖
RUN npm install

# 复制应用源代码
COPY . .

# 暴露端口
EXPOSE 3000

# 定义容器启动时执行的命令
CMD ["node", "app.js"]

3. 构建和运行：

# 在项目目录下构建镜像
docker build -t my-node-app .

# 运行容器
docker run -d -p 3000:3000 --name my-running-app my-node-app

# 访问 http://localhost:3000

Docker Compose：多容器应用管理

对于复杂的应用，通常需要多个服务协同工作（如Web应用+数据库）。这时候就需要Docker Compose了。

docker-compose.yml示例：

version: '3.8'

services:
  web:
    build: .
    ports:
      - "3000:3000"
    depends_on:
      - redis
    environment:
      - NODE_ENV=production

  redis:
    image: redis:alpine
    ports:
      - "6379:6379"

使用方法：

# 启动所有服务
docker-compose up -d

# 查看运行中的服务
docker-compose ps

# 停止并删除服务
docker-compose down

实战技巧和最佳实践

1. Dockerfile优化技巧

使用官方镜像：尽量使用官方维护的镜像
选择合适的基础镜像：如使用alpine版本减小镜像大小
多阶段构建：减小最终镜像大小
合理使用缓存：正确排序Dockerfile指令以利用构建缓存

多阶段构建示例：

# 构建阶段
FROM node:18 AS builder
WORKDIR /app
COPY . .
RUN npm install && npm run build

# 生产阶段
FROM node:18-alpine
WORKDIR /app
COPY --from=builder /app/package*.json ./
COPY --from=builder /app/dist ./dist
RUN npm install --production
EXPOSE 3000
CMD ["node", "dist/app.js"]

2. 常用命令速查

# 镜像相关
docker images                  # 列出所有镜像
docker pull <image>            # 拉取镜像
docker rmi <image>             # 删除镜像

# 容器相关
docker ps                      # 列出运行中的容器
docker ps -a                   # 列出所有容器
docker run [options] <image>   # 运行容器
docker start/stop/restart <container>  # 控制容器
docker exec -it <container> /bin/bash  # 进入容器
docker logs <container>        # 查看容器日志
docker rm <container>          # 删除容器

# 镜像构建
docker build -t <tag> .        # 构建镜像

# 清理
docker system prune            # 清理无用资源

3. 数据持久化

容器是临时的，要持久化数据需要使用卷(volumes)或绑定挂载(bind mounts)：

# 创建卷
docker volume create my-volume

# 运行容器并挂载卷
docker run -d -v my-volume:/app/data my-image

# 或者使用绑定挂载(宿主机目录映射到容器)
docker run -d -v /host/path:/container/path my-image

结语

Docker真的改变了我的开发方式。它不仅解决了环境一致性的问题，还让部署变得如此简单。还记得我第一次在生产环境使用Docker部署应用时，那种"无论在哪里都能完美运行"的安心感，是传统部署方式无法给予的。

作为一个Coder，掌握Docker不仅仅是为了部署应用，更是为了理解现代软件架构和DevOps实践的基础。它让我们能够更专注于业务逻辑的开发，而不是环境配置的琐事。

现在，每当我开始一个新项目，第一件事就是写Dockerfile和docker-compose.yml。这已经成为了我的标准工作流程，也是我推荐给所有开发者的最佳实践。

Docker的魅力在于：一次构建，到处运行；简单配置，复杂管理；小而强大，轻而可靠。

开始使用Docker吧，你会发现它将成为你开发工具箱中不可或缺的利器！

使用Cloudflare部署你的免费网站统计 -- Web-Analytics

Sat, 18 Oct 2025 00:00:00 GMT

前言

我的博客部署在 Cloudflare Pages 上，Cloudflare 作为 “赛博菩萨” 免费提供边缘服务器托管网站，还提供了 Web-Analytics 供站长查看网站统计数据。

这一切看似不错，但在其他设备上查看数据时，需要登录 Cloudflare 并逐层打开菜单，非常不便，且数据仅限自己查看。经过一番搜索，我发现了一个 GitHub 开源项目可以解决这个问题。

一、HanAnalytics 特点

::github{repo="uxiaohan/HanAnalytics"}

Han-Analytics 是一个简单的网络分析跟踪器和仪表板，托管在被称为 “赛博菩萨” 的 Cloudflare 上，可无成本稳定运行，每天可达 10 万次免费统计。无需域名、服务器、数据库，托管在 Cloudflare Pages 上即可快速部署网站分析仪表板。

二、实测部署

通过阅读 GitHub 仓库的 Readme.md，我了解到其作用和部署教程，于是准备尝试。

需要准备：

• CloudFlare 账号 x1

• Github 账号 x1

• 能用的大脑🧠 x1

• 良好的网络环境 x1

1. Fork 仓库

首先进入 HanAnalytics 的 GitHub 仓库

::github{repo="uxiaohan/HanAnalytics"}

然后点击 “Use this template”，在弹出的菜单中选择 “Create a new repository”

之后根据自身需求选择是否公开仓库。

2. 登录 CloudFlare

进入 Cloudflare 主页后，按照提示点击左侧 “计算和 AI” 菜单，在二级菜单中点击 “Workers 和 Pages”

进入 Workers 和 Pages 页面后，点击右侧 Account ID 进行复制备用

3. 创建 Cloudflare API token

访问Cloudflare API token页面，按照操作截图指引创建 API token 并保存备用。创建时需注意权限配置，确保能满足 HanAnalytics 的运行需求。

4. 开启分析引擎

在 Cloudflare 中，点击 Analytics Engine，填写下面的信息

# 变量名
AnalyticsBinding
# 数据集
AnalyticsDataset

5. 创建 Pages 项目

# Cloudflare Workers ID
CLOUDFLARE_ACCOUNT_ID = 你的 Cloudflare Workers ID
# 你的 Cloudflare API token
CLOUDFLARE_API_TOKEN = 你的 Cloudflare API token
CLOUDFLARE_WEBSITE_PWD = # 网站访问密码 (不设置即无需密码访问)
CLOUDFLARE_WEBSITE_WHITELIST = # 可统计的白名单 
格式：  域名,WebSite|域名,WebSite，多个站点使用|分隔 例如：api.vvhan.com,Hello-Han-Api|www.vvhan.com,Hello-HanHexoBlog  (不设置即允许任何统计)

完成后部署项目。

6. 配置绑定

Cloudflare Pages 部署完成后，在项目的 “设置” 中配置 “绑定”，添加 “Analytics Engine”，变量名称填写 “AnalyticsBinding”，数据集填写 “AnalyticsDataset” 并保存，然后重新部署。

7. 访问仪表板

重新部署完成后，访问 https://xxxxxx.pages.dev 即可访问网站分析仪表板（注意：首次部署生成的域名可能需要几分钟时间生效，请耐心等待）。

本站演示:https://analytics.lenmei233.top/

三、集成到网站

部署成功后，首次打开页面没有数据，需要集成到自己的网站。在网站底部插入以下代码即可：

// 在网站底部插入以下代码即可集成网站分析仪表板
<script defer src="https://xxxxxx.pages.dev/tracker.min.js" data-website-id="自定义网站唯一标识"></script>

当出现有效访问后，再次打开仪表板页面即可看到数据。

四、功能补充

HanAnalytics 还新增了 “密码访问” 及 “网站白名单” 功能。开启密码后，输入密码才可访问（默认无需密码）；网站白名单功能开启后，只有加白的网站才可计入统计（默认任意网站都可统计）。

五、数据相关说明

数据问题一般是由于 Cloudflare Analytics Engine 无法访问网站导致的，请确保网站可以正常访问，并且 Cloudflare Analytics Engine 已经开启。

HanAnalytics 使用 Cloudflare Analytics Engine 数据集，完全通过 HTTP 使用 Cloudflare 的 API 进行通信，数据来源于 Cloudflare Analytics Engine 数据集。Cloudflare Analytics Engine 使用抽样技术，以可承受的规模化方式实现大量数据提取 / 查询（这类似于大多数其他分析工具，如 Google Analytics 上的抽样）。

Leapcell 免费云容器实测：能否替代 Cloud Run,Vercel？

Fri, 03 Oct 2025 00:00:00 GMT

前言

作为一名常年折腾各类云部署工具的开发者，我始终在寻找更高效、更经济的项目上线方案。今天在浏览技术社区时，一个号称 “Cloud Run/Vercel 完美替代品” 的免费云容器平台 ——Leapcell，瞬间吸引了我的注意力。其官网明确标注 “永久免费”“GitHub 一键部署” 等核心卖点，这对于个人开发者和小型项目来说无疑是巨大诱惑。带着 “它是否真能替代主流平台” 的疑问，我展开了本次实测。

一、Leapcell 核心特点速览

在开始测试前，先梳理下 Leapcell 官方宣传的核心优势，也为后续实测提供对比依据：

永久免费无套路：无需试用到期、无需升级付费，明确标注 “永久免费”，对预算有限的个人开发者和小型项目友好，能直接降低部署成本。
GitHub 一键部署：深度集成 GitHub，支持直接关联仓库快速部署，省去手动配置服务器、上传代码的繁琐步骤，大幅缩短项目上线周期。
轻量可移植：基于容器技术，将应用及依赖完整打包，可在不同操作系统、云平台间无缝迁移，灵活性远超传统虚拟机部署。
快速部署与弹性扩展：容器启动速度快，部署流程自动化；支持通过编排工具实现弹性伸缩和负载均衡，能应对突发流量波动。
高效资源利用：容器共享宿主机操作系统内核，避免资源冗余，同时保持相互隔离，兼顾资源利用率与安全性。

二、实测过程：从访问到部署的全记录

1. 初始访问：先遇 “门槛”

首先打开 Leapcell 官网（https://leapcell.io），但页面始终无法加载。通过 ping 测试发现，其服务器在中国区域全部无法访问，必须借助 “魔法上网” 才能正常打开 —— 这一点从一开始就与 Vercel 形成差距，后者无需特殊工具即可在国内访问，显然 Leapcell 若想成为 “替代品”，在访问门槛上先失一分。

成功打开官网后，首页醒目的 “免费部署你的项目” 标语极具吸引力，简洁的界面也让操作预期变得清晰，接下来便是注册账号进入实测环节。

2. 项目部署：GitHub 关联 + 框架适配很贴心

注册并登录账号后，进入 “创建服务” 页面，我选择了自己博客的 GitHub 仓库（基于 Astro 框架）进行测试。令人惊喜的是，Leapcell原生支持 Astro 项目，且自动识别并填写好了部署参数（如构建命令、输出目录等），无需手动配置 —— 对于不熟悉部署细节的开发者来说，这种 “无脑操作” 的体验非常友好。

确认参数无误后，直接点击 “Deploy” 按钮，平台开始自动拉取代码、构建项目。从部署日志来看，整个过程流畅无报错，进度条实时更新，最终耗时约 2 分钟完成部署，速度处于同类平台的中上水平。

3. 部署完成：仪表盘与访问体验

部署成功后，自动跳转至服务仪表盘，界面清晰展示了服务状态、部署记录、访问统计等信息，便于后续管理。点击仪表盘提供的默认域名（格式为 xxx.leapcell.app），在 “魔法上网” 状态下，页面加载速度很快，博客的静态资源、动态交互均正常显示，无卡顿或样式错乱问题。

为了进一步验证访问情况，我进行了国内多线路测速（结果如下图），发现未使用 “魔法” 时，国内地区无法访问，与 Vercel 的国内访问体验（延迟约 100-200ms）差距明显。

4. 自定义域名绑定：操作简单但效果有限

考虑到实际使用中通常会绑定自定义域名，我尝试将自己的域名（lenmei.eu.org）关联到 Leapcell 服务。在 “域名管理” 页面，按照提示添加 DNS 记录后，等待约 10 分钟完成解析。绑定后通过自定义域名访问，在 “魔法” 加持下速度依旧流畅，但国内无 “魔法” 访问时，仍面临无法打开的问题 —— 这说明域名绑定仅解决了 “域名个性化”，并未改善国内访问体验,对比Vercel只需要绑定域名即可正常访问,这一点决定无法替代Vercel。

三、实测总结：优势明显但短板突出

1. 值得肯定的亮点

免费无门槛：永久免费政策真实有效，无隐藏收费项，适合个人测试、小型静态项目（如博客、作品集）使用。
部署体验佳：GitHub 一键关联、框架自动适配、部署流程自动化，对新手友好，能大幅提升部署效率。
管理便捷：仪表盘功能清晰，服务状态、访问数据一目了然，日常维护成本低。

2. 无法忽视的短板

国内访问受限：必须使用 “魔法上网” 才能正常访问，且国内无加速节点，完全无法满足面向国内用户的项目需求 —— 这是其无法替代 Vercel 的核心瓶颈。
功能丰富度不足：对比 Vercel，Leapcell 缺少边缘缓存、国内 CDN、Serverless 函数等进阶功能，对于复杂项目的支持有限。

3. 适用场景与不适用场景

推荐场景：个人开发者的海外项目测试、面向海外用户的静态网站（如英文博客、外贸展示页）、无需国内访问的学习类项目。
不推荐场景：面向国内用户的项目、需要高可用性的生产环境、依赖边缘计算或 Serverless 的复杂应用。

结语

Leapcell 作为一款免费云容器平台，在部署便捷性、成本控制上表现亮眼，确实能满足部分海外导向的开发需求。但受限于国内访问门槛和功能丰富度，它目前无法真正替代 Vercel 或 Cloud Run，尤其是对于需要服务国内用户的开发者来说，仍需选择更贴合国内网络环境的平台。

若未来 Leapcell 能新增国内节点、优化访问体验，或许能成为更具竞争力的选择。但就目前而言，它更适合作为 “备用部署工具”，而非主力平台。

Hello-Fuwari

Wed, 01 Oct 2025 00:00:00 GMT

前言

最近国庆假期闲来无事，前段时间我的Typecho搭建的博客的服务商跑路了，导致我失去了我的博客。之前的博客也没什么内容，倒也不感觉可惜，但身为一个Coder，怎么能没有自己的博客呢？这相当于是你在互联网上的存在证明，是交友的渠道，也是精神的延续。

所以其实在我的博客消失后，我就计划用一个更稳定的方案搭建新博客。因为本人经济实力不足，无力长期购买服务器，且本着“能不花钱就不花钱”的原则，果断抛弃了动态博客——像Wordpress、Typecho这类系统虽好，但依赖服务器（至少需要PHP环境），因此我选择了静态博客方案。

于是我通过Google搜索了解到，目前主流的静态博客方案有Hexo、Vitepress、Vuepress等。我简单折腾了一下发现，想要配置一个好看、易上手的博客其实很麻烦：不仅要安装各种环境，关键是配置周期长，无法及时看到效果，导致我在配置阶段就失去了耐心。

直到一次偶然的机会，我发现了Fuwari这个静态博客框架，而且那篇介绍文章还提供了详细教程（原文链接）。我跟着教程快速上手，很快就搭建出了一个“能让人看到无限可能”的博客雏形。

让我们开始吧

首先我们需要准备这些工具

能够独立思考的大脑 x 1：用于看懂本文，以及独立解决可能遇到的问题
Github账号 x 1：用于Fork仓库和存储博客代码
Git 版本控制工具 x 1：用于将Github仓库克隆到本地，以及后续上传博客内容
Node.js x 1：Fuwari基于Node.js开发，需安装此环境才能运行
Cloudflare账号 x 1：用于将博客部署到Cloudflare Pages，同时获取免费SSL证书等服务
Obsidian x 1：一款非常好用的Markdown编辑器，能实时预览文本效果，用来写博客刚刚好

第一步：Fork Fuwari仓库

登录你的Github账号
访问Fuwari的官方模板仓库：https://github.com/saicaca/fuwari
点击仓库页面右上角的「Fork」按钮（如下图）
跳转后无需修改其他配置，直接点击绿色的「Create fork」按钮即可（注：若已Fork过，此按钮会显示为「Sync fork」）
进入你Fork后的仓库页面，点击绿色的「Code」按钮，复制弹出窗口中最上方的Git地址（示例：https://github.com/你的用户名/fuwari.git）

第二步：本地部署环境

在电脑上新建一个文件夹（如命名为「blog」），用于存放博客代码
打开终端，通过cd 文件夹路径命令导航到这个新建文件夹（例：cd /Users/你的用户名/Documents/blog）
在终端执行刚才复制的Git命令，克隆仓库：git clone https://github.com/你的用户名/fuwari.git（网络稳定的情况下，等待克隆完成后，文件夹内会出现「fuwari」子文件夹）
安装pnpm包管理工具：在终端执行npm install -g pnpm（全局安装，后续可重复使用）
进入Fuwari项目根目录：cd fuwari
安装项目依赖：依次执行pnpm install和pnpm add sharp（sharp用于处理图片资源，是Fuwari的必要依赖）
完成以上步骤后，本地环境就搭建好了，可通过后续命令预览博客效果

最后，你可以参考Fuwari官方仓库的Readme.md，进行博客的基础配置（如修改站点名称、作者信息等）。

配置后常用命令汇总

1. 新建文章

pnpm new-post <你的文章标题>

执行后会在项目根目录的 src/content/posts 文件夹中，自动生成一个名为「你的文章标题.md」的文件。

2. 本地调试（预览效果）

pnpm dev

执行后终端会显示本地访问地址（通常是 http://localhost:4321），打开浏览器访问即可实时预览博客效果，修改内容后页面会自动刷新。

3. 构建生产版本

pnpm build

将博客构建为可部署的静态文件，输出到项目根目录的 ./dist/ 文件夹中（部署时需上传此文件夹内的内容）。

4. 配置Git全局账号（首次使用Git需执行）

git config --global user.name "你的Github用户名"
git config --global user.email "你的Github注册邮箱"

5. 上传代码到Github（更新博客后）

提交所有修改的文件：git add .（注意末尾的点，表示“所有文件”）
添加提交说明：git commit -m "你的提交信息"（示例：git commit -m "新增Hello-Fuwar文章"）
推送到远程仓库：git push（首次推送可能需要输入Github账号密码或Token，按提示操作即可）