← 返回 2026-06-04

WebRISE:面向 MLLM 生成 Web 制品的需求诱导式状态评估 WebRISE: Requirement-Induced State Evaluation for MLLM-Generated Web Artifacts

Yuxin Meng, Yuhan Suo, Junjie Wang, Yuhan Sun, Yiyao Yu, Ruixu Zhang, Ruining Hu, Yubin Wang, Shouwei Ruan, Bin Wang, Yuxiang Zhang, Yujiu Yang 📅 2026-06-02 👍 11 2026-07-13 08:36
ICG 交互式评测 前端代码生成 多模态大模型 浏览器 Agent 状态转移契约 缺陷注入 网页生成评测

把网页生成评测改写为需求诱导的可观察状态转移契约。

前置知识

多模态大语言模型 (MLLM) 与 Web 制品生成

MLLM 指同时处理文本、图像、视频等多模态输入并输出文本/代码的大模型。近期研究把它的能力从"理解 UI"和"生成静态代码"扩展到"生成可执行 Web 制品 (executable web artifacts)"——即输入文字需求、Markdown 草稿、手绘线框图、设计图或交互视频,模型直接输出一份自带 HTML/CSS/JavaScript、可在浏览器里跑起来的自包含页面。本文评测的就是这种端到端生成的产物,而不是单段代码片段。

WebRISE 的全部讨论对象都是"MLLM 生成的网页制品"。如果不清楚"静态代码生成"与"可执行交互制品"的差别,就无法理解作者为何要抛弃视觉相似度、改用交互行为来打分。

状态转移图与状态机 (State-Transition Graph)

把一个交互页面抽象成一组稳定 UI 状态 $S$ 与一组用户意图驱动的转移 $T$。每个转移 $t_j = (s^{from}_j, s^{to}_j, g_j, P_j, A^{dom}_j, A^{vis}_j)$ 描述从源状态到目标状态的一次动作,附带前置条件、DOM 断言和视觉后置条件。状态只保留与需求相关的可观察配置,而不是整个 DOM 快照,从而把状态空间限定为有限且可枚举的集合。

论文的核心抽象 Interaction Contract Graph $G_\tau = (S_\tau, T_\tau, \Phi_\tau, M_\tau)$ 本质是一张状态转移图。看不懂图、状态、转移、断言这几个基本元素,就无法读懂第 3-4 节的方法论和所有评测指标。

DOM 断言与浏览器自动化 (DOM Assertion / Playwright)

DOM 是浏览器解析 HTML 后形成的文档对象模型,每个按钮、输入框、列表项都是可查询的节点。DOM 断言指在执行一次交互前后,用脚本读取特定节点的属性/文本/可见性来验证行为,例如检查"删除后某购物车项是否消失""提交按钮是否变为 disabled"。WebRISE 用 Playwright 这类浏览器自动化框架驱动真实页面,并用 $[CHANGE]$(过程中瞬时证据)与 $[AFTER]$(最终稳定态)两类断言联合判定。

WebRISE 区别于纯视觉评测的关键就是"行为级"的 DOM 证据。不理解 DOM 断言机制,就理解不了它为何能把"看起来对"和"真的能用"区分开,也看不懂缺陷注入实验里 16/25 vs 1/25 的检测率差距。

显式需求与隐式状态一致性约束 (Explicit vs Implicit Requirements)

显式需求指用户在任务里直接写出来的功能,如搜索、筛选、排序、拖拽、导航;隐式需求指用户没说但产品层面必须成立的约束,如筛选项与分页要同步、删除后计数要更新、跨页跳转后状态要保留、边界情况要给出反馈、陈旧状态要清除。WebRISE 把这两类需求分别映射到 $R^{exp}_\tau$ 与 $R^{imp}_\tau$,并单独计算覆盖率 $R_e\%$ 和 $R_i\%$。

论文最重要的结论之一就是"隐式状态约束是当前模型的持续瓶颈"。如果不理解显式/隐式的划分,就无法抓住"难点不在能不能把按钮画出来,而在能不能把状态改对"这一全文核心论点。

MLLM-as-Judge / VLM 裁判

