htmx：当后端开发者受够了 React 之后

前言

如果你是一个后端开发者，你一定经历过这样的痛苦：为了做一个简单的表单提交，你需要搭建 React 项目、配置 Webpack、写 useState、useEffect，最后才发现——你只是想让一个按钮点击后刷新一段 HTML。

htmx 就是为了解决这个问题而生的。

htmx 是什么？

htmx 是一个极小的 JavaScript 库（约 14KB gzip），它的核心理念很简单：让 HTML 自己发请求，自己更新自己。

不需要写 JavaScript，不需要虚拟 DOM，不需要状态管理。你只需要在 HTML 属性里声明：这个元素点击后，请求哪个 URL，把返回的 HTML 放在哪里。

<button hx-post="/api/like" 
        hx-target="#like-count" 
        hx-swap="innerHTML">
  👍 点赞
</button>
<span id="like-count">42</span>

点击按钮 → 发 POST 请求 → 服务端返回新的数字 → 替换 #like-count 的内容。完事了。没有 fetch，没有 setState，没有 re-render。

为什么 htmx 在 2026 年火了？

1. 前端疲劳是真实的

一个简单的 CRUD 应用，用 React 全家桶做需要：React + React Router + Redux/Zustand + Axios + Vite + TypeScript 配置。用 htmx？一个 <script> 标签就够了。

2. 服务端渲染的回归

随着 Next.js Server Components、Rails Hotwire、Laravel Livewire 的流行，大家开始意识到：不是所有页面都需要 SPA。htmx 把这个思路推到了极致——服务端返回 HTML 片段，前端只负责替换 DOM。

3. 后端语言的春天

用 htmx，你可以用任何后端语言构建交互式 Web 应用。Go、Python、Rust、Java——不再被迫学 React。你的模板引擎就是你的前端框架。

实战：用 Go + htmx 做一个实时搜索

// main.go
func searchHandler(w http.ResponseWriter, r *http.Request) {
    query := r.URL.Query().Get("q")
    results := searchDatabase(query)
    
    // 直接返回 HTML 片段
    for _, item := range results {
        fmt.Fprintf(w, `<div class="result">%s</div>`, item.Title)
    }
}

<input type="search" 
       name="q"
       hx-get="/search" 
       hx-trigger="keyup changed delay:300ms" 
       hx-target="#results"
       placeholder="搜索...">
<div id="results"></div>

输入时自动搜索，300ms 防抖，结果实时显示。整个前端逻辑：0 行 JavaScript。

htmx 的核心属性

属性	作用
hx-get/post/put/delete	发起对应 HTTP 请求
hx-target	指定响应内容插入的目标元素
hx-swap	控制内容替换方式（innerHTML、outerHTML、beforeend 等）
hx-trigger	自定义触发事件（click、submit、keyup、intersect 等）
hx-indicator	请求进行中显示的加载指示器
hx-confirm	操作前弹出确认框

什么场景适合 htmx？

适合：

• 管理后台、内部工具
• 内容型网站（博客、文档、论坛）
• 表单密集型应用
• 快速原型开发
• 后端团队主导的项目

不适合：

• 重交互的 SPA（如 Figma、Google Docs）
• 需要复杂客户端状态管理的应用
• 离线优先的 PWA

和其他方案的对比

• vs React：htmx 不是 React 的替代品，而是 React 的解药——治疗过度工程化。
• vs Hotwire：理念相似，但 htmx 不绑定任何后端框架，更灵活。
• vs Alpine.js：Alpine 处理客户端交互，htmx 处理服务端交互，两者可以配合使用。

总结

htmx 的哲学是：大部分 Web 应用不需要那么复杂的前端。 当你发现自己在写一堆 JavaScript 只是为了从服务器拿数据然后显示出来时，也许是时候试试 htmx 了。

记住 htmx 作者 Carson Gross 的那句话：

"JavaScript is fine. The problem is when you use it to do things HTML should be doing."

试试看，你可能会爱上这种返璞归真的感觉。