아카이브 · 당시 기준

2026-10-26 보관. 1.0.0 → 1.1.0 · MINOR: C(지금 구현) 설명을 코드가 도는 차례 그대로 다시 썼다 본문과 자동 동기화 표는 보관 당시 내용입니다.

현재 기준과 원본 보기 → · 보관 목록
MOR-2836 · 스냅샷 v2.6 · 저자 홍지혜(jhhong) · 2026-10-26 갱신 · 문서 v1.0.0 · 사전 첫 등록

문서 제목을 넣을 경계 밖 TextNode, 어디까지 고를까

MOR-2836 댓글의 세 안을 v2.6 데이터로 비교했다. 후보에 위성 Title 이 없을 때, 대치가 문서 제목을 컴포넌트 경계 밖 어느 글 노드에 넣는지가 쟁점이다. 연관 구현 티켓은 MOR-2764 다.

세 안과 장단점

A Title 만

경계 밖 role 이 Title 인 노드에만 싣는다. 없으면 싣지 않는다.

실리는 후보 85,719행 · 38.8%

  • 본문 문단·각주·버튼·시각 같은 엉뚱한 자리에 제목이 들어가는 일이 없다. 렌더한 사례 중 C 에서 이상해 보인 13건 가운데 12건이 사라진다. 남는 1건은 Title role 자체가 틀린 경우다.
  • 규칙이 가장 짧다. 규약에 「후보의 Title 자리」 한 줄로 적을 수 있다.
  • Subtitle·Highlight 로 태깅된 진짜 제목 자리(머리글, 리본, 허브, 헤드라인)에서 제목을 잃는다. 그 자리에는 「"강조할 내용을 입력해주세요."」 같은 임시 문구가 크게 남는다.
  • C 보다 6,431행(전체의 2.9%)이 제목을 못 싣는다.
  • Title role 이 붙었지만 실제로는 옆 카드 머리글인 자리는 못 막는다. 이건 B·C 도 같다.

B Title → Subtitle

Title 이 없으면 Subtitle 까지 본다. 둘 다 없으면 싣지 않는다.

실리는 후보 85,840행 · 38.9%

  • C 에서 이상해 보인 13건 가운데 11건을 피하면서 Subtitle 머리 자리는 살린다. 렌더한 Subtitle 4건 중 3건이 자연스러웠다.
  • 데이터에서는 사실상 A 와 같다. Title 없이 Subtitle 이 있는 후보는 121행(0.05%)뿐이고, 질의 7개의 상위 50위 350건에서는 0건이었다.
  • A 의 단점이 그대로 남는다. Highlight 로 태깅된 제목 자리는 여전히 잃는다.
  • Subtitle 이 메시지 아래 작은 보조 줄이면 제목이 메시지보다 작게 들어간다(위계 역전).

C 지금 구현

Title 이 없으면 Subtitle·Description·Highlight 를 한데 모아 위치·글자 크기 점수로 고른다.

실리는 후보 92,150행 · 41.7%

  • 제목이 가장 많이 실린다. Highlight 리본·허브·헤드라인, Description 인데 큰 말풍선 같은 실제 제목 자리를 살린다.
  • 코드를 바꾸지 않는다. 규약에 지금 동작을 적기만 하면 된다.
  • Description 자리는 대개 본문·설명·각주라 제목이 작게, 항목 아래에, 또는 여러 칸 중 하나에만 들어간다. 렌더한 Description 11건 중 9건이 이상해 보였다.
  • Highlight 도 배지·버튼에 들어간다. 렌더한 Highlight 5건 중 2건이 그랬다.
  • 지금 코드는 댓글의 「title → subtitle → description 순서」가 아니다. 아래 상자를 본다.

지금 구현(C)은 순서대로 내려가지 않는다. titleCandidatePool 은 경계 밖에 Title 이 하나라도 있으면 Title 중에서만 고르고, 없으면 Marker 와 비본문 role(Decoration·Separator·Annotation·Background)을 뺀 나머지 전부를 한 후보 묶음으로 본다. 그래서 Subtitle·Description·Highlight 가 같은 자격으로 위치·글자 크기 점수를 겨룬다.