用一个多模态大模型(如 GPT 类)充当裁判,对生成结果或截图打分。常见做法是把前后截图喂给裁判模型,让它判断"列表是否更新""面板是否打开""是否出现空状态"。WebRISE 的视觉后置条件 $A^{vis}_j$ 就是用 VLM 裁判对比 pre/post 截图实现的,并与 DOM 断言组成双通道预言机 (dual-channel oracle)。作者报告其裁判与人工判断的一致性 $\kappa = 0.74$。

WebRISE 的视觉通道依赖 VLM 裁判。理解"裁判模型本身会受 prompt 敏感性和 API 版本漂移影响",才能正确解读作者强调的"分数应被读作稳定的排序而非绝对测量"这一伦理说明。

实现无关性与契约 (Implementation-Agnostic Conformance)

传统的脚本测试依赖固定的 CSS 选择器或入口元素,换个实现就失效;契约式测试则只规定"用户语义意图"和"期望的语义结果",不规定 DOM 路径。WebRISE 的转移目标 $g_j$ 是自然语言意图(如"打开购物车"),断言针对语义结果而非具体类名,因此同一份契约可以应用到不同模型生成的、DOM 结构完全不同的页面上。

这是 WebRISE 区别于 FrontendBench 等脚本类基准的根本设计。看不懂"实现无关",就会把它误解成又一个跑固定脚本的功能测试集,错过它真正的贡献。

研究动机

随着 MLLM 从"生成静态代码"转向"生成可执行 Web 制品",业界已经涌现出一批评测基准,但它们的输入模态高度碎片化、判据依赖局部证据:WebCoderBench 只支持 Text/Image 两类输入且做静态评测,FrontendBench 只支持 Text 且依赖实现相关的脚本断言,WebGen-Bench 只支持 Text 且用 checkpoint 校验局部结果,IWR-Bench 只支持 Video 且用 MLLM 断言。这些协议存在两个根本缺陷。其一是"事件中心式评测":截图、脚本步骤、视频轨迹、预期结果 checkpoint 只能验证某个局部动作是否产生响应,却没有显式定义哪些需求诱导的状态与转移应当被覆盖——例如"found ≠ full coverage"。其二是"状态一致性缺口":一个局部响应通过了校验,页面仍可能违反跨组件、跨视图、跨步骤的约束,比如筛选与分页不同步、删除后计数没更新、跳转后隐藏状态丢失。简言之,现有基准让交互变得"可观察",却还没有把它枚举成完整、可归因的"需求诱导状态空间"。

本文的目标是本文的目标是把 MLLM 生成的网页制品评测,从"看视觉像不像""局部动作成不成立"重写为"需求诱导的可观察状态转移一致性 (requirement-induced observable state-transition conformance)"。具体而言,作者要构建一个基准 WebRISE,能(a)把任务需求编译成一张有限、可枚举、可归因的 Interaction Contract Graph (ICG),由可观察 UI 状态 $S$、用户意图转移 $T$、DOM/视觉断言 $\Phi$ 与需求映射 $M$ 组成;(b)用一个契约引导的自适应浏览器 Agent 在真实浏览器里执行每个转移,而非跑固定脚本;(c)同时覆盖显式功能需求与隐式产品级状态约束;(d)支持 Text、Markdown、Sketch、Image、Video 五种输入模态,让同一份契约横跨五种规格去比较;(e)给出状态级、转移级、需求级三层诊断指标,而非笼统的 pass/fail。最终规模是 442 个任务、5271 条需求、5081 个状态、5495 条转移、12441 条断言。

与已有工作不同的是,WebRISE 的独特切入角度在于"把需求本身编译成可执行的状态契约",从而把评测问题从"找一个参考实现去比对"转成"枚举需求应触发的状态空间"。这与现有方法在三个维度上本质不同:第一,它是 requirement-driven 而非 appearance/script/exploration-driven——状态空间由需求诱导,不是由参考 DOM 或探索轨迹决定;第二,它是 behavior-level 且 implementation-agnostic——同一份契约(自然语言意图 + 语义断言)可跨模态、跨模型复用,不依赖固定选择器;第三,它显式建模隐式状态一致性约束,并通过映射 $M_\tau$ 把转移级证据回连到具体需求,从而支持"为什么失败"的可归因诊断。这种"契约 + 自适应 Agent + 双通道预言机"的组合在已有 web 生成评测里是没有的。

核心方法

