跳到正文
返回论文列表
cs.CL提交于 已译

FullFront: 覆盖前端工程全流程的 MLLM 基准测试

FullFront: Benchmarking MLLMs Across the Full Front-End Engineering Workflow

Haoyu Sun · Huichen Will Wang · Jiawei Gu · Linjie Li · Yu Cheng

中文摘要

前端工程包含设计概念化、代码转化及迭代优化的复杂流程。现有基准多局限于视觉设计转代码,FullFront 旨在评估多模态大语言模型(MLLMs)在前端开发全管线中的表现。该基准涵盖网页设计(概念化)、网页感知问答(视觉组织理解)及网页代码生成(实现)三项任务。不同于使用臃肿爬取代码或简化 HTML 的现有基准,FullFront 采用两阶段流程将真实网页转化为干净、标准化的 HTML,保留多样视觉设计并规避版权风险。对最先进 MLLMs 的测试显示,模型在页面感知、代码生成(特别是图像处理与布局)及交互实现上存在显著局限。结果量化了不同模型与任务间的性能差异,揭示了当前 MLLM 能力与前端工程人类专家水平之间的巨大差距。

关键要点

  1. 01针对现有基准仅关注设计转代码的局限,构建覆盖前端工程全管线的评估基准。
  2. 02采用两阶段流程将真实网页转化为干净标准化 HTML,保留视觉多样性并规避版权问题。
  3. 03涵盖网页设计、网页感知问答及网页代码生成三项核心任务,映射前端开发全流程。
  4. 04测试显示 SOTA MLLMs 在页面感知、图像处理、布局及交互实现上存在显著性能局限。
  5. 05量化分析表明当前 MLLM 能力与前端工程人类专家水平之间存在巨大差距。

解读

尚无解读。

原始英文摘要

arXiv:2505.17399v4 Announce Type: replace Abstract: Front-end engineering involves a complex workflow where engineers conceptualize designs, translate them into code, and iteratively refine the implementation. While recent benchmarks primarily focus on converting visual designs to code, we present FullFront, a benchmark designed to evaluate Multimodal Large Language Models (MLLMs) \textbf{across the full front-end development pipeline}. FullFront assesses three fundamental tasks that map directly to the front-end engineering pipeline: Webpage Design (conceptualization phase), Webpage Perception QA (comprehension of visual organization and elements), and Webpage Code Generation (implementation phase). Unlike existing benchmarks that use either scraped websites with bloated code or oversimplified LLM-generated HTML, FullFront employs a novel, two-stage process to transform real-world webpages into clean, standardized HTML while maintaining diverse visual designs and avoiding copyright issues. Extensive testing of state-of-the-art MLLMs reveals significant limitations in page perception, code generation (particularly for image handling and layout), and interaction implementation. Our results quantitatively demonstrate performance disparities across models and tasks, and highlight a substantial gap between current MLLM capabilities and human expert performance in front-end engineering. The FullFront benchmark and code are available in https://github.com/Mikivishy/FullFront.

同方向论文 · cs.CL

查看全部 →

反向发现 · 这篇论文相关的工具与提示词

去交叉发现 →

关联提示词 · 2

学习github.com/f/awesome-chatgpt-prompts·外部收录·

Personalized Exam Preparation Tutor

You are my personal exam-preparation tutor for ${module_name}. Your job is to analyze all uploaded materials, especially: - past exams - TDs/TPS - corrections - course chapters - teacher patterns - frequently repeated exercises Then gener…

学习github.com/f/awesome-chatgpt-prompts·外部收录·

interview assistance

This is an amazon interview. There will be amazon leadership principles and the question will be asked based on the behavioral questions. I need to relate an example or a situation from my work and relate that to one of the principle and gi…