새소식

300x250
AI/IDE 상황실

Cursor 2.2 업데이트 정리 - Debug Mode, Multi-Agent Judging, Visual Editor 등

  • -
728x90

안녕하세요! 갓대희 입니다. :- )

오늘은 "Cursor 2.2 업데이트"에 대해 써보려고 한다.

 

Cursor 2.2 업데이트 핵심 요약
2025년 12월 10일 출시된 Cursor 2.2는 AI 기반 디버깅의 새로운 패러다임을 제시하려 한다. Debug Mode로 런타임 로그를 자동 분석하고, Multi-Agent Judging으로 여러 AI 모델의 결과를 경쟁시키며, Plan Mode에서 Mermaid 다이어그램을 자동 생성하는 등 에이전트 코딩의 수준을 한 단계 끌어올렸다.

AI 코드 에디터 시장에서 Cursor는 지속적인 혁신으로 주목받고 있다. 2025년 10월 Cursor 2.0 출시 이후 에이전트 기반 코딩이 본격화되었고, 이번 2.2 버전은 그 연장선에서 개발자들이 가장 어려워하는 영역 중 하나인 디버깅에 AI를 본격적으로 투입한다.

( 2.0 출시당시 리뷰글 참고 )

Cursor 2.0 업데이트 정리 - 신규 모델(Composer), 멀티 에이전트, 음성 입력, 내장 브라우저 등

시장 경쟁 맥락

Cursor 2.2의 출시 배경에는 치열한 시장 경쟁이 있다. 2025년 11월 18일, Google이 Gemini 3와 함께 Antigravity(안티그래비티 또는 반중력으로 칭한다.)를 공개하며 AI IDE 시장에 본격 진입했다. Antigravity는 다중 에이전트 협업(Multi-agent orchestration), 브라우저 자동화, 자동 디버깅 등을 핵심 기능으로 내세우며 "Cursor를 죽였나?"라는 기사가 나올 정도로 시장에 충격을 줬다.
( 개인적으로, 안티그래비티를 리뷰 했을때 커서를 리뷰했을 때와는 다른 반응에 놀라기도 하였다. )

Google Antigravity(안티그래비티, 반중력) 리뷰 - 브라우저 통합, Agent Manager, Gemini 3.0 등 활용법


다시 본론으로 돌아와... 흥미로운 점은 Google이 Antigravity 출시 직전 Cursor의 $293억 Series D 라운드에 투자했다는 것이다. Development Corporate는 이를 "자사 제품 실패에 대비한 보험"이라 분석했다.

Cursor 2.2는 Antigravity 출시 약 3주 후에 발표되었으며, Debug Mode, Multi-Agent Judging, Browser Visual Editor 등 Antigravity의 핵심 기능과 유사한 영역을 강화했다. 다만 개발자 커뮤니티에서는 "Antigravity는 1년 반 전의 Cursor 같다"는 반응도 있어, Cursor가 여전히 완성도 면에서 앞서 있다는 평가가 우세하다.

공식 Changelog에 따르면, 이번 업데이트의 핵심은 "재현하기 어려운 버그를 AI가 스스로 추적하고 수정하는 것"이다. 단순히 코드를 생성하는 것을 넘어, 런타임 데이터를 분석하고 근본 원인을 파악하는 수준까지 발전했다.

 

Debug Mode : AI가 버그를 사냥하는 방법

Debug Mode는 Cursor 2.2의 가장 핵심적인 신기능이다. 공식 블로그에 따르면, 이 기능은 "AI 지원 디버깅에 대한 근본적으로 다른 접근법"을 제시한다. 추측성 수정을 생성하는 대신, 런타임 데이터 수집과 인간 검증을 중심으로 한 인터랙티브 루프를 만든다.

Debug Mode 2가지 핵심 가치 (공식 문서)

1. Fix your trickiest bugs (가장 까다로운 버그 수정)
"에이전트가 코드를 계측하고, 재현 시 런타임 로그를 캡처하며, 근본 원인을 수정합니다."
2. Verify the fix yourself (직접 수정 확인)
"정확하고 최소한의 변경으로, 디버깅 루프의 제어권을 유지합니다."

Debug Mode 시작하기

  • Agent 패널의 드롭다운 메뉴에서 "Debug Mode" 선택
  • 또는 Cmd/Ctrl + . 로 모드 빠른 전환

 

물론 나처럼 업데이트 직후 노출되는 팝업을 통해 설정하신분들도 있을 것 이다.

Debug Mode 공식 6단계 프로세스

