피드로 돌아가기
Dev.toFrontend
원문 읽기
pdf-lib 기반 클라이언트 사이드 PDF 페이지 교체 구현 및 200ms 내 처리
How to Replace a Page in a PDF Programmatically with pdf-lib (No Backend Required)
AI 요약
Context
PDF의 비선형적 트리 구조와 리소스 참조 체계로 인해 단순 페이지 인덱싱을 통한 교체가 불가능한 제약 존재. 서버 라운드트립 없는 브라우저 내 즉각적인 문서 수정 요구사항 발생.
Technical Solution
- PDFDocument 객체를 통한 두 문서의 In-memory 로드 및 제어
- copyPages 메서드를 활용한 교체 페이지의 폰트 및 이미지 리소스를 원본 문서 리소스 풀로 이전
- insertPage 및 removePage 순차 실행을 통한 페이지 트리 내 인덱스 정밀 조정
- 문서 전체의 Cross-reference 테이블 업데이트를 위한 재직렬화(Re-serialization) 수행
- 0-indexed PDF 내부 구조와 1-indexed 사용자 UI 간의 간극을 처리하는 인덱싱 로직 적용
- 비동기 copyPages 처리 시 await 누락으로 인한 Promise 객체 삽입 오류 방지
실천 포인트
1. PDF 페이지 인덱스 처리 시 사용자 입력값(1-indexed)과 라이브러리 인덱스(0-indexed)의 불일치 여부 확인
2. pdf-lib의 copyPages 등 비동기 메서드에 await 적용 여부 검증
3. 50MB 이상 대용량 파일 처리 시 브라우저 메모리 한계 고려하여 Server-side Streaming 라이브러리 검토
4. 리소스 복사 없이 페이지 삽입 시 폰트/이미지가 누락되어 빈 페이지로 렌더링되는 현상 주의