웹 성능 (Web performance)은 전통적으로 항상 인간의 사용자 경험 (user experience)에 관한 것이었습니다. 최근에는 이것이 AI 에이전트 (AI agents)를 포함하는 방향으로 진화했습니다. AI 에이전트는 사용자를 '대신하여' 웹을 탐색하고, 소비하고, 상호작용하는 익명의 에이전트 시스템 (agentic systems)으로 생각할 수 있습니다. 점점 더 많은 사람들이 AI 에이전트를 사용하거나 AI 모드를 밀어붙이는 검색 엔진을 계속 사용함에 따라, 에이전트 브라우징 (agentic browsing)을 위해서도 최적화할 것을 권장합니다.

Google은 최근 Lighthouse와 PageSpeed Insights 모두에 대해 에이전트 브라우징 (agentic browsing) 카테고리를 포함시켰으나, 이는 현재 실험적인 단계입니다.

우리는 어떻게 그것을 할 수 있을까요? 광범위하게 말하면, 여기서 다룰 수 있는 몇 가지 기본적인 단계가 있습니다:

1. 접근성 트리 (Accessibility Tree):

에이전트가 당신의 페이지를 탐색할 때, 그들은 일반적으로 인간이 하는 것처럼 페이지를 "보는" 것이 아닙니다. 그들은 요소의 역할 (roles), 이름 (names), 그리고 관계 (relationships)를 분석하기 위해 DOM 구조를 파싱 (parse)합니다. 만약 트리의 어떤 부분이 불완전하다면, 이는 데이터 오류나 결제 흐름 (checkout flows)의 중단으로 이어질 수 있습니다. 오늘날 Google Lighthouse는 다음 방법들을 통해 이를 측정합니다:

• 모든 상호작용 요소 (버튼, 입력창, 링크)는 에이전트에게 "보일" 수 있도록 텍스트 노드 (text node) 또는 aria-label이 할당되어야 합니다.
• 부모-자식 관계 (Parent - child relationships) 또는 형제 관계 (sibling relations)가 트리 내에서 명확해야 합니다. 예를 들어, 레이블 (label)은 입력창 (input)과 명확하게 연결되어야 합니다. 이는 일반적인 페이지 구조의 더 나은 문맥 (context) 파악과 워크플로 (workflows) 실행을 위함입니다.
• 상호작용 요소는 숨겨져 있어서는 안 됩니다 - CSS나 aria-label을 통해 숨겨진 클릭 가능한 제출 (Submit) 버튼은 에이전트를 혼란스럽게 합니다.

2. 적절한 메타데이터 (Proper Metadata):

도메인의 루트(root)에 위치한 llms.txt는 에이전트가 모든 페이지를 불필요하게 방문할 필요 없이, 주어진 작업에 대해 탐색해야 할 주요 페이지와 섹션을 요약해 줍니다. 더 향상된 요약을 위해 schema.org 및 llms-full.txt와 같은 더 고급 기술들도 존재합니다.

3. 누적 레이아웃 이동 (Cumulative Layout Shift, CLS):

누적 레이아웃 이동 (Cumulative Layout Shift, CLS)은 이미 전통적인 웹 성능 지표의 일부이지만, 에이전트에게는 훨씬 더 중요합니다. 레이아웃 안정성이 보장되어야 에이전트가 주어진 워크플로 (workflow)나 작업 중에 잘못 클릭하거나 잘못 실행하는 일이 발생하지 않기 때문입니다.

4. WebMCP 도입:

WebMCP를 통해 에이전트는 사용자 프롬프트 (prompt)를 기반으로 직접적인 동작을 수행할 수 있는 API를 제공받습니다. 현재 이를 구현하는 방법에는 두 가지가 있습니다. HTML 폼 (form)으로 직접 정의하는 선언적 API (declarative API)와 JavaScript를 사용하는 명령형 API (imperative API)입니다. 이는 현재 오리진 트라이얼 (origin trial)로 제공되고 있어, 실제 사용자가 있는 프로덕션 환경에서 오늘 바로 테스트해 볼 수 있습니다. 이는 이커머스 (ecommerce), 여행, 그리고 일상적인 작업의 일반적인 자동화와 같은 실질적인 사용 사례를 가지고 있습니다.

맺음말

웹의 미래가 완전히 자율적일지(혹은 우리가 어떤 새로운 인터페이스로 진화할지)는 확실하지 않지만, 현재로서는 최선의 전략은 다음과 같습니다: 페이지는 인간을 위해 구축하고, 에이전트를 위해 최적화하십시오.