请不要使用 HTMX

发布: (2026年1月5日 GMT+8 22:43)
6 min read
原文: Dev.to

Source: Dev.to

(请提供需要翻译的正文内容,我才能为您将其翻译成简体中文。)

人们对 HTMX 的评价

当人们谈论 HTMX 时,通常会说:

  • “你不再需要前端框架了”
  • “只在服务器上编写 HTML”
  • “更少的 JavaScript 更好”
  • “它更简洁、更清晰”

说实话,这听起来很诱人。如果你厌倦了复杂的工具,HTMX 就像一股清新的空气。所以我尝试了一下。

第一个问题:看到更改很慢

当我使用现代前端工具时,会出现以下情况:

I save my file → the screen updates right away

使用 Go + HTMX 时,通常感觉是这样的:

I save my file
→ I stop the server
→ I start the server again
→ I refresh the browser
→ now I see the change

这对于一个微小的更改来说步骤太多了。

是的,有一些工具可以帮助:

  • tools that restart the server for you
  • tools that refresh the browser for you

但你仍然需要自己设置所有这些。现代前端工具已经为你完成了这些。

HTMX workflow illustration

Tailwind 问题(为什么我的样式不显示)

在使用 Tailwind 进行样式设计时,我倾向于只构建项目实际使用到的类,以避免打包完整的 CSS 包。但 Tailwind 只能识别在它运行时已经存在的样式。初始构建完成后,后续的更改可能会包含未定义的 CSS 类。

使用 HTMX 时:

  • HTML 被拆分成许多小片段
  • 某些部分只会偶尔出现
  • 新的样式会在后面才加入

于是经常会出现这种情况:

“为什么我的新样式不起作用?”

通常的答案是:

  • Tailwind 没有检测到该样式
  • 你忘记重新构建 CSS
  • 或者该样式只在特定情况下出现

可以解决这个问题,但必须:

  • 以 watch 模式运行 Tailwind
  • 仔细配置它
  • 记住一些特殊规则

这比人们承认的要多思考。

HTML Starts Simple… Then Gets Complicated

HTMX 让简单的事物变得非常好。一个小按钮看起来简洁且易用。但真实的应用并不小。真实的应用拥有:

  • 加载状态
  • 错误信息
  • 权限
  • 条件
  • 可复用的组件

于是你的 HTML 会慢慢变成:

  • 更长
  • 更难阅读
  • 充满逻辑

你并没有消除复杂性;你只是把它移到了 HTML 中。这并不坏——只是一件需要了解的事。

“旧网页”并不总是更好

人们说 HTMX 有“旧网页”的感觉。旧网页:

  • 经常刷新整个页面
  • 感觉很慢
  • 当遇到困难时仍然使用 JavaScript

HTMX 并不是旧网页。它是一种将旧理念与新理念混合的全新事物,而混合总会带来权衡。

人们推荐 HTMX 太快

有件事让我很困扰,那就是这种模式:

  1. 你说:“我在这个问题上遇到困难。”
  2. 有人回复:“直接用 HTMX 吧。”

没有提问。没有上下文。没有思考。HTMX 不是魔法。它是一个工具,只有在适合工作时才好用。

为什么我暂时不使用 HTMX (Yet)

我并不是因为 HTMX 本身不好而回避它。我暂时回避它是因为:

  • 我喜欢即时看到变化
  • 重新启动会打断我的思路
  • HTML 很快就会变得凌乱,超出预期
  • 样式的处理比宣传的要更费心

这并不意味着 HTMX 错误;只是不总是最佳选择。

当 HTMX 真正出色时

HTMX 在以下场景中表现出色:

  • 表单
  • 仪表盘
  • 管理页面
  • 内部工具
  • 简单的业务应用

如果你正在构建这些,你可能会喜欢它。如果你在构建:

  • 高度交互的页面
  • 华丽的动画
  • 快速变化的设计

你可能不喜欢。这也没关系。

真正的要点

这篇文章并不是在说“不要使用 HTMX”。它的意思是:

“请不要把 HTMX 当作万灵药。”

我可能以后还会再次使用 HTMX——只不过不是因为有人告诉我应该这么做。

Back to Blog

相关文章

阅读更多 »

Web 开发再次变得有趣

抱歉,我需要您提供要翻译的具体文本内容,才能为您进行翻译。请粘贴您想要翻译的摘录或摘要,我会尽快为您翻译成简体中文。

React 组件中的 TypeScript 泛型

介绍:泛型并不是在 React 组件中每天都会使用的东西,但在某些情况下,它们可以让你编写既灵活又类型安全的组件。