공식 문서(docs/agent/modes)에서 설명하는 상세 워크플로우:

  1. Step 1: Explore and Hypothesize (탐색 및 가설 수립)
    "에이전트가 관련 파일을 탐색하고, 컨텍스트를 구축하며, 잠재적 근본 원인에 대한 여러 가설을 생성합니다." 명백한 접근법과 비명백한 접근법 모두 식별한다.
  2. Step 2: Add Instrumentation (계측 추가)
    에이전트가 Cursor 확장 내 로컬 디버그 서버로 데이터를 전송하는 로그 문을 삽입한다. 각 가설을 테스트하기 위한 구체적인 데이터를 수집하도록 설계된다.
  3. Step 3: Reproduce the Bug (버그 재현)
    "에이전트가 제공하는 특정 단계로 버그 재현을 요청합니다." 개발자가 직접 버그를 재현하면 진정한 런타임 동작이 캡처된다.
  4. Step 4: Analyze Logs (로그 분석)
    "재현 후, 에이전트가 수집된 로그를 검토하여 런타임 증거를 기반으로 실제 근본 원인을 식별합니다." 변수 상태, 실행 흐름, 타이밍 정보를 분석한다.
  5. Step 5: Make Targeted Fix (집중 수정)
    에이전트가 근본 원인만 해결하는 집중적 솔루션을 적용한다. 공식 블로그: "수백 줄의 추측성 코드가 아닌, 정확한 2-3줄의 수정"을 제시한다.
  6. Step 6: Verify and Clean Up (검증 및 정리)
    "수정이 확인되면, 에이전트가 모든 계측 코드를 제거합니다." 결과는 배포 준비가 된 깔끔하고 최소한의 변경 세트다.
Human-in-the-loop 검증의 중요성 (공식 블로그)
공식 블로그에 따르면: "에이전트가 지루한 작업을 처리하는 동안 인간이 빠른 판단을 내리는" 협업 모델이다. 일부 버그는 "기술적으로는 동작하지만 느낌이 맞지 않는" 미묘한 판단이 필요하므로, 인간 검증이 중요하다. AI는 수정이 "느낌이 맞는지"를 독립적으로 판단할 수 없다 - 이것이 개발자가 루프에 있어야 하는 이유다.

반복 프로세스 (Iterative Refinement)

첫 수정이 문제를 해결하지 못하면:

  1. 에이전트가 더 타겟팅된 로깅을 추가
  2. 개발자가 다시 재현
  3. 문제가 해결될 때까지 프로세스 반복

기존 디버거와의 차이점은 명확하다. 전통적인 디버깅에서는 개발자가 직접 브레이크포인트를 설정하고, 어떤 변수를 추적할지 결정해야 했다. Debug Mode에서는 AI가 "어디를 봐야 하는지"를 스스로 판단한다. 이는 특히 대규모 코드베이스에서 버그의 원인이 예상과 다른 위치에 있을 때 유용하다.

Debug Mode가 적합한 경우 (공식 문서)

  • 재현이 어려운 간헐적 버그: 특정 조건에서만 발생하는 문제
  • 복잡한 상태 관리 이슈: 여러 컴포넌트에 걸친 상태 문제
  • 타이밍 데이터가 필요한 성능 문제: 실행 시간 측정이 필요한 경우
  • 메모리 누수: 리소스 관리 문제
  • 여러 컴포넌트에 걸친 버그: 원인 위치를 특정하기 어려운 경우
Best Practices (공식 문서)

상세한 컨텍스트 제공: 더 포괄적인 버그 설명으로 관련 계측 배치가 가능해진다
제공된 단계 따르기: 에이전트의 재현 단계를 정확히 실행하여 진정한 런타임 정보를 캡처한다
여러 번 재현: 특히 찾기 어려운 문제의 경우 반복 재현이 도움이 된다
// Debug Mode 사용 예시 (개념적 흐름)
1. 사용자 입력:
"사용자가 로그인할 때 간헐적으로 세션이 즉시 만료되는 버그가 있습니다.
재현율이 낮아서 정확한 조건을 파악하기 어렵습니다."

2. AI 가설 (Explore & Hypothesize):
- 가설 A: 토큰 생성 시점과 검증 시점의 시간차 문제
- 가설 B: 동시성 이슈로 인한 세션 덮어쓰기
- 가설 C: 특정 브라우저에서의 쿠키 설정 문제

3. 자동 계측 (Add Instrumentation):
auth.service.ts, session.controller.ts, token.utils.ts에
런타임 로깅 코드 삽입 → 로컬 Debug Server로 전송

4. 재현 요청 (Reproduce):
"다음 단계로 버그를 재현해 주세요:
1) 로그인 페이지 열기  2) 자격증명 입력  3) 제출"