WebRISE 的整体思路可以分两步直觉地理解:先问"这个任务到底应该让页面进入哪些状态、做哪些转移",再问"生成的页面在这些转移上是否真的对"。技术路线上,它先把每个任务 $\tau$ 的需求集 $R_\tau$ 归一化为显式功能需求与隐式状态约束;再从需求推导出 Test Data Contract(最小功能就绪数据)与 test items(用户触发的语义行为);接着把它们编译成 Interaction Contract Graph $G_\tau = (S_\tau, T_\tau, \Phi_\tau, M_\tau)$,其中稳定配置成为状态、用户行为成为转移、期望结果成为 DOM/视觉断言。每个任务在 Text/Markdown/Sketch/Image/Video 五种模态下实例化,模型生成自包含 HTML。评测时 ICG 规定"验证什么",一个契约引导的自适应 Agent 决定"怎么执行",DOM/视觉双预言机核验过程证据与用户可见结果,最终把转移裁决聚合为 $S\%, T\%, R_e\%, R_i\%, R\%$ 五类诊断指标。

核心创新是把"需求"编译成一张有限、可枚举、可归因的状态转移图 ICG,并用"契约一致性"替代"视觉相似度"或"局部 checkpoint"。它和已有方法的本质区别有三点。其一,requirement-conditioned state modeling:ICG 里的状态不是完整 DOM 快照,而是与需求相关的可观察 UI 配置;加载、保存、防抖、临时 disabled 这类瞬态行为不建模为独立状态,而是作为转移级谓词附在过程证据上——这既保持状态空间有限稳定,又保留了中间交互证据。其二,conformance-based diagnostic evaluation:评测不匹配参考 DOM、不跟随固定选择器、不重放单张截图,而是判"是否满足需求契约"。其三,显式+隐式双轨:通过映射 $M_\tau$ 把转移级证据回连到显式功能需求与隐式状态一致性约束,从而既能算 $R_e\%$ 又能算 $R_i\%$,并支持"失败归因到具体需求"的诊断。

方法步骤详情

整套流程包含四步契约构造加一个执行循环。Step 1(专家驱动的任务采集):设计采集模板,规定目标领域、场景与期望的 Web 应用类型,由匿名行业从业者提供领域接地的任务素材(用户需求、代表性交互目标、任务相关数据假设),这些只作为原始任务源而非可执行规格。Step 2(需求归一化):把素材归一为需求集 $R_\tau$,分为显式(搜索/筛选/排序/拖拽/导航)与隐式(状态同步、边界反馈、分页重置、加载反馈、陈旧状态清除)。Step 3(Test Data Contract 与 test items):从 $R_\tau$ 推导最小功能就绪数据(初始数据、过滤器、导航入口、可加载内容),不约束布局/DOM 层级/样式/精确元素数;并推导描述"用户触发行为 + 期望语义结果"的 test items,而非 CSS 选择器或点击序列。Step 4(ICG 编译):稳定配置→状态,用户行为→转移,期望结果→DOM 断言或视觉后置条件,并构造覆盖映射 $M_\tau$。执行阶段按 Algorithm 1 进行:加载页面 $H$,对每条转移 $t_j$ 先重放已验证轨迹恢复源状态 $s^{from}_j$(失败则记 SKIPPED),截图 $img_{pre}$ 并检查前置条件 $P_j$(失败记 FAIL),监控 DOM 事件并以预算 $K$ 运行 Agent 完成目标 $g_j$,等待 settle 延迟 $\Delta$ 后截图 $img_{post}$ 并冻结事件日志 $L$,分别用 $\text{SCORE}_{DOM}(A^{dom}_j, L)$ 和 $\text{SCORE}_{VISUAL}(A^{vis}_j, img_{pre}, img_{post})$ 打分,聚合为 $o_j \in \{PASS, FAIL, BLOCKED, SKIPPED\}$,只有 PASS 才更新回放缓存 $\Pi$。最后所有指标在任务级计算并宏平均:$\bar{q}(\theta,m) = \frac{1}{|D|}\sum_{\tau \in D} q(\theta,\tau,m)$。

技术新颖性

