대규모 프로젝트와 캐시
PageFlow는 모든 라우트를 동시에 활성 문서로 렌더링하지 않습니다. 렌더링과 캐시 전략에 한계를 두어 큰 그래프도 탐색할 수 있게 합니다.
뷰포트 렌더링
가까운 DOM 미리보기와 LeaferJS 장면 객체만 마운트됩니다. 먼 페이지는 간결한 표현을 사용하고, 선택된 한 페이지는 활성 iframe으로 전환됩니다.
썸네일 단계
가까운 페이지는 상세 미리보기를 사용할 수 있습니다. 먼 페이지는 작은 WebP 썸네일을 사용하며, 긴 페이지는 뷰포트에 마운트되는 타일로 분할할 수 있습니다. 새 캡처가 만들어지는 동안 오래된 썸네일은 계속 보입니다.
캡처 대기열
캡처 전 글꼴과 이미지 로드 및 DOM 안정화를 기다립니다. 작업은 한 번에 한 페이지씩 수행되며 선택된 페이지와 보이는 페이지가 우선됩니다.
레이아웃과 조회
1,000페이지가 넘는 그래프는 레이아웃 작업을 Worker로 옮길 수 있습니다. 공간 인덱스가 매 뷰포트 갱신 때 전체 그래프를 훑지 않고 보이는 페이지를 찾습니다.
캐시 위치
영구 썸네일은 다음 위치에 저장됩니다.
text
.unplugin-pageflow/cache메모리와 디스크 캐시는 고정된 LRU 용량을 사용합니다. 이 디렉터리는 삭제 가능한 개발 출력이며 완전히 새로 캡처해야 할 때 제거할 수 있습니다.
실용적인 지침
- 의미 있는 경로 구간으로 라우트를 그룹화하세요.
- 동적 매개변수에 안정적인 예시 값을 제공하세요.
- fixture 데이터로 미리보기 페이지를 결정적으로 만드세요.
- 오래 실행되는 비동기 페이지에는 준비 신호를 사용하세요.