5. 로그 분석 & 수정 (Analyze & Fix):
"세션 저장 시 race condition 발견. 해결을 위해
mutex lock 추가를 제안합니다." (2줄 수정)

6. 검증 & 정리 (Verify & Clean Up):
수정 확인 후 모든 로깅 코드 자동 제거

 

실제 디버그 모드를 사용하여 디버깅 작업을 진행해 본 이력이다. (빠르게 넘어가실분들은 스킵 후 다음 섹션을 봐주시면 좋을 것 같다.)

ex) react >> nextjs 로 마이그레이션 하는 작업에 대한 디버깅
( 너무 큰 프로젝트는 아니지만, 일반적인 context window의 사이즈를 생각한다면 과연 할 수 있을까? 라는 약간의 무지성 작업을 테스트 해보았다. )

 

 - 이전 테스트 진행하였던 마이그레이션에 대한 Task 파일

 

 - Debug 모드로 변경하여 관련 명령 수행 요청

 

 - 신 기능 (Debug Mode) 동작 이해를 작업 내역을 살펴보자. 

 

 

 

 - 위에서 설명한대로 2~3번 작업 완료 후 다음과 같이 내용을 정리해서 알려주며, 4번 재현 요청이 되어 있다.

 

로그 파일은 아직 없어서 방금 삭제 시도했고 현재 깨끗합니다: `/Users/dedur/work/py/htmlGenerator/web/frontend/.cursor/debug.log` (재현 후 여기서 읽어 분석할게요).

추가로 눈에 띈 잠재 리스크(추가 검증 필요): `react-router-dom` 의존 파일(HomeContent, summary/Result, gtm 유틸) 등이 남아 있어 Next 라우팅과 분리돼 있습니다. 현재 페이지 트리에 연결돼 있지 않지만, 연결 시 빌드/런타임 오류 가능성이 있습니다.

아래 재현을 부탁드려요. 완료되면 UI의 Proceed로 알려주시면 로그를 읽고 가설을 확인/업데이트하겠습니다.

