Mesh: I tried Htmx, then ditched it
8 months ago
- #HTMX
- #Web Development
- #Modular SSR
- 作者探讨了当前Web开发中减少JavaScript使用、转而采用HTML属性实现交互性的趋势，并以HTMX作为典型示例。
- 尽管欣赏HTMX的理念，作者批评其缺乏结构性，将其比作『声明式jQuery』，并预见到可能导致代码混乱的风险。
- 针对HTMX的不足，作者开发了MESH（服务端渲染模块化元素水合方案），追求以结构化、组件化的方式实现每个组件对应单一端点。
- MESH整合了服务端渲染与水合技术，采用Web Components和声明式Shadow DOM（DSD），但遭遇HTMX在shadow DOM边界处理上的局限性。
- 作者探索了组件通信与更新的解决方案，包括『带外交换』（OOB）和服务器推送事件（SSE）以实现实时协作，最终通过完全移除HTMX简化架构。
- 最终方案基于自定义元素实现模块化服务端渲染，配合极简JavaScript处理表单和SSE，形成更清晰、更易维护的代码结构。
- 作者总结指出，HTMX适合特定场景，而MESH为模块化服务端渲染提供了更结构化且后端无关的实现路径，其理念与HotWire、LiveView等框架一脉相承。