Subtitle 이 다른 role 과 함께 있는 후보는 25행뿐이라 순서 차이는 거의 드러나지 않는다. 반면 Highlight 가 후보에 들어간다는 점은 크다. 질의 5개를 3000위까지 돌렸더니 Description·Highlight 만 있는 후보에서 C 가 고른 자리가 Description 253건, Highlight 80건이었다. 규약에 C 를 적는다면 Highlight 를 넣을지도 함께 정해야 한다.

근거: packages/comp-frame-shared/src/forked/titleCandidate.ts titleCandidatePool, Rust 쌍둥이 rust/comp-pass/crates/comp-frame-core/src/title_candidate.rs (miricanvas-iui origin/main 04585231b)

v2.6 데이터에서 얼마나 갈리나

스냅샷 v2.6 의 frame 행(검색 후보) 220,847행을 제목 자리로 나눴다. A·B·C 가 갈리는 건 「경계 밖 Subtitle 만」과 「경계 밖 Description·Highlight 만」 두 줄이다.

후보의 제목 자리행비율ABC
위성 Title (정렬 rule f 가 짝짓는다)15,9627.2%실음실음실음
경계 밖 Title 있음69,75731.6%실음실음실음
경계 밖 Subtitle 만 (Title 없음)1210.05%안 실음실음실음
경계 밖 Description·Highlight 만
Description 3,434 · Highlight 1,621 · 둘 다 1,255
6,3102.9%안 실음안 실음실음
제목을 넣을 후보 노드 없음128,69758.3%안 실음안 실음안 실음

실제 검색 결과에서도 비슷하다. 손으로 쓴 질의 7개(HighlightedMessage·Cycle·Steps·List·Timeline·Versus·BigNumber)의 상위 50위 350건을 나눴더니 위성 Title 30건, 경계 밖 Title 98건, Subtitle 만 0건, Description·Highlight 만 16건, 후보 없음 206건이었다. 상위권에서 A 와 C 가 갈리는 결과는 350건 중 16건(4.6%)이다.

Subtitle 만 있는 후보는 상위권에 거의 오지 않는다. HighlightedMessage 질의를 3000위까지 늘려도 Subtitle 만 있는 결과는 5건(1183·1558·1567·1595·2409위)이었고, Description·Highlight 만 있는 결과는 169건이었다.

안별 썸네일

각 카드는 왼쪽이 템플릿 원본, 오른쪽이 그 안을 적용한 대치 결과다. 제목을 싣지 않는 안에서는 제목 자리로 골랐을 노드에 role 임시 문구가 들어간다. 같은 사례가 안마다 다른 묶음에 들어가므로, 탭을 바꿔 가며 같은 do_id 를 비교하면 된다.

잘 대치된 케이스 17건

원본원본 11290334
대치 결과대치 결과 11290334

경계 밖 Title 있음A=B=C고른 role · Title

큰 머리 상자(「Core Concepts」) 자리에 제목이 들어간다.

HighlightedMessage · 「고객 만족도 98% 달성」 · 11위 · do_id 11290334

원본원본 11735650
대치 결과대치 결과 11735650

경계 밖 Title 있음A=B=C고른 role · Title

상단 리본(「MISSION」) 자리에 제목이 들어간다.

HighlightedMessage · 「고객 만족도 98% 달성」 · 12위 · do_id 11735650

원본원본 13343219
대치 결과대치 결과 13343219

경계 밖 Title 있음A=B=C고른 role · Title

카드 맨 위 큰 제목 자리에 들어간다.

Cycle · 「PDCA 사이클」 · 3위 · do_id 13343219

원본원본 11851487
대치 결과대치 결과 11851487

경계 밖 Title 있음A=B=C고른 role · Title