<reproduction_steps>
1. 터미널에서 cd /Users/dedur/work/py/htmlGenerator/web/frontend/next-app
2. (필요 시) pnpm install
3. pnpm dev 로 서버 시작
4. 브라우저에서 http://localhost:3000 접속 후 /posts/ai 와 /post/ai-developer-guide 페이지 각각 한 번씩 열기
5. 문제가 보이면 그대로 둔 채 서버를 종료하지 말고 Proceed 버튼으로 알려주기
</reproduction_steps>

 

 - 그리고 실제 로그를 기다리는 모습

 

 - 상기 4번 내용 진행 ( 브라우저에서 http://localhost:3000 접속 후 /posts/ai 와 /post/ai-developer-guide 페이지 각각 한 번씩 열기 )

 

 - 실시간으로 로그가 올라온다. 

 

 - 문제가 보이면 그대로 둔 채 서버를 종료하지 말고 Proceed 버튼으로 알려주기  >  진행

 

 - 관련 가설에 대한 검증 및 다음 작업 진행 중

 

 - 완료 레포팅 > 내가 확인시에는 오류가 있었는데 로그만 보았을땐 오류가 없어 정상으로 인지하고 있다. 

 

 - 다시 오류에 대해 알려주어 검증 요청.

 

 - 이런 방식으로 쭉 이어나가 결국 오류 해소를 완료 하였다.

 

 - 너무 포스팅 내용이 길어질 수 있어 이후 내용은 반복 작업이므로 생략 하였다.

공식 문서 출처
"Debug Mode helps you reproduce and fix the most tricky bugs. Cursor instruments your app with runtime logs to find the root cause. It works across stacks, languages, and models."
(Debug Mode는 가장 까다로운 버그를 재현하고 수정하는 데 도움을 줍니다. Cursor는 앱에 **런타임 로그(runtime logs)**를 자동으로 계측(instrument)하여 **근본 원인(root cause)**을 찾아냅니다. 이 기능은 스택, 언어, 모델에 상관없이 동작합니다.)
Cursor 공식 Changelog 2.2 | Debug Mode 상세 블로그 | 공식 문서 - Modes
[실제 테스트 필요]
• 구체적으로 지원되는 프로그래밍 언어 및 프레임워크 목록
• 대규모 모노레포 환경에서의 성능과 정확도
• 마이크로서비스 아키텍처에서 서비스 간 버그 추적 가능 여부

 

Multi-Agent Judging : AI들의 경쟁과 평가

Multi-Agent 병렬 실행 기능은 Cursor 2.0에서 처음 도입되었다(최대 8개 에이전트, Git Worktree 기반 격리). 2.2에서 새롭게 추가된 것은 "Judging" 기능으로, 여러 에이전트의 결과물을 자동으로 비교 평가하여 최적의 솔루션을 추천한다. 공식 문서에 따르면, "여러 에이전트를 실행할 때 Cursor가 자동으로 모든 실행 결과를 평가하고 최적의 솔루션을 추천한다"고 설명한다.

Multi-Agent 모드 활성화 방법 (공식 포럼)

  1. 채팅 창에서 모델 이름 위에 마우스를 올린다
  2. 1x 표시가 나타나면 클릭
  3. 2-3개 모델을 선택 (권장)
  4. 프롬프트 제출 → 선택한 수만큼 병렬 실행

Multi-Agent Judging 작동 방식

  1. 작업 할당: 사용자가 코딩 작업을 지시한다
  2. 병렬 실행: 여러 AI 모델이 동시에 작업을 수행한다
  3. 완료 대기: 모든 에이전트의 작업이 완료될 때까지 대기한다
  4. 자동 평가: 판단 에이전트가 각 솔루션의 논리를 분석하고 코드베이스를 탐색하여 정확성을 확인한다. (참고: 코드 규모, 스타일, 아키텍처 선택은 평가 기준이 아님)
  5. 최적 솔루션 선택: 선택된 에이전트의 결과에 선정 이유를 설명하는 주석이 추가된다

이 기능의 실용적 가치는 명확하다. 단일 AI 모델에 의존하는 대신 여러 모델의 강점을 비교 활용할 수 있다. 특히 복잡한 알고리즘 구현이나 아키텍처 설계와 같이 정답이 하나가 아닌 작업에서 유용하다.

비교 항목 단일 에이전트 Multi-Agent Judging
결과 다양성 단일 관점 복수 관점 비교
품질 검증 수동 검토 필요 자동 평가 및 추천
모델 편향 위험 높음 분산됨
선택 근거 없음 자동 생성 주석
평가 기준 (Colin, Cursor 팀 답변)
"판단 에이전트(Judge)가 각 제안된 솔루션의 논리를 분석하고 코드베이스를 탐색하여 정확성을 확인합니다."

평가하지 않는 항목: 코드 크기, 코드 스타일, 아키텍처 선택, 비용 효율성
결과 표시
선택된 에이전트에 👍 "+1" 아이콘이 표시되며, 해당 솔루션이 선택된 이유를 설명하는 주석이 추가된다.
ex) 공식 데모 이미지
알려진 제한사항 (커뮤니티 리포트)
AWS Bedrock 사용 시 작동 안 함 - Bedrock 토글이 켜져 있으면 judging 기능이 비활성화됨
• 일부 Windows 사용자에서 UI 글리치 발생 (앱 재시작으로 해결)
• judging 표시가 일관되게 나타나지 않는 경우 있음
💡 팁
Multi-Agent Judging은 병렬 실행으로 인해 API 비용이 증가할 수 있다. 중요한 아키텍처 결정이나 복잡한 알고리즘 구현 시에 선택적으로 활용하는 것이 비용 효율적이다. 일상적인 코드 작성에는 단일 에이전트 모드가 적합하다.

※ 커뮤니티 시연에서 "26초에서 7초로 성능 향상(3.7배)"이라는 결과가 보고되었으나, 이는 특정 시연 환경에서의 수치이며 실제 환경에 따라 결과가 달라질 수 있다.

 

Plan Mode + Mermaid 다이어그램

Plan Mode는 Cursor 2.0에서 도입된 기능으로, 코드 작성 전에 계획을 수립하는 단계를 지원한다. 공식 문서(docs/agent/modes)에 따르면, "구조화된 계획이 필요한 복잡한 기능"을 위해 설계되었다. 2.2 버전에서는 인라인 Mermaid 다이어그램 자동 생성과 TODO → 에이전트 라우팅 기능이 추가되었다.

Plan Mode 공식 5단계 워크플로우

공식 문서(docs/agent/modes)에서 설명하는 Plan Mode 프로세스:

  1. Step 1: Clarifying Questions (명확화 질문)
    "에이전트가 요구사항을 이해하기 위해 명확화 질문을 합니다." 모호한 부분을 사전에 해결한다.
  2. Step 2: Codebase Research (코드베이스 조사)
    에이전트가 관련 파일과 구조를 탐색하여 컨텍스트를 수집한다.
  3. Step 3: Comprehensive Plan Generation (종합 계획 생성)
    조사 결과를 바탕으로 상세한 구현 계획을 생성한다. 2.2에서는 Mermaid 다이어그램이 인라인으로 자동 생성된다.
  4. Step 4: User Review and Editing (사용자 검토 및 편집)
    생성된 계획을 검토하고 필요시 수정한다. 계획은 .cursor/plans/ 디렉토리에 파일로 저장되어 표준 도구로 편집 가능하다.
  5. Step 5: Plan Execution (계획 실행)
    승인 후 에이전트가 계획을 실행한다. 특정 TODO 항목을 별도 에이전트로 라우팅하여 병렬 처리할 수 있다.

