首页
学习
活动
专区
圈层
工具
发布
    • 综合排序
    • 最热优先
    • 最新优先
    时间不限
  • 来自专栏农历七月廿一

    聊聊 HTMX

    写在前面 最近看了几篇关于 htmx 的文章,自己也去看了一眼官网,也去油管看了一下当时 htmx 发布会的时候他们的演示,下面说几点我对这个所谓的新型起来的技术的看法, 他的来源是什么 首先说一下他虽然是一个新型的技术 [intercoolerjs](https://intercoolerjs.org/reference.html 进行了一个重写,也就是说在过去intercoolerjs这个玩意就已经可以实现类似 htmx DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>测试 htmx 的用法</title> <script src=". /js/<em>htmx</em>@1.9.5<em>htmx</em>.min.js" integrity="sha384-xcuj3WpfgjlKF+FXhSQFQ0ZNr39ln+hwjN3npfM9VBnUskLolQAcN80McRIVOPuO thead> <tbody id="search-results"> </body> </html> 如果里面的标签不太明白可以看一下他的官网介绍,htmx

    87910编辑于 2023-10-18
  • 来自专栏程序人生

    HTMX:前端的 1984 时刻?

    回归 HTML 初心的 HTMX 虽然我找不到 HTMX 的名字的来源,根据它的愿景,我猜测它有 HTML eXtension 的意思。 低侵入性: HTMX 旨在尽可能少地侵入你的代码。你不需要重写整个应用来开始使用HTMX;相反,你可以只在需要的地方添加一些属性。 与现有技术兼容: HTMX 可以与你已经使用的框架和库无缝地协同工作。无论你是否使用 Flask、Django、Rails 或其他后端框架,HTMX 都可以简单地嵌入其中。 我们先来看看 htmx 下,如何实现典型的前端功能:autocomplete。 不要过于震惊,这一小段代码就是 HTMX 版 autocomplete 的全部代码。 可以看到,HTMX 给普通 HTML 标签增加了几个重要的属性: hx-trigger:用于指定何时以及如何触发一个 htmx 动作,例如 AJAX 调用。

    2.3K30编辑于 2023-09-21
  • 来自专栏前端达人

    htmx,它到底是框架还是库?

    关于htmx是库还是框架的讨论,常常出现在争论之中。有人辩称htmx实际上是一个库,而不是框架。但这种说法可能不太准确。 当你在项目中使用htmx时,你会在HTML中包含htmx的属性(比如hx-post,hx-target),编写以htmx格式化数据(带有特定请求头)来调用的端点,并从这些端点返回htmx期望的格式化数据 如果你在网站的许多网络请求中使用htmx,那么引入htmx对项目结构的影响是显著的,从如何构建前端标记到端点进行的数据库查询,htmx的加入都会对整个应用程序架构产生深远影响。 实际上,很多开发者在他们的应用中使用htmx,都是在遵循htmx的框架式要求,将其作为构建超媒体应用的一个框架。 使用htmx最有效的方式是顺应它的优势。 是的,htmx可以作为库使用,但让它成为你的框架可能会更好。 htmx的独特优势:HTML 尽管htmx在很多情况下被当作一个框架使用,但这并不意味着它就是“另一个JavaScript框架”。

    84210编辑于 2024-01-25
  • 来自专栏code秘密花园

    React vs HTMX ,谁更适合你?

    HTMX 提升了 HTML 的能力,使其变成了一个全功能的超文本。 我们接下来通过一些 HTMX 的示例,来看看这个库都提供了什么。 HTMX 与 React 对比 前面我们已经知道了什么是 HTMX 以及它是大概是怎么工作的,下面我们让它与 React 大概做个比较。 性能 HTMX:由于其轻量级、无依赖的特性,依赖于 HTMX 的网页通常具有快速的首屏渲染性能。总的来说,对于具有简单交互的应用,HTMX 性能表现良好。 社区 HTMX:由于它在 2020 年底才首次发布,所以 HTMX 肯定不会像 React 那样受欢迎。所以,教程、操作视频并不会很多。 生态系统 HTMX:虽然该库是可扩展的,但项目相对较新, HTMX 的库和工具并不多。在撰写本文时,npm 上的 htmx 标签只有 35 个包。

    2.5K21编辑于 2024-03-02
  • 来自专栏魔术师卡颂

    htmx:后端主导的前端框架是啥样的?

    介绍htmx htmx是一款在Django技术栈最近比较热门的前端框架。 他的理念是 —— 「让网页回归HTML的本质,不再受JS束缚」。是不是很有web1.0的风格? 他是怎么做到的呢? 当你在页面中引入htmx.org.js后,可以在HTML中书写以hx-开头的自定义属性。 所以,他能很好的融入htmx的体系中。 比如下面这段代码是段结合htmx与alpine的HTML,其中以hx-开头的是htmx属性,以x-开头的是alphine属性: <div hx-target="this" hx-ext="alpine-morph 对于页面交互复杂度不高,且是后端主导的项目(不想写JS逻辑),相信<em>htmx</em>会是不错的选择。

    2K30编辑于 2022-11-22
  • 来自专栏追不上乌龟的兔子

    使用纯Python构建Web应用

    最近在研究htmx库的时候突发奇想,利用 htmx 和我之前发布的 Python 库html-dsl应该可以做到只使用 Python 代码构建可交互的 Web 应用。 htmx (由 Github Copilot 生成) htmx 是一个 JavaScript 库,它允许您使用 HTML 扩展现有的 Web 应用程序,而无需编写任何 JavaScript。 htmx 的目标是使 Web 开发更快、更简单、更容易,并提高 Web 应用程序的可访问性。 表单的提交也由 htmx 处理,当用户点击提交按钮时,htmx 会向服务器发送一个 POST 请求,服务器将新的待办项添加到数据库中,然后返回一个待办项列表的 HTML 片段,htmx 将其插入到 todo-list 删除按钮的点击事件由 htmx 处理,当用户点击删除按钮时,htmx 会向服务器发送一个 DELETE 请求,服务器将待办项从数据库中删除,然后返回一个待办项列表的 HTML 片段,htmx 将其插入到

    81830编辑于 2023-10-31
  • 来自专栏终身学习者

    HTMX简介:无需JavaScript的动态HTML

    让我们看看如何使用HTMX以及它的吸引力。 什么是HTMXHTMX已经存在了一段时间,但它一直是一个不太为人知的项目。它最近被接受到 GitHub Accelerato r中可能会改变这一切。 当然,HTMX并没有完全消除这一点,但它已经将工作转移到了服务器上。 HTMX的服务器端 现在,让我们考虑等式的服务器端。 有许多使用HTMX的服务器端技术的例子,因为,正如Gross所说,HTMX是“后端不可知的。它不关心你使用什么后端,只要它产生HTML。” on htmx脚本是 Hyperscript 的一个例子,这是一种简化的脚本语言。它经常与HTMX一起使用,但并不严格属于HTMX或需要使用它。 使用HTMX的客户端模板 HTMX支持的这种模式的一个变种是使用客户端模板。这是一个在客户端运行的层,接受来自服务器的JSON,并在那里进行标记转换。

    2.6K10编辑于 2024-02-12
  • 我们为什么要重新思考服务器端渲染?

    三、HTMX:让服务器“说人话” HTML这时候,HTMX 出现了。HTMX 是什么?一句话:让浏览器接受 HTML 响应并直接替换 DOM 元素,不再需要前端框架做 UI 拼装。 想体验 HTMX?用 ServBay 几分钟搞定环境别看 HTMX 听起来新,其实你本地跑起来一点也不麻烦,只要你有个干净的后端环境就行。 特别适合做以下这些事情: 本地跑一个 Flask + HTMX 项目,快速构建原型页面 对比 Laravel Blade + HTMX 渲染体验 测试后端返回 HTML 的渲染效率 vs JSON HTMX 不是来灭掉 React、Vue 的,它是给那些**“80% 是表格和表单”**的系统一个更轻量的选择:适合 HTMX 的场景: 内部管理后台 CMS 内容系统 企业中后台工具 低频操作但需要快速交付的功能页 HTMX 给了我们这样一种新的方式: 简洁 轻量 可维护 快速响应 如果你也受够了为了一个按钮改三层代码,不妨给 HTMX 一个机会,让服务器“说人话”,让开发回归本质:直接、有效、有趣。

    36630编辑于 2025-07-29
  • 来自专栏深度学习与python

    Htmx意外走红,我们从React“退回去”后:代码行数减少 67%,JS 依赖项从 255 下降到 9

    htmx 的走红 过去Web非常简单。URL 指向服务器,服务器将数据混合成 html,然后在浏览器上呈现该响应。 htmx 出现在 2020 年,创建者 Carson Gross 说 htmx 来源自他于 2013 年研究的一个项目 intercooler.js。 htmx 的实际效果 可以肯定的一点是 htmx 绝对能用,单从理论上讲,这个方法确实值得称道。但软件问题终究要归结于实践效果:效果好吗,能不能给前端开发带来改善? 在 DjangoCon 2022 上,Contexte 的 David Guillot 演示了他们在真实 SaaS 产品上实现了从 React 到 htmx 的迁移,而且效果非常好,堪称“一切 htmx 使用 htmx 时可以配合更大的数据集,超越 React 的处理极限 9. 

    1.5K10编辑于 2023-03-29
  • 来自专栏农民工前端

    Edge浏览器团队宣布放弃React?

    原文地址:https://blog.erodriguez.de/dependency-management-fatigue-or-why-i-forever-ditched-react-for-go-htmx-templ / 原文翻译: 依赖管理疲劳,或者为什么我永远放弃React,转而使用Go+HTMX+Templ 2024年12月3日 在今年开始使用Go+HTMX+Templ进行一些个人项目后,我决定放弃在任何个人项目上使用 实际上,在HTMX官方网站上的文章中,你可以找到很多令人信服的论据,支持放弃React而转向HTMX。但我觉得没有多少人在谈论依赖管理疲劳。 什么是依赖管理疲劳? Go+HTMX+Templ 这可能是我从现在开始在个人项目中只使用Go+HTMX+Templ的主要原因。这可能只是轶事证据,但我参与的Go项目让我专注于发布功能,而不是忽视一般的依赖性/安全性更新。

    35010编辑于 2024-12-20
  • 来自专栏前端Q

    2024 年让我想疯狂学习的几个框架。。

    HTMX - 回归基础 htmx-demo 适合人群: 你希望编写更少的 JavaScript 你希望代码更简单,更专注于 hypermedia(超媒体) HTMX 在 2023 年迅速崛起,在过去一年中获得了超多 HTMX 不是平常的 JS 框架。 如果你在HTMX[2]中工作,你将大部分时间在 hypermedia(超媒体)的世界中度过,以完全不同的视角看待网络开发,而不是我们通常对现代网络开发的重 JS 视角。 HTMX 利用了 HATEOAS(Hypermedia as the Engine of Application State)的概念,使开发人员可以直接从 HTML 访问浏览器功能,而不是使用 JavaScript : https://htmx.org/ [3] Solid.js: https://www.solidjs.com/ [4] Astro: https://astro.build/ [5] 不同的前端框架

    77010编辑于 2024-04-15
  • 来自专栏机器学习与统计学

    回归初心,用纯 Python 构建现代化 Web 应用

    HTMX 驱动的动态交互:fasthtml 的“魔法”很大程度上来源于其深度集成的 HTMX[1]。 HTMX 的魔法:hx-* 属性 HTMX 是 fasthtml 实现动态交互的秘密武器。你只需要在 Python 生成的 HTML 标签上添加一些特殊的 hx-* 属性即可。 通过 htmx,用户可以添加、编辑和删除待办事项,所有操作都会实时反映在页面上,无需刷新整个页面。 客户端的 HTMX 监听到 WebSocket 消息后,会自动用收到的新网格替换掉旧的网格。 参考资料 [1] HTMX: https://htmx.org/

    65221编辑于 2025-07-29
  • 来自专栏HelloGitHub

    效率回归,工具库之美「GitHub 热点速览」

    如果这个没有那么惊艳的话,还有 The-Art-of-Linear-Algebra,重燃了我学习线性代数的自信心;htmx 则是一个被称为“后端工程师的前端库”,可以让人安心用 HTML 搞定页面,同样的 GitHub 地址→https://github.com/facebook/igl 1.2 回归 html:htmx 主语言:JavaScript 一个提升前端开发工作幸福度的工具,有了 htmx,你可以直接通过属性用 此外,htmx 非常轻量(大约 14k min.gz'd)、无依赖、可扩展且兼容 IE11。 以下为示例: <script src="https://unpkg.com/<em>htmx</em>.org@1.9.3"></script> <! hx-post="/clicked" hx-swap="outerHTML"> Click Me </button> GitHub 地址→https://github.com/bigskysoftware/htmx

    56730编辑于 2023-08-19
  • 来自专栏开源服务指南

    实时语音克隆:5 秒内生成任意文本的语音 | 开源日报 No.84

    bigskysoftware/htmx[3] Stars: 14.3k License: BSD-2-Clause picture htmx 是一个为 HTML 提供高级功能的工具。 htmx 体积小巧 (压缩后约 14k)、无需任何依赖、可扩展且与 IE11 兼容。 NationalSecurityAgency/ghidra: https://github.com/NationalSecurityAgency/ghidra [3] bigskysoftware/htmx : https://github.com/bigskysoftware/htmx [4] intel/intel-one-mono: https://github.com/intel/intel-one-mono

    99430编辑于 2023-11-15
  • 为什么现代 JavaScript 开发者正在远离回调与框架?

    四、“少即是多”:新兴轻量化方案4.1 HTMX:用 HTML 做更多事HTMX 让你通过在 HTML 标签中添加属性,就能实现动态交互。无需复杂的前端逻辑,直接利用后端返回的片段更新页面。 五、趋势背后的哲学:简洁、可维护、长期主义无论是从回调到 async/await,还是从大型框架到 HTMX/Qwik/Marko,其实都在指向同一个目标:简洁与可维护性。 选择轻量化方案 —— 不必为小项目上大框架,HTMX/Qwik/Marko 提供了替代路径。 优化本地开发环境 —— 不再依赖繁琐的配置,转而使用像 ServBay 这样的轻量级工具。

    33510编辑于 2025-09-03
  • 来自专栏柒八九技术收纳盒

    用Rust搭建React Server Components 的Web服务器

    我们将使用htmx[7] JavaScript库。通过编写适量的JavaScript代码,就可以响应一下事件回掉。 { // 从CDN添加htmx script src="https://unpkg.com/htmx.org@1.9.3" {} h1 { "页面可交互 我们继续使用htmx,事件绑定问题。 { // 从CDN添加htmx script src="https://unpkg.com/htmx.org@1.9.3" {} h1 { "页面可交互 : https://htmx.org/ [8] htmx官网: https://htmx.org/ [9] dioxus: https://github.com/DioxusLabs/dioxus

    1K30编辑于 2023-10-23
  • 来自专栏掘金安东尼

    2024 年值得关注的 JavaScript 最前沿趋势,走起!

    其它工具 htmx htmx:简化交互 它的原理很简单: 从任何用户事件发出 AJAX 请求。 让服务器生成代表该请求的新应用程序状态的 html。 在响应中发送该 html。 htmx 风潮已经袭来,人们开始强调一种“傻瓜客户端”方法,即由服务器生成 html 本体并发送至客户端,意味着 UI 事件会被发送至服务器进行处理。

    1.1K10编辑于 2024-02-24
  • 来自专栏云云众生s

    Pagoda:Go 程序员的 Web 开发入门套件

    Pagoda 并非框架,而是 Web 开发启动套件,集成 HTMX、Alpine.js、Bulma 等前端库,后端选用 Echo、Ent、Gomponents。 Pagoda 前端 Pagoda 包括三个用于前端的库: HTMX,它直接在 HTML 中提供对 AJAX、CSS 转换、WebSockets 和服务器事件的访问。 “HTMX 的美妙之处在于它使你能够拥有 Ajax 类型的行为,而无需进行整页重新加载,”他说。“这是你在 JavaScript 驱动的 单页应用程序 中期望或看到的很多功能。 该项目甚至被 Fork 以创建 GoShip,这是一个 Go 加 HTMX 样板,包含 SaaS、AI 工具或 Web 应用程序的所有必需品。

    66510编辑于 2025-03-20
  • 来自专栏腾讯技术工程官方号的专栏

    2023前端技术盘点与2024技术展望

    此外 Qwik 和 Htmx 在今年也广受前端社区喜爱,成为年度前端框架的黑马。 Htmx 意外走红:重新回到 ASP 时代? 在前后端分离和单页面应用(SPA)已经形成大局的 2023 年,却有一款基于动态服务器页面(ASP)思想的框架 htmx 意外走红。 接下来就让笔者带大家了解一下 Htmx 究竟是何方神圣以及 Htmx 的爆火是否意味着前端要开历史的倒车重回 ASP 时代呢? \1) Htmx 是什么 htmx 是一款基于 ASP 思想的前端框架,也可以理解成增强型的 HTML。 (图选自 More on HTMX – Back to the Future | Compositional IT) 而 Htmx 则是由服务端处理页面交互和响应,例如 UI 事件会被发送至服务端进行处理

    2.6K10编辑于 2024-01-24
  • 来自专栏【腾讯云开发者】

    穿越时空:2023年前端技术盘点与2024年技术展望

    此外 Qwik 和 Htmx 在今年也广受前端社区喜爱,成为年度前端框架的黑马。 Htmx 意外走红:重新回到 ASP 时代? 在前后端分离和单页面应用(SPA)已经形成大局的 2023 年,却有一款基于动态服务器页面(ASP)思想的框架 htmx 意外走红。 接下来就让笔者带大家了解一下 Htmx 究竟是何方神圣以及 Htmx 的爆火是否意味着前端要开历史的倒车重回 ASP 时代呢? 1) Htmx 是什么 htmx 是一款基于 ASP 思想的前端框架,也可以理解成增强型的 HTML。 (图选自 More on HTMX – Back to the Future | Compositional IT) 而 Htmx 则是由服务端处理页面交互和响应,例如 UI 事件会被发送至服务端进行处理

    7.1K96编辑于 2024-01-16
领券