技术新颖性可归纳为四点。第一,提出"需求诱导状态空间"的显式形式化——把任意 web 任务抽象成 $G_\tau = (S_\tau, T_\tau, \Phi_\tau, M_\tau)$,并用转移 $t_j = (s^{from}_j, s^{to}_j, g_j, P_j, A^{dom}_j, A^{vis}_j)$ 作为评测原子单元,这是对 FrontendBench 脚本断言、WebGen-Bench checkpoint、IWR-Bench 视频轨迹的统一超越。第二,用"自适应浏览器 Agent"替代预编译脚本:每一步把页面序列化为带索引的 DOM 观测(含可交互控件、状态字段、新出现元素、滚动上下文、可编辑文本),索引在每次动作后重新生成,因此执行依赖当前页面状态而非固定选择器;对分支型 ICG,源状态通过重放已验证轨迹恢复,从而把"不可达状态"与"可执行但违反契约"区分开。第三,DOM/视觉双通道预言机:$[CHANGE]$ 抓执行过程中的瞬态证据,$[AFTER]$ 抓最终稳定 DOM,VLM 裁判对比 pre/post 截图判最终用户可见结果,并完整记录 Agent trace、DOM log、截图、断言裁决以支持审计。第四,五类诊断指标 $S\%$(状态可达率 $|S^{reach}_\tau|/|S_\tau|\times100$)、$T\%$(转移正确率 $|T^{pass}_\tau|/|T_\tau|\times100$)、$R_e\%$、$R_i\%$、$R\%$(需求覆盖率 $C(\hat R)=\frac{1}{|\hat R|}\sum_{r\in\hat R}\text{sat}(r)\times100$),全部任务级宏平均,避免转移/断言多的任务主导总分;并通过缺陷注入做评测器自身的元评估。

Overview of WebRISE pipeline.
Figure 2: Overview of WebRISE pipeline.

实验结果

在 442 任务、5 模态、14 模型上评测,作者给出三大主结论加若干附加发现。结论一,交互式网页生成远未饱和:即使最强的 GPT-5.5 在其最佳模态(Video)下也只达到 $T=65.6$、$R=66.3$,意味着约三分之一的需求转移或需求检查未被满足;私有模型整体领先(GPT-5.5 Overall 69.1、GPT-5.4 66.8),但开源模型保持竞争力——Kimi-K2.6 取得开源最佳 Overall 63.3,超过部分私有系统,Qwen3.6-27B 也达 62.5。结论二,多模态规格提升交互质量,Video 是最强信号:相比 Text,Video 在 $T$、$R$、$R_i$ 上分别提升 8.8、8.3、10.6 个百分点。结论三,隐式状态约束是持续瓶颈:显式需求各模型都较易满足,难任务集中在反馈、错误、边缘状态、边界条件类失败。附加发现同样关键:视觉质量不是行为的代理——Qwen3.6-35B-A3B 在 Markdown 上视觉分 $V=80.8$ 但交互分 $T=15.5$、$R=19.2$;安全鲁棒性普遍偏低,GPT-5.5 仅 41.3%,多数模型聚集在 25–32%,且模型排名扁平、跨模态差异小,说明更强模型或更丰富规格并不会自动带来更安全的 HTML;Qwen3.5 家族存在 scaling knee,27B→122B-A10B 基本持平,397B-A17B 才明显提升;缺陷注入元评估显示 ICG 检测出 16/25 注入的状态缺陷,而 WebGen 宽松 checkpoint 8/25、严格 checkpoint 仅 1/25;失败归因(Fig. 6)显示 GPT-5.5 与 Kimi-K2.6 失败画像相似,State & Logic 占主导(GPT-5.5 约 57.2%、Kimi-K2.6 约 59.7%),其次 Feedback & Boundary(约 24.6%/23.5%),说明主要瓶颈是维持正确状态更新、结果逻辑、校验行为与边界反馈,而非控件暴露本身。