Cursor 2.2 Plan Mode 신기능

인라인 Mermaid 다이어그램
"에이전트가 자동으로 시각 자료를 생성하여 계획에 스트리밍합니다." flowchart, sequenceDiagram, classDiagram 등이 계획 개발 중 인라인으로 렌더링된다.
TODO → 에이전트 라우팅
계획의 특정 할일을 별도 에이전트로 전송하여 병렬 실행할 수 있다. 대규모 작업을 분할하여 동시 처리가 가능해졌다.
파일 기반 저장
계획이 .cursor/plans/에 자동 저장되어 팀 공유 및 버전 관리가 용이해졌다.

ex) 공식 데모 영상

https://ptht05hbb1ssoooe.public.blob.vercel-storage.com/assets/changelog/changelog-2-2-plans.mp4

지원되는 Mermaid 다이어그램 유형

공식 문서(docs/cookbook/mermaid-diagrams) 기준:

  • flowchart - 로직과 시퀀스
  • sequenceDiagram - 컴포넌트 간 인터랙션
  • classDiagram - 객체 구조
  • graph TD - 방향성 맵

Plan Mode에서 생성되는 Mermaid 다이어그램 예시

```mermaid
graph TD
    A[사용자 요청 분석] --> B{기능 분류}
    B -->|UI 변경| C[컴포넌트 수정]
    B -->|로직 변경| D[서비스 레이어 수정]
    B -->|데이터 변경| E[스키마 마이그레이션]
    C --> F[테스트 작성]
    D --> F
    E --> F
    F --> G[PR 생성]
```
Mermaid 다이어그램 Best Practices (공식 문서)
C4 모델을 기반으로 한 계층적 접근법 권장:

1. 작게 시작: 한 함수, 라우트, 또는 프로세스에 집중
2. 점진적 구축: 개별 다이어그램을 생성한 후 결합
3. 위로 추상화: 상세한 저수준 뷰에서 고수준 개요로 진행
4. 체계적 병합: 여러 다이어그램을 통합 시스템 맵으로 결합
Plan Mode 활용 시나리오
• 대규모 리팩토링 프로젝트의 단계별 계획 수립
• 마이크로서비스 아키텍처 설계 시각화
• API 엔드포인트 설계와 데이터 흐름 문서화
• 복잡한 비즈니스 로직의 플로우차트 생성
• 팀원 온보딩 및 시스템 문서화

 

Browser Visual Editor : 디자인과 코딩의 통합

Cursor 2.2에서는 브라우저 기반의 시각적 편집 도구가 새롭게 추가되었다. 공식 문서에 따르면, 이 기능은 "디자인과 코드 사이의 간격을 좁히는 것"을 목표로 한다. 웹 앱, 코드베이스, 편집 도구를 하나의 창에서 통합하여 디자이너와 개발자가 더 효과적으로 협업할 수 있게 한다.

ex) 커서 브라우저 사용관련 자동 트리거 되는 모습

 

출시 하자마자 가장 먼저 팝업창으로 관련 내용을 강조 하고 있다.

Visual Editor 3가지 핵심 가치 (공식 문서)

1. 디자인과 코딩을 동시에
요소를 드래그 앤 드롭하고, 레이아웃과 그리드를 구축하며, 실시간으로 요소를 재배치하세요.
2. 디자인 시스템으로 스타일 지정
색상을 업데이트하고, 테마별로 테스트하며, 전체 Chrome DevTools를 사용하세요.
3. 시각적 변경 사항을 코드에 적용
'적용(Apply)'을 클릭하면 에이전트가 디자인 변경 사항을 코드로 변환합니다.

디자인 사이드바 (Appearance 패널)

공식 문서에 따르면, 디자인 사이드바는 다음과 같은 편집 컨트롤을 제공한다:

  • Position and Layout
    "페이지에서 요소를 이동하고 재배열합니다. flex 방향, 정렬, 그리드 레이아웃을 변경하세요."
  • Dimensions
    width, height, padding, margin을 정확한 픽셀 값으로 조정
  • Colors
    디자인 시스템에서 색상을 업데이트하거나 시각적 색상 선택기로 그라데이션 추가
  • Appearance
    시각적 슬라이더로 shadows, opacity, border-radius 실험
  • Text
    Font family, font weight, font size 조정
  • Theme Testing
    "라이트와 다크 테마를 즉시 전환하여 디자인을 테스트하세요."

