WebCompass: 코드 언어 모델을 위한 멀티모달 웹 코딩 평가 방향

초록

대규모 언어 모델은 종단간 웹 코딩이 가능한 상호작용형 코딩 에이전트로 빠르게 진화하고 있지만, 기존 벤치마크는 이러한 능력의 일부 측면만을 평가해 왔습니다. 일반적으로 정적 정확도 메트릭을 활용한 텍스트 조건 생성 위주로 평가가 이루어져 시각적 충실도, 상호작용 품질, 코드베이스 수준의 추론은 대체로 측정되지 못했습니다. 우리는 웹 엔지니어링 능력에 대한 통합 생명주기 평가를 제공하는 멀티모달 벤치마크인 WebCompass를 소개합니다. 실제 웹 코딩이 생성, 편집, 수리의 반복적인 주기라는 점을 감안하여, WebCompass는 세 가지 입력 양식(텍스트, 이미지, 비디오)과 세 가지 작업 유형(생성, 편집, 수리)을 포괄하며, 전문가 워크플로우를 반영하는 일곱 가지 작업 범주를 구성합니다. 다단계, 인간 참여형 파이프라인을 통해 우리는 15개의 생성 도메인, 16개의 편집 작업 유형, 11개의 수리 결함 유형을 아우르는 인스턴스를 수집하며, 각각을 쉬움/중간/어려움 수준으로 주석 처리했습니다. 평가를 위해 우리는 편집 및 수리 작업에는 체크리스트 기반의 LLM-as-a-Judge 프로토콜을 채택하고, 생성 작업에는 생성된 웹사이트를 실제 브라우저에서 자동 실행하고, Model Context Protocol(MCP)을 통해 상호작용 동작을 탐색하며, 반복적으로 표적 테스트 케이스를 합성하여 인간 수용 테스트에 근접한 새로운 Agent-as-a-Judge 패러다임을 제안합니다. 대표적인 클로즈드소스와 오픈소스 모델을 평가한 결과, 우리는 다음과 같은 사실을 관찰했습니다: (1) 클로즈드소스 모델이 여전히 상당히 강력하고 균형 잡힌 성능을 보임; (2) 편집과 수리는 서로 다른 난이도 프로필을 나타내며, 수리는 상호작용성을 더 잘 보존하지만 실행 측면에서는 여전히 어려움을 겪음; (3) 미적 요소는 가장 지속적인 병목 현상이며, 특히 오픈소스 모델에서 두드러짐; (4) 프레임워크 선택이 결과에 실질적으로 영향을 미치며, Vue는 일관되게 어려운 반면 React와 Vanilla/HTML은 작업 유형에 따라 더 강력한 성능을 보임.

English

Large language models are rapidly evolving into interactive coding agents capable of end-to-end web coding, yet existing benchmarks evaluate only narrow slices of this capability, typically text-conditioned generation with static-correctness metrics, leaving visual fidelity, interaction quality, and codebase-level reasoning largely unmeasured. We introduce WebCompass, a multimodal benchmark that provides unified lifecycle evaluation of web engineering capability. Recognizing that real-world web coding is an iterative cycle of generation, editing, and repair, WebCompass spans three input modalities (text, image, video) and three task types (generation, editing, repair), yielding seven task categories that mirror professional workflows. Through a multi-stage, human-in-the-loop pipeline, we curate instances covering 15 generation domains, 16 editing operation types, and 11 repair defect types, each annotated at Easy/Medium/Hard levels. For evaluation, we adopt a checklist-guided LLM-as-a-Judge protocol for editing and repair, and propose a novel Agent-as-a-Judge paradigm for generation that autonomously executes generated websites in a real browser, explores interactive behaviors via the Model Context Protocol (MCP), and iteratively synthesizes targeted test cases, closely approximating human acceptance testing. We evaluate representative closed-source and open-source models and observe that: (1) closed-source models remain substantially stronger and more balanced; (2) editing and repair exhibit distinct difficulty profiles, with repair preserving interactivity better but remaining execution-challenging; (3) aesthetics is the most persistent bottleneck, especially for open-source models; and (4) framework choice materially affects outcomes, with Vue consistently challenging while React and Vanilla/HTML perform more strongly depending on task type.

WebCompass: 코드 언어 모델을 위한 멀티모달 웹 코딩 평가 방향

WebCompass: Towards Multimodal Web Coding Evaluation for Code Language Models

초록

Support