문맥 창은 시스템 지시, 대화, 문서, 도구 결과, 생성 중인 답변이 차지하는 토큰 공간입니다. 오래된 내용이 창 밖으로 밀리거나 요약되면 모델이 그 원문을 직접 볼 수 없습니다.
데모는 새 자료가 들어올 때 오래된 카드가 창 밖으로 밀리는 상황을 단순화합니다. 실제 한도와 초과 처리 방식은 모델 및 애플리케이션 설정에 따라 다릅니다.
언제 쓰나
긴 대화·문서를 다룰 때 어떤 정보를 남기고 요약할지 결정하는 데 사용합니다.
문맥 창
Context window
모델이 한 번에 참고할 수 있는 입력과 출력의 토큰 범위입니다.
···
<div class="scene"><div class="heading">CONTEXT WINDOW <span id="meter" class="mono">3 / 3</span></div><div class="window"><div class="tokens" id="tokens"></div></div><div class="muted note" id="note">새 입력이 들어오면 오래된 문맥이 밀립니다</div></div>.scene{width:min(94vw,800px);height:min(88vh,326px);padding:clamp(10px,2.7vmin,19px);border:1px solid var(--line);border-radius:13px;background:var(--surface);font:500 clamp(13px,2.4vmin,17px)/1.3 var(--font-sans,sans-serif);position:relative;overflow:hidden}.scene .mono{font-family:ui-monospace,SFMono-Regular,monospace}.scene .muted{color:var(--muted)}.scene .accent{color:var(--accent)}.scene .heading{font-weight:750;color:var(--accent);margin-bottom:clamp(5px,1.6vmin,12px)}.heading{display:flex;justify-content:space-between}.window{border:2px solid var(--accent);border-radius:9px;height:62%;padding:7px;overflow:hidden}.tokens{display:flex;height:100%;gap:6px;align-items:stretch}.token{flex:1;min-width:0;display:grid;place-items:center;text-align:center;border-radius:6px;background:color-mix(in srgb,var(--accent) 18%,var(--bg));border:1px solid var(--line);transition:all .3s}.token:first-child{opacity:.55}.note{margin-top:7px}const items=['지시','문서 A','문서 B','질문','도구 결과','답변'];let index=0;function draw(){const shown=items.slice(index,index+3);document.getElementById('tokens').innerHTML=shown.map(x=>'<div class=token>'+x+'</div>').join('');document.getElementById('meter').textContent=(index+3)+' / '+items.length;index=(index+1)%4}draw();setInterval(draw,1300)