开发框架
aihtml · 用 Erlang 函数写网页
页面由「预制件」函数拼装而成,服务端输出完整的静态 HTML,浏览器端由 Stimulus 控制器增强,样式用 Tailwind CSS。按钮的点击直接由 Erlang 函数响应:每个事件一次无状态请求,响应是要应用的 DOM 操作。
渲染依赖 beamai_render:转义与安全标记与 Jinja 模板一致,渲染结果可以直接放进 Jinja 模板。前端产物预先构建好随 release 打包,使用方不需要 Node.js。
Erlang 写页面,Erlang 接点击
ah_button(<<"删除">>, Id, [borderless],
[on(click, {?MODULE, delete, #{id => Id}})])
action(delete, #{id := Id}, _Event, Ctx) ->
ok = todo_db:delete(Id),
aihtml_action:remove(Ctx, {id, [<<"todo-">>, integer_to_binary(Id)]}).功能
能做什么
函数即页面
ah_* 构建函数与等价的 record 写法拼装页面,aihtml:render/1 输出 iodata;页面就是普通的 HTTP handler 输出。
无状态交互
点击、输入等事件一次 POST,由 Erlang 函数处理并返回 DOM 操作(替换、形变、移除、改属性……);服务端不保存会话,任意节点处理任意请求。
服务端推送
页面订阅主题,服务端经 SSE 推送与 action 相同的 DOM 操作;每页一条 EventSource,主题带签名,断线重连后自动从数据层补齐。
112 个组件与四轴主题
组件与主题移植自 sigil:DataGrid、Calendar、NodeGraph、图表、Markdown 编辑器等 111 个组件,加上服务端渲染的 markdown_view;外观、配色、排版、外形四个主题轴自由组合。
对 SEO 友好
页面元信息(description、canonical、hreflang、Open Graph、JSON-LD)由服务端写入;图表旁带隐藏数据表;分页、日历等导航是真正的 <a href>,每个状态都有自己的 URL。
国际化
组件文案按语言放在 JSON 文件里,内置中文与英文;日期格式、上午 / 下午、一周起始日随语言切换。
规格
技术规格
| 运行环境 | Erlang/OTP 27+(使用 OTP 自带的 json 模块),rebar3 |
|---|---|
| 组成 | aihtml(核心库)、aihtml_cowboy(可选的 cowboy 端点)、aihtml_example(演示站) |
| 前端 | Stimulus 3 + Tailwind CSS v4,严格类型的 TypeScript,Vite 打包,不依赖 jQuery;随 release 预构建 |
| 服务器 | 核心库不依赖 cowboy;其他服务器实现 action 与推送两个端点即可 |
| 许可 | Apache License 2.0 |
常见问题
你可能想问
需要写 JavaScript 吗?
一般不需要。页面和交互都用 Erlang 写,浏览器端的组件行为由库自带的 Stimulus 控制器完成;前端产物已预先构建,使用方不需要 Node.js。
一定要用 cowboy 吗?
不必。核心库不依赖 cowboy,aihtml_cowboy 只是现成的端点;换别的 HTTP 服务器,实现 action 与推送两个端点即可。
和 beamai_render 是什么关系?
aihtml 的转义与安全标记来自 beamai_render,与 Jinja 模板一致,所以 aihtml 渲染出的片段可以直接放进 Jinja 模板里。
许可协议是什么?
Apache License 2.0,可用于商业项目。
相关框架
beamai_render · Erlang 的模板与 Markdown 渲染引擎
Mustache 与 Jinja2 两套模板在构建期编译成 Erlang 模块,运行期渲染就是一次函数调用;外加移植自 markdig、带 30 个扩展的 Markdown 引擎。零依赖。