Comparison with related web generation benchmarks.
Table 1: Comparison with related web generation benchmarks.
Overall model performance on WebRISE across five input modalities.
Table 2: Overall model performance on WebRISE across five input modalities.
Auxiliary safety and robustness diagnostic results by model.
Table 3: Auxiliary safety and robustness diagnostic results by model.
Defect injection meta-evaluation.
Table 4: Defect injection meta-evaluation.
Visual-score distributions across input modalities.
Figure 4: Visual-score distributions across input modalities.
Scaling behavior of the Qwen3.5 family across input modalities.
Figure 5: Scaling behavior of the Qwen3.5 family across input modalities.
Failure attribution (GPT-5.5 and Kimi-K2.6).
Figure 6: Failure attribution (GPT-5.5 and Kimi-K2.6).
查看结构化数据
任务指标本文基线提升
WebRISE 总体交互生成 (Overall, 5 模态紧凑平均) Overall Score (T/R/V 跨模态紧凑平均) GPT-5.5 = 69.1(最强模型) GPT-5.4 = 66.8;Kimi-K2.6 = 63.3(开源最佳);Qwen3.6-35B-A3B = 50.5(最弱) 私有最强 GPT-5.5 比开源最强 Kimi-K2.6 高 +5.8;最强模型距满分仍差约 31 分,验证"远未饱和"。
Video 模态下的转移正确率与需求覆盖 T% / R% / Ri% (转移正确率/总需求覆盖/隐式需求覆盖) GPT-5.5 在 Video:T=65.6, R=66.3;Video 相对 Text 在 T/R/Ri 上 +8.8/+8.3/+10.6 pp GPT-5.5 在 Text:T=60.3, R=62.3 Video 提供 +10.6 pp 的隐式覆盖提升,是五种模态里最强交互信号。
视觉质量 vs 交互行为脱节 V% vs T%/R% (视觉分 vs 交互分) Qwen3.6-35B-A3B @ Markdown: V=80.8, T=15.5, R=19.2 Kimi-K2.6 @ Text: V=83.1, T=44.6(视觉高但交互也较高) 证明 $V=80.8$ 可与 $T=15.5$ 共存,视觉漂亮不等于能用,奠定"必须评测行为"的论据。
评测器敏感性元评估(缺陷注入 25 例) DR (检测率, 检出缺陷数/25) ICG-based:16/25 = 64.0% WebGen-broad:8/25 = 32.0%;WebGen-strict:1/25 = 4.0% ICG 在宽松标准下检测率 2× 于 checkpoint,在严格标准下达 16×,证明显式状态转移契约对状态损坏更敏感。
HTML 安全与鲁棒性 Pass% (基础安全/鲁棒性检查通过率) GPT-5.5 = 41.3% 多数模型聚集 25–32%(Gemini-3 Flash 24.9 最低) 最强模型也仅过半,模型排名扁平、跨模态差异小,说明更安全 HTML 不会自动随模型/规格增强而来。

局限与改进

作者明确承认的局限有两条。第一,WebRISE 只覆盖在受控浏览器里执行的自包含 HTML 制品,不涉及真实生产系统的后端服务、鉴权、外部 API、持久化数据库、多用户并发或长时会话,因此它衡量的是"前端交互一致性"而非"部署就绪度"。第二,ICG 虽经真值页执行验证、schema 检查、人工一致性验证($\kappa=0.74$)与缺陷注入,但其覆盖仍被指定需求、生成的 test items 与 DOM/视觉断言所限定,因此提供的是"对所定义交互契约的一致性诊断证据",而非对所有可能用户行为的穷尽刻画。此外我自己观察到几点:(1)贡献者主要来自单一地区,区域产品惯例会影响"什么算预期交互",跨市场应用需扩展本地化契约;(2)VLM 裁判对 prompt 敏感且受 API 版本漂移影响,作者自己也提醒应把分数读作"稳定排序"而非绝对测量,这意味着模型间几个百分点的小差距不具强显著性;(3)评测依赖一个自适应 Agent 执行转移,Agent 自身的失败(预算 $K$ 耗尽、恢复失败)会被记为 SKIPPED/BLOCKED,可能与"页面真不会"混淆,存在一定评估噪声;(4)442 任务/5495 转移规模相对真实 Web 长尾仍偏小,对罕见交互模式(如可访问性、键盘快捷键、手势)覆盖不足。

独立分析的弱点