왼쪽 위 제목 자리에 들어간다. (사이클 칸 배치는 이 결정과 무관하다.)

Cycle · 「PDCA 사이클」 · 4위 · do_id 11851487

원본원본 11571627
대치 결과대치 결과 11571627

경계 밖 Title 있음A=B=C고른 role · Title

목록 머리띠 자리에 들어간다.

Steps · 「프로젝트 진행 5단계」 · 4위 · do_id 11571627

원본원본 13519588
대치 결과대치 결과 13519588

경계 밖 Title 있음A=B=C고른 role · Title

가운데 육각형 머리 칸에 들어간다. 칸이 좁아 두 줄로 꺾인다.

Steps · 「프로젝트 진행 5단계」 · 5위 · do_id 13519588

원본원본 12985979
대치 결과대치 결과 12985979

경계 밖 Title 있음A=B=C고른 role · Title

단계 줄 왼쪽 머리 칸(「全体のプロセス」)에 들어간다.

Steps · 「프로젝트 진행 5단계」 · 35위 · do_id 12985979

원본원본 13380470
대치 결과대치 결과 13380470

경계 밖 Title 있음A=B=C고른 role · Title

카드 머리(「Satisfaction Metric」) 자리에 들어간다.

BigNumber 2개 · 「2025 사업 성과 요약」 · 8위 · do_id 13380470

원본원본 11650679
대치 결과대치 결과 11650679

경계 밖 Title 있음A=B=C고른 role · Title

카드 머리(「WEBSITE」) 자리에 들어간다.

BigNumber 2개 · 「2025 사업 성과 요약」 · 9위 · do_id 11650679

원본원본 12978552
대치 결과대치 결과 12978552

경계 밖 Subtitle 만B=C · A 안 실음고른 role · Subtitle

왼쪽 위 머리 자리(Subtitle, 66.7pt)에 들어간다.

HighlightedMessage · 「고객 만족도 98% 달성」 · 1183위 · do_id 12978552

원본원본 11764853
대치 결과대치 결과 11764853

경계 밖 Subtitle 만B=C · A 안 실음고른 role · Subtitle

카드 왼쪽 위 작은 머리글(eyebrow) 자리에 들어간다.

HighlightedMessage · 「고객 만족도 98% 달성」 · 1558위 · do_id 11764853

원본원본 13231668
대치 결과대치 결과 13231668

경계 밖 Subtitle 만B=C · A 안 실음고른 role · Subtitle

메시지 위 강조 띠 자리에 들어간다.

HighlightedMessage · 「고객 만족도 98% 달성」 · 1567위 · do_id 13231668

원본원본 13413038
대치 결과대치 결과 13413038

경계 밖 Description·Highlight 만C 만 실음고른 role · Highlight

사이클 가운데 허브(Highlight)에 들어간다.

Cycle · 「PDCA 사이클」 · 115위 · do_id 13413038

원본원본 13632866
대치 결과대치 결과 13632866

경계 밖 Description·Highlight 만C 만 실음고른 role · Highlight

리본 배너(Highlight, 58pt)에 들어간다.

BigNumber 1개 · 「2025 사업 성과 요약」 · 36위 · do_id 13632866

원본원본 13386189
대치 결과대치 결과 13386189

경계 밖 Description·Highlight 만C 만 실음고른 role · Highlight

맨 위 헤드라인(Highlight, 53pt)에 들어간다.

Steps · 「프로젝트 진행 5단계」 · 99위 · do_id 13386189

원본원본 12917783
대치 결과대치 결과 12917783

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

캐릭터 말풍선의 큰 글자(Description, 55.7pt)에 들어간다. role 은 Description 이지만 실제로는 제목 자리다.

Steps · 「프로젝트 진행 5단계」 · 27위 · do_id 12917783

원본원본 11859398
대치 결과대치 결과 11859398

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

왼쪽 리드 문장 칸(Description)에 들어간다. 제목처럼 읽힌다.

BigNumber 1개 · 「2025 사업 성과 요약」 · 22위 · do_id 11859398

