Today I Learned

날짜별 업무 및 학습 회고입니다. 매일 무엇을 했고, 무엇을 배웠는지 기록합니다.

20267

2026-07-10

Modal peek 스택과 CSS layer 패키지

단일 dialog 안 document push와 @layer 기반 editor CSS 분리로 peek UX·테마 커스터마이징을 맞춘 하루

  • gallery→peek는 dialog를 새로 열기보다 같은 shell에서 documentId만 바꾸는 편이 연속적이다
  • async resolve는 (newId, oldContent) 중간 프레임을 render-time reset으로 막아야 한다
2026-07-09

계층형 문서 네비와 viewer 번들 분리

page push/peek navigator와 read-only viewer entry 분리로 포트폴리오 데모 깊이와 번들을 동시에 맞춘 하루

  • 문서 그래프는 page 블록 + push/peek navigator 계약으로 flat editor와 분리하는 편이 낫다
  • peek·embed는 editor와 DOM은 같아도 import graph가 달라야 viewer 번들이 작아진다
2026-07-06

번들 shared vendor, 크로스블록 선택, 플로팅 UI 좌표

webpack splitChunks 함정, 하이브리드 에디터 크로스블록 범위 연산, selectionchange·scroll anchor 패턴, Context 구독 분리

  • catch-all vendor에 chunks:all과 고정 name을 함께 쓰면 dynamic import가 shared 청크로 끌려 올라간다
  • 크로스블록 텍스트 연산은 범위 state 대신 getSelection 무상태 파생 + 경계 split 단일화가 안전하다
2026-07-05

블록 에디터 순서·협업·키보드 계약

fractional ordering, optimistic rebase, IME defer, keyboard undo 위임, scoped popover, Jest ESM shim 등 범용 패턴 정리

  • sibling 순서는 integer index보다 fractional position key + neighbor anchor + tie-break가 concurrent insert에 유리하다
  • optimistic UI는 inverse patch 없이는 rebase할 수 없고, remote seq가 merge 권위여야 한다
2026-07-04

문서는 host SoT, 에디터는 focused guest

블록 문서 편집기에서 host/guest 경계, React 외부 스토어 스냅샷, undo 2-스택, HTML5 드래그·선택/복사를 처음 읽는 사람 기준으로 정리

  • 문서 의미는 host 패치가 소유하고 리치텍스트 엔진은 포커스 블록의 guest로만 둔다
  • useSyncExternalStore 스냅샷에 ms timestamp만 쓰면 같은 ms mutation에서 리렌더가 드롭된다 — 단조 revision이 필요