Apply 버튼 워크플로우 (공식 문서)

  1. 시각적 조정이 완료되면 'Apply' 버튼을 클릭한다
  2. 에이전트가 시각적 변경 사항을 적절한 코드 수정으로 변환한다
  3. 사이트 전체에서 여러 요소를 선택하고 텍스트로 설명할 수 있다
  4. 에이전트들이 병렬로 실행되며, hot-reload 후 변경 사항이 라이브로 나타난다

ex) 공식데모

https://ptht05hbb1ssoooe.public.blob.vercel-storage.com/assets/changelog/changelog-2-2-browser-bNio0bOiM0ocjkCu3rkFPkk7F6lIZe.mp4

핵심 편집 기능

  • 드래그 앤 드롭 레이아웃 조작
    렌더링된 요소를 DOM 트리에서 직접 드래그하여 사이트 레이아웃을 조작한다. 버튼 순서 교체, 섹션 회전, 그리드 구성 테스트 등이 가능하다.
  • React 컴포넌트 상태 테스트
    사이드바에서 컴포넌트 속성(props)을 표시하여 다양한 상태 변환을 테스트한다.
  • 시각적 속성 컨트롤
    슬라이더와 색상 팔레트로 스타일을 미세 조정한다. 디자인 시스템 통합, 라이브 색상 선택기, 그리드/flexbox 레이아웃 재배열 컨트롤을 제공한다.
  • 포인트 앤 프롬프트 (Point-and-Prompt)
    인터페이스 요소를 클릭하고 자연어로 원하는 변경 사항을 설명한다. "이것 더 크게", "이것 빨간색으로", "순서 바꿔" 등의 명령이 가능하다. 에이전트가 여러 프롬프트를 병렬로 처리하며 몇 초 내에 변경이 적용된다.
  • Chrome DevTools 통합
    전체 Chrome DevTools에 접근 가능하여 기존 개발자 도구의 기능도 함께 활용할 수 있다.
참고: 요소 선택 인터랙션 (커뮤니티 정보)
다음은 커뮤니티에서 공유된 정보로, 공식 문서에서 명시적으로 확인되지 않은 내용이다:

클릭: 요소 선택
Ctrl/Cmd + 클릭: 스타일 패널 열기
더블클릭: 텍스트 직접 편집 모드
우클릭 → "Convert to Grid": 즉시 그리드 레이아웃 적용

이 기능의 핵심 목표는 "생각에서 코드로 더 직접적으로 연결"하는 것이다. 공식 블로그에 따르면, "우리는 디자인 과정에서 기계적 제한을 제거함으로써 아이디어를 더 순수하게 표현할 수 있게 되기를 바란다"고 밝혔다. Figma와 브라우저 개발자 도구를 오가며 작업하는 대신, Cursor 내에서 시각적 편집과 코드 수정을 동시에 처리할 수 있다.

Browser 세션 지속성 (공식 문서)
Cookies: 인증 데이터가 세션 간에 유지된다
LocalStorage / sessionStorage: 데이터가 유지된다
IndexedDB: 콘텐츠가 세션 간에 지속된다
워크스페이스별 격리: 컨텍스트가 각 워크스페이스별로 분리된다

즉, 로그인 상태나 앱 설정이 세션 간에 보존되어 반복 테스트가 편리하다.
권장 AI 모델 (공식 문서)
Browser 기능 사용 시 Sonnet 4.5, GPT-5, Auto 모델을 권장한다. 시각적 피드백과 DOM 조작에 최적화된 모델을 선택하면 더 나은 결과를 얻을 수 있다.
Enterprise 설정 (공식 문서)
• Browser 도구는 기본적으로 승인(approval)이 필요하다 (설정 가능)
• Enterprise 환경에서는 Origin allowlist로 자동 탐색을 제한할 수 있다
• Settings Dashboard의 MCP Configuration에서 브라우저 기능을 활성화해야 한다
현재 알려진 이슈 (커뮤니티 리포트)
• 요소 선택 시 새로운 채팅이 열리는 현상
• 대규모 프로덕션 앱에서 탭이 검은색으로 표시되는 문제
• Shadow DOM 내 하위 요소 선택 불가
• 브라우저가 다른 창에서 열릴 때 레이아웃 문제