사용자 눈에 이상해 보이는 케이스 13건

원본원본 13419214
대치 결과대치 결과 13419214

경계 밖 Title 있음A=B=C고른 role · Title

role 은 Title 이지만 오른쪽 카드 두 장 중 첫 장의 머리글(「As a reader」)이다. 제목이 항목처럼 보이고, 둘째 장 머리글에는 「제목을 입력해주세요」가 남는다. A·B·C 모두 같다.

Cycle · 「PDCA 사이클」 · 27위 · do_id 13419214

원본원본 11798098
대치 결과대치 결과 11798098

경계 밖 Subtitle 만B=C · A 안 실음고른 role · Subtitle

메시지 아래 작은 보조 줄에 들어간다. 제목이 메시지보다 작아 위계가 뒤집힌다.

HighlightedMessage · 「고객 만족도 98% 달성」 · 2409위 · do_id 11798098

원본원본 12908606
대치 결과대치 결과 12908606

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

구분선 아래 작은 본문 문단(Description, 5줄 용량)에 들어간다. 큰 메시지 아래 작은 글씨로 같은 말이 또 나온다.

HighlightedMessage · 「고객 만족도 98% 달성」 · 18위 · do_id 12908606

원본원본 13503446
대치 결과대치 결과 13503446

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

채팅 말풍선 옆 시각(「16:21 pm」) 자리에 들어간다.

HighlightedMessage · 「고객 만족도 98% 달성」 · 21위 · do_id 13503446

원본원본 12323816
대치 결과대치 결과 12323816

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

메시지 아래 설명 줄에 들어간다. 자리는 무난하지만 위 문장과 뜻이 겹친다.

HighlightedMessage · 「고객 만족도 98% 달성」 · 34위 · do_id 12323816

원본원본 12049055
대치 결과대치 결과 12049055

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

네 단계 설명 칸 중 왼쪽 위 하나에만 제목이 들어가고, 나머지 셋은 임시 문구다.

Cycle · 「PDCA 사이클」 · 31위 · do_id 12049055

원본원본 13394417
대치 결과대치 결과 13394417

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

하단 각주(「*수수료: 매출의 10%」) 자리에 들어간다.

Steps · 「프로젝트 진행 5단계」 · 29위 · do_id 13394417

원본원본 13308607
대치 결과대치 결과 13308607

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

숫자 카드 아래 글머리표 목록의 첫 줄에 들어간다.

BigNumber 1개 · 「2025 사업 성과 요약」 · 15위 · do_id 13308607

원본원본 11785939
대치 결과대치 결과 11785939

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

숫자 아래 설명 상자에 들어간다.

BigNumber 1개 · 「2025 사업 성과 요약」 · 18위 · do_id 11785939

원본원본 11746619
대치 결과대치 결과 11746619

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

오른쪽 설명 목록의 첫 줄에 들어간다.

BigNumber 1개 · 「2025 사업 성과 요약」 · 23위 · do_id 11746619

원본원본 11359620
대치 결과대치 결과 11359620

경계 밖 Description·Highlight 만C 만 실음고른 role · Description

옆 카드의 본문(후기 문장) 자리에 들어가 숫자 카드와 같은 급으로 보인다.

BigNumber 1개 · 「2025 사업 성과 요약」 · 33위 · do_id 11359620

원본원본 13351030
대치 결과대치 결과 13351030

경계 밖 Description·Highlight 만C 만 실음고른 role · Highlight

「MOST POPULAR」 배지(Highlight)에 두 줄로 끼어 들어간다.

BigNumber 1개 · 「2025 사업 성과 요약」 · 403위 · do_id 13351030

원본원본 12935962
대치 결과대치 결과 12935962

경계 밖 Description·Highlight 만C 만 실음고른 role · Highlight

「자세히 보기」 버튼(Highlight) 안에 들어간다.

BigNumber 1개 · 「2025 사업 성과 요약」 · 443위 · do_id 12935962