HTML 也能做到这一点
现代 HTML 和 CSS 现在已经能够原生处理更多交互——比如对话框、弹出层、分组 `<details>`、响应式图片,甚至某些手风琴和选项卡式 UI——这让许多开发者开始质疑:对于常见界面来说,重量级 JavaScript 框架或 SPA 是否真的有必要。评论者强调了真实的收益:更快的服务端渲染页面、更好的基础可访问性,以及更简单的架构,这些在用户阻止 JavaScript 或无法使用 JavaScript 时仍然可用。与此同时,他们也指出了棘手之处和空白——例如 `<datalist>` 和日期选择器支持零散、样式与 UX 控制有限,以及对可排序表格或更强大的组合框等更丰富组件的需求——认为 HTML 可以取代今天基于 JS 的一部分模式,但不是全部。
原生 HTML 小部件的能力与局限
- 许多人对仅靠“HTML + CSS”如今就能实现这么多交互性感到惊讶(对话框、弹出层、
details、视图过渡)。 - 也有人强调某些功能仍然“差不多了”:例如,
datalist缺乏强约束值、模糊搜索,而且浏览器支持并不稳定。 - 原生日期选择器也常被批评有 bug、在不同浏览器/操作系统间不一致,并且很容易被密码管理器破坏。
隐藏内容、<details> 与可搜索性
hidden="until-found"和<details>因为允许用 CTRL+F 直接展开折叠内容而受到称赞(FAQ、组织结构图、选项卡式内容)。- 用例包括“查看条款/排除项”面板、可折叠树,以及“跳转到内容”模式(不过这个更适合通过焦点样式来解决)。
- 关于分组/手风琴行为存在争论:有人希望一次只能打开一个
<details>;另一些人(引用 UX 研究)则认为自动关闭很烦。
SPA、JavaScript 与“以 HTML 为先”的方案
- 一些用户运行 NoScript,并会根据网站需要多少第三方 JS 来评价它们;他们更喜欢那些基本不靠 JS 也能工作的站点。
- 许多人不喜欢 SPA,因为它们会破坏 URL、后退按钮和书签;也有人指出,这可以通过正确的路由和 URL 更新来解决。
- 大家对“服务端渲染 + 点缀式增强”的模式很有热情(HTMX、最少量 JS、View Transition API),也有人尝试完全不使用 JS 的 UI。
对话框、弹出层与声明式动作
- 新的 popover/dialog/command 属性因其一致的焦点处理、堆叠、可访问性,以及无需 JS 的菜单/提示/确认而受到称赞。
- 批评者认为声明式动作 API(
popovertarget、...action)把 HTML 搞得比简单的 JS 事件处理器更复杂。 - 支持者则认为它能更快达到可交互状态、带来更好的 SSR,以及无需脚本的交互;脚本属性可以被禁用,因此声明式绑定很有用。
表格、排序与布局 vs 语义
- 有人希望原生支持可排序表格,甚至内建虚拟化;也有人坚持“这就是 JS 的用途”,并担心浏览器膨胀。
- 通过表头链接进行服务端排序被认为简单且仍然高性能;另一些人则希望支持多列、无需刷新排序。
- 还有一个分歧:HTML 是结构/语义,还是布局。有人认为标签本身就隐含描述了布局;也有人引用规范称布局属于 CSS。
日期、表单与本地化
- 有人要求强制 ISO 日期格式,或与页面的
lang保持一致;当前操作系统原生格式会让用户和后台流程感到困惑。 - 建议包括:让
<time>真正本地化显示,或者始终以 ISO 提交,同时一致地显示本地化格式。
浏览器支持、采用与工具链
- 有人担心不断增长的标准面会让新引擎难以构建;即便功能已受支持,一些人仍对采用新特性持保留态度。
- 据说 LLM 和代码生成器在新的 HTML/CSS API 上也跟得较慢,这强化了旧的、重 JS 的模式,不过“技能”和指导可以缓解这一点。
杂项
- 还讨论了响应式图片(
srcset、<picture>);<picture>被认为比单独使用srcset更灵活。 - 原生控件如
<select>和颜色输入框之所以使用不足,部分原因是它们很难在不同平台上统一样式。