🔧 AI App Improvement Loop Prompt

an expert software engineer, product designer, and QA analyst.

Category	Development › Coding
Tags	AnalyzingReviewingDeveloperCode

Prompt

You are an expert software engineer, product designer, and QA analyst.

Your task is to continuously analyze my application and improve it step-by-step using an iterative process.

## Objective
Identify and implement one high-impact improvement at a time in the following priority:
1. Critical bugs
2. Performance issues
3. UX/UI improvements
4. Missing or weak features
5. Code quality / maintainability

## Process (STRICT LOOP)

### Step 1: Analyze
- Deeply analyze the current app (code, UI, architecture, flows).
- Identify ONE most impactful improvement (bug, UI, feature, or optimization).
- Do NOT list multiple items.

### Step 2: Justify
- Clearly explain:
- What the issue/improvement is
- Why it matters (impact on user or system)
- Risk if not fixed

### Step 3: Proposal
- Provide a precise solution:
- For bugs → root cause + fix
- For UI → before/after concept
- For features → expected behavior + flow
- For code → refactoring approach

### Step 4: Ask Permission (MANDATORY)
- Stop and ask:
"Do you want me to implement this improvement?"

- DO NOT proceed without explicit approval.

### Step 5: Implement (Only after approval)
- Provide:
- Exact code changes (diff or full code)
- File-level modifications
- Any dependencies or setup changes

### Step 6: Verify
- Explain:
- How to test the change
- Expected result
- Edge cases covered

---

## Continuation Rule
After implementation:
- Wait for user input.
- If user says "next":
→ Restart from Step 1 and find the NEXT best improvement.

---

## Constraints
- Do NOT overwhelm with multiple suggestions.
- Focus on high-impact improvements only.
- Prefer practical, production-ready solutions.
- Avoid theoretical or vague advice.

## Context Awareness
- Assume this is a real production app.
- Optimize for performance, scalability, and user experience.

What this prompt does

This prompt assigns an engineer, designer, and QA role for iterative app improvement. It limits each cycle to one suggestion and requires permission before implementation.

Model comparison

Gemini best follows the instructions with code-based reasoning. Claude is concrete but over-scoped, while ChatGPT is concise yet misreads a key metric and makes assumptions.

GeminiTop overall

42/ 50

＋ Correctly identifies state contamination and races from the code.

－ It overstates duplicate keys as crashes and assumes direct causality.

ChatGPT

39/ 50

＋ Concise treatment of both data growth and DOM rendering costs.

－ It misreads 3,000 daily as monthly and proposes too broad a scope.

Claude

37/ 50

＋ Offers a practical plan spanning both frontend and API layers.

－ Multiple issues and options violate the single-proposal question format.

Criterion	ChatGPT	Claude	Gemini	Leader
Instruction following	8	6	9	Gemini +13%
Accuracy	6	7	7	Tie
Specificity	8	9	9	Tie
Structure	8	8	9	Gemini +13%
Right length	9	7	8	ChatGPT +13%

Scored 1–10 by gpt-5.6-sol with model names hidden (2026-09-24). This is an AI review, not a measurement.

Read full answers

We gave three models the same input and copied their answers unedited. Each ran in its CLI (an agent harness), and answers in the ChatGPT or Claude apps or on the web may differ. Outputs are in Korean.

Input used

[Pasted material]
저희는 중고거래 플랫폼 '마켓나우'(Next.js 14 + TypeScript, 백엔드 NestJS, PostgreSQL)를 운영 중입니다.
월간 활성 사용자는 약 12만 명, 일평균 신규 상품 등록은 3,000건입니다.
최근 상품 목록 페이지의 무한 스크롤에서 렌더링이 느려지고, 채팅 알림이 간헐적으로 중복 발송되는 문제가 보고되고 있습니다.
회원가입 시 이메일 중복 체크 API 응답도 평균 1.8초로 느린 편입니다.
아래는 상품 목록 컴포넌트(ProductList.tsx) 핵심 코드입니다:
```tsx
export default function ProductList({ category }: { category: string }) {
  const [products, setProducts] = useState([]);
  useEffect(() => {
    fetch(`/api/products?category=${category}`)
      .then(res => res.json())
      .then(data => setProducts(prev => [...prev, ...data.items]));
  }, [category]);
  return <div>{products.map(p => <ProductCard key={p.id} {...p} />)}</div>;
}
```
이 앱을 분석해서 가장 임팩트 큰 개선점부터 하나씩 제안해줘.

gpt-5.6-luna (codex CLI · 에이전트 하네스) · Run on 2026-09-24

1단계: 분석

가장 임팩트가 큰 개선점은 상품 목록의 페이지네이션·렌더링 구조를 재설계하는 것입니다.

현재 ProductList에는 다음 문제가 있습니다.

category가 변경되어도 기존 상품을 초기화하지 않고 계속 누적합니다.
페이지 번호나 커서가 없어 실제 무한 스크롤 제어가 없습니다.
요청 중복 방지, 요청 취소, 마지막 페이지 판단이 없습니다.
모든 상품을 DOM에 계속 렌더링하므로 목록이 길어질수록 렌더링과 메모리 사용량이 급증합니다.
빠르게 카테고리를 전환하면 이전 요청 응답이 현재 카테고리 목록에 섞일 수 있습니다.

월 3,000건의 신규 상품과 12만 MAU 환경에서는 사용자가 목록을 오래 탐색할수록 products 배열과 DOM이 무한히 커져 스크롤 지연, 프레임 저하, 모바일 메모리 부족으로 이어질 가능성이 큽니다.

2단계: 개선 제안

커서 기반 페이지네이션과 가상 리스트를 적용합니다.

예상 동작은 다음과 같습니다.

카테고리 변경 시 상품 목록과 커서를 초기화합니다.
최초 요청은 cursor 없이 최신 상품을 가져옵니다.
하단 sentinel이 화면에 들어오면 다음 페이지를 한 번만 요청합니다.
hasNext가 false이면 추가 요청하지 않습니다.
AbortController로 이전 카테고리 요청을 취소합니다.
@tanstack/react-virtual 등으로 현재 화면 주변 상품만 DOM에 렌더링합니다.
API는 다음 형태를 반환하도록 조정합니다.

{
  items: Product[],
  nextCursor: string | null
}

이렇게 하면 목록 데이터는 필요한 만큼만 가져오고, 화면 DOM은 일정한 크기로 유지되어 긴 목록에서도 렌더링 성능이 안정적입니다.

구현 대상은 주로 다음입니다.

ProductList.tsx: 커서 상태, 중복 요청 방지, sentinel, 요청 취소
상품 목록 API: cursor, limit, nextCursor 지원
목록 렌더러: 가상화 적용
필요 시 PostgreSQL 상품 조회 인덱스 점검

구현하지 않으면 목록 탐색 시간이 길어질수록 성능 저하가 누적되고, 카테고리 전환 시 잘못된 상품이 노출되는 UX 버그도 계속 발생할 수 있습니다.

Do you want me to implement this improvement?

More in this category

12-Month AI and Computer Vision Roadmap for Defense Applications
2046 Puzzle Game Challenge
21st.dev component prompt
3D FACTORY
3D FPS Game

Popular

Categories