개발팀에서 이러한 문제들을 인지하고 수정 예정이라고 커뮤니티 포럼에서 답변했다.

 

Pinned Chats : 대화 고정 기능

Pinned Chats는 상대적으로 단순하지만 실용적인 편의 기능이다. 공식 문서에 따르면 "에이전트 사이드바에서 향후 참고용으로 채팅을 상단에 고정할 수 있다"고 설명한다. 중요한 대화를 상단에 고정하여 나중에 쉽게 접근할 수 있다.

Pinned Chats 활용 시나리오
• 장기간 진행되는 리팩토링 프로젝트의 컨텍스트 유지
• 복잡한 버그 조사 세션의 히스토리 보존
• 자주 참조하는 아키텍처 결정 논의 빠른 접근
• 팀 내 공유가 필요한 중요 결정 사항 정리

ex) 공식 데모 이미지

 

Additional Improvements : 10가지 추가 개선사항

공식 Changelog에 따르면, Cursor 2.2에는 위 핵심 기능 외에도 10가지 추가 개선사항이 포함되어 있다. 이 중 주요 항목을 정리하면 다음과 같다.

10가지 추가 개선사항 (공식 Changelog)

  • Browser Protection Settings
    대시보드에서 브라우저 기능을 제어할 수 있는 보호 설정이 추가되었다. 승인 모드(수동/허용목록/자동)를 선택할 수 있다.
  • Ask Mode 터미널 접근
    Ask Mode에서 읽기 전용 터미널 접근이 가능해졌다. 컨텍스트 향상을 위해 코드 실행 없이 터미널 출력을 확인할 수 있다.
  • 병렬 에이전트 안정성 개선
    로컬 환경에서 여러 에이전트를 동시에 실행할 때의 안정성이 향상되었다.
  • 파일 기반 Plan 저장
    Plan Mode에서 생성된 계획이 디스크에 기본 저장되어 지속성이 개선되었다.
  • 편집 가능한 Plan 파일
    에이전트 계획 파일을 표준 도구로 편집할 수 있다. 특별한 인터페이스 없이 직접 수정 가능.
  • 시스템 알림
    터미널 및 MCP 결정에 대한 시스템 알림 통합. 에이전트 작업 완료 시 알림을 받을 수 있다.
  • 키보드 단축키 개선
    Cmd+Opt+Arrow, Ctrl+Tab 등 단축키가 추가/개선되었다.
  • AWS Bedrock 성능 최적화
    AWS Bedrock 사용 시 성능이 최적화되었다.
  • 탐색기 자동 검색
    탐색기 창에서 타이핑 시 자동으로 검색이 시작된다.
  • Rules 폴더 구조 개선
    Rules가 이제 프롬프트, 스크립트, 폴더 구성을 지원한다.

 

활용 시나리오

Cursor 2.2의 신기능들은 각각 독립적으로도 유용하지만, 조합하여 사용할 때 시너지가 발생한다. 다음은 실무에서 예상되는 활용 시나리오이다.

시나리오 1: 간헐적 버그 수정

  1. QA 팀에서 "특정 조건에서만 발생하는 결제 오류" 리포트
  2. Debug Mode 활성화 후 버그 설명 입력
  3. AI가 결제 관련 코드에 자동 계측 삽입
  4. 테스트 환경에서 버그 재현 시도
  5. 캡처된 런타임 데이터로 근본 원인 파악 및 수정

시나리오 2: 복잡한 알고리즘 구현

  1. 검색 알고리즘 최적화 작업 요청
  2. Plan Mode에서 접근 방식 설계 + Mermaid 다이어그램 생성
  3. Multi-Agent Judging으로 여러 AI 모델에 구현 요청
  4. 자동 평가 결과 확인 후 최적 솔루션 선택
  5. Pinned Chats에 결정 과정 고정하여 향후 참조

시나리오 3: UI 컴포넌트 수정

  1. 디자인 팀에서 버튼 스타일 변경 요청
  2. Visual Editor에서 해당 버튼 요소 선택
  3. 색상 선택기와 슬라이더로 스타일 실시간 조정
  4. 변경 사항 확인 후 코드에 자동 반영

 

주의사항 및 한계점

새로운 기능들이 강력하지만, 현재 버전에서 알려진 제한사항들을 인지하고 사용하는 것이 중요하다.

현재 알려진 제한사항

Debug Mode:
• 구체적인 지원 언어/프레임워크 목록이 공식 문서에 명시되지 않음
• 런타임 로깅으로 인한 성능 오버헤드 가능성

Multi-Agent Judging:
• 병렬 실행으로 API 비용 증가
• 모든 에이전트 완료까지 대기 시간 필요