独立审视后,WebRISE 有几处可改进的弱点。第一,契约覆盖受人工需求工程限制:每个 ICG 的状态/转移/断言都来自专家归一化后的需求集,难以保证"完整"——尤其隐式约束(如可访问性、键盘焦点顺序、加载失败的降级、断网重试)极易被遗漏,改进方向是引入"需求挖掘 Agent"自动从 GT 页面反向提取潜在状态转移,或用大模型对 test items 做对抗式扩充。第二,自适应 Agent 与被测页面耦合:执行预算 $K$、settle 延迟 $\Delta$、回放恢复策略都是超参,对动画繁重或异步密集的页面可能误判 SKIPPED/BLOCKED,改进方向是加入"页面就绪探测"(等 networkidle + 无 pending DOM mutation)并把 Agent 不确定性显式建模为置信区间。第三,VLM 裁判单点判决:视觉后置条件 $A^{vis}_j$ 依赖一个裁判模型对比 pre/post 截图,虽有 $\kappa=0.74$ 但仍有 prompt 敏感与版本漂移,改进方向是用多裁判集成 + 不确定样本人工抽审,或引入像素级差异 + 语义掩码的双层判据。第四,规模与多样性不足:442 任务主要集中在 Productivity Tools (23.76%) 与 Social Interaction (16.97%),对可访问性、国际化(RTL 布局、多语言输入)、移动端手势、复杂表单校验等长尾覆盖薄弱,改进方向是按场景配额扩充并加入 locale-specific 契约模板。第五,仅评测前端不评后端契约:作者自己也指出可扩展方向,但当前无法区分"前端写对了但缺接口"与"前端状态机写错",改进方向是把沙箱 API 契约、持久化数据夹具、会话级状态转移并入 ICG。

未来方向

作者在 Limitations 里给出了明确的延伸方向:把 ICG 扩展到"沙箱 API 契约 + 持久化数据夹具 + 会话级状态转移",从而评测接近真实部署的全栈制品;并通过扩充契约模板、丰富缺陷套件、引入多评测 Agent 集成、对不确定样本选择性人工审计来扩大覆盖。基于这些成果我认为还可延伸四条研究线:(1)从评测走向训练——把 ICG 当作可微的奖励信号,用强化学习或拒绝采样让 MLLM 在生成时显式优化 $T\%$ 与 $R_i\%$,直接攻隐式状态约束这一瓶颈;(2)自动契约合成——研究如何从交互视频/真值页自动反推 ICG,降低对专家需求工程的依赖,使基准可低成本扩展到新领域;(3)评测 Agent 自身的形式化——把 Agent 的执行失败与页面失败分离,给出"Agent 行为可信区间",避免 SKIPPED 污染排行榜;(4)可访问性与安全维度——当前安全鲁棒性仅 41.3% 且是辅助诊断,未来可把它升级为一级指标,并新增 WCAG 可访问性、XSS/CSRF 防护、键盘可达性等独立契约子图,让评测对齐真实工程标准。

复现评估

复现评估从四方面看。数据与契约:论文公开项目主页 https://iigroup.github.io/WebRISE 并承诺发布全部 judge prompt、配置与每条断言裁决,便于独立重打分;任务、需求、状态、转移、断言规模(442/5271/5081/5495/12441)均有明确统计,并附人工一致性 $\kappa=0.74$、schema 检查、缺陷注入作为质量证据,契约本身可重现性较好。模型与算力:评测 14 个模型含 7 开源(Qwen3.5/3.6 系列、Kimi-K2.5/K2.6)与 7 私有(GPT-5.4/5.5、Claude Opus 4.6/4.7、Gemini-3 Flash/3.1 Pro、Qwen3.6-Plus),私有模型需付费 API、Gemini/Claude 版本会漂移,完整复现榜单需可控的模型快照;每个任务要跑 5495 条转移 × 5 模态 × 14 模型,并由 Playwright 驱动真实浏览器 + VLM 裁判,单任务涉及多次截图与 DOM 序列化,端到端跑完全集计算与 API 成本都不低。复现难度:技术栈涉及浏览器自动化、契约图构造、自适应 Agent、VLM 裁判四块,每块都有工程门槛;Agent 执行预算 $K$ 与 settle 延迟 $\Delta$ 等超参未给精确数值(在 Sec. B),需对照附录还原。综合看,中小团队可在公开主页配合下复现主要榜单(前提是拥有 14 个模型 API/权重与一定浏览器并发算力),但要精确复刻每个断言裁决与排名,受私有模型版本漂移影响较大,建议把分数读作稳定排序而非绝对数值。