Visual Editor:
• 초기 버전으로 일부 버그 존재 (커뮤니티 리포트)
• Shadow DOM 지원 제한적

일반:
• 새로운 기능들은 추가 리소스(메모리, CPU)를 소비할 수 있음
[실제 테스트 필요]
• 대규모 엔터프라이즈 코드베이스에서의 Debug Mode 성능
• Multi-Agent Judging의 실제 비용 대비 효과
• Visual Editor의 프레임워크별 호환성 (Next.js, Nuxt, SvelteKit 등)
• 기존 Cursor 설정 및 익스텐션과의 호환성

 

자주 묻는 질문 ❓

Q: Debug Mode는 어떤 프로그래밍 언어를 지원하는가?
A: 공식 문서에서는 "다양한 스택, 언어, 모델 전반에 작동한다"고 설명하지만, 구체적인 지원 언어 목록은 명시되지 않았다. 주요 언어(JavaScript, TypeScript, Python 등)는 지원될 것으로 예상되나, 실제 테스트가 필요하다.
Q: Multi-Agent Judging을 사용하면 비용이 얼마나 증가하는가?
A: 병렬로 실행되는 에이전트 수에 따라 API 호출 비용이 비례하여 증가한다. 2개 에이전트면 약 2배, 3개면 약 3배의 토큰 사용량이 예상된다. 중요한 작업에 선택적으로 사용하는 것이 권장된다.
Q: Visual Editor는 모든 프론트엔드 프레임워크를 지원하는가?
A: React 컴포넌트에 대한 지원이 확인되었으나(props 사이드바 표시), 다른 프레임워크(Vue, Svelte, Angular 등)에 대한 지원 수준은 공식 문서에서 상세히 설명되지 않았다.
Q: Cursor 2.2로 업데이트하면 기존 설정이 유지되는가?
A: 일반적으로 마이너 업데이트에서는 기존 설정이 유지된다. 다만, 새로운 기능과 관련된 설정은 기본값으로 적용될 수 있으므로, 업데이트 후 설정을 확인하는 것이 권장된다.
Q: Plan Mode의 Mermaid 다이어그램은 내보내기가 가능한가?
A: Plan Mode에서 생성된 Mermaid 코드는 표준 Mermaid 문법을 따르므로, 복사하여 다른 마크다운 환경이나 Mermaid 지원 도구에서 활용할 수 있다.

 

Cursor 2.2와 경쟁 도구 비교 

AI 코드 에디터 시장에서 Cursor 2.2의 신기능들이 어떤 위치에 있는지 비교해보면 다음과 같다.

기능 Cursor 2.2 GitHub Copilot Claude Code
AI 자동 디버깅 Debug Mode 제한적 터미널 기반
다중 모델 비교 Multi-Agent Judging 미지원 미지원
시각적 계획 도구 Mermaid 자동 생성 미지원 텍스트 기반
시각적 UI 편집 Visual Editor 미지원 미지원

※ 이 비교표는 2025년 12월 기준 공개된 기능을 바탕으로 작성되었다. 각 도구의 기능은 지속적으로 업데이트되므로 최신 정보는 공식 문서를 확인하는 것이 권장된다.

 

결론: Cursor 2.2가 의미하는 것

Cursor 2.2는 AI 코드 에디터가 단순한 코드 자동완성을 넘어 개발 워크플로우 전반으로 영역을 확장하고 있음을 보여준다. Debug Mode는 개발자들이 가장 시간을 많이 소비하는 디버깅 작업에 AI를 본격적으로 투입했고, Multi-Agent Judging은 단일 AI 모델 의존에서 벗어나 결과물의 품질을 객관적으로 비교할 수 있는 방법을 제시했다.

특히 Debug Mode의 "자동 계측 → 런타임 데이터 수집 → 근본 원인 분석" 프로세스는 기존의 정적 코드 분석만으로는 찾기 어려웠던 버그들을 해결하는 새로운 접근법을 제공한다. 이는 AI가 단순히 코드를 생성하는 것을 넘어, 실제로 프로그램을 "이해"하고 문제를 해결하는 방향으로 발전하고 있음을 의미한다.

물론 아직 초기 버전이므로 Visual Editor의 버그나 지원 범위의 불확실성 등 개선이 필요한 부분도 있다. 그러나 전반적인 방향성은 명확하다: AI 코드 에디터는 점점 더 개발자의 전체 워크플로우에 깊이 통합되고, 더 많은 작업을 자동화하는 방향으로 나아가고 있다.

참고 자료

시장 경쟁 분석

300x250
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.

💡 AI 관련 질문이 있나요? 눌러보세요!