Rust의 메모리 최적화 (새 탭에서 열림)
Figma는 파일 로드 속도를 혁신적으로 개선하기 위해 전체 파일을 한 번에 불러오는 방식에서 사용자가 현재 보고 있는 페이지만 불러오는 '페이지 단위 온디맨드 로딩' 방식으로 전환했습니다. 이 과정에서 메모리 사용량을 최적화하고 복잡한 동기화 메커니즘을 재설계하여, 특히 대규모 프로젝트에서의 초기 로딩 시간을 최대 50%까지 단축했습니다. 이는 협업 기능을 온전히 유지하면서도 효율적인 자원 관리를 통해 사용자 경험을 극대화한 기술적 성과입니다. **기존 모놀리식 로딩 방식의 한계** * 이전의 Figma는 파일 내 모든 페이지의 데이터를 초기 로딩 시점에 메모리에 전부 적재하는 방식을 사용했습니다. * 파일 규모가 커질수록 로딩 시간이 기하급수적으로 늘어났으며, 브라우저의 메모리 제한으로 인해 대형 파일 실행 시 충돌(Crash)이 발생하는 주요 원인이 되었습니다. * 사용자가 특정 페이지만 작업하더라도 당장 보지 않는 수십 개의 페이지 데이터를 모두 다운로드하고 해석해야 하는 비효율이 존재했습니다. **페이지 단위 온디맨드 로딩 도입** * 파일 저장 구조를 수정하여 각 페이지 데이터를 독립적인 단위로 분리하고, 사용자가 해당 페이지를 클릭할 때만 서버에서 데이터를 가져오도록 변경했습니다. * 초기 로딩 시에는 파일의 전체 구조(페이지 목록, 레이어 트리 등)와 사용자가 마지막으로 머물렀던 페이지만 로드하여 '유효 로딩 시간(Time to Interactive)'을 대폭 줄였습니다. * 페이지 전환 시 지연을 최소화하기 위해 백그라운드에서 데이터를 미리 가져오거나 스트리밍하는 최적화 기법을 적용했습니다. **기술적 난제와 동기화 엔진의 재설계** * Figma의 핵심인 실시간 협업(Multiplayer) 기능을 유지하기 위해, 현재 로드되지 않은 페이지에서 다른 사용자가 수행하는 변경 사항을 추적하고 병합하는 복잡한 로직을 구현했습니다. * C++로 작성된 엔진(Wasm)이 메모리에 없는 데이터에 접근하려 할 때 발생하는 오류를 방지하기 위해 데이터 접근 방식을 프록시화했습니다. * 전체 데이터를 다루던 기존 인덱싱 구조를 부분 로딩 모델에 맞게 재설계하여 데이터 일관성을 보장했습니다. **성능 개선 및 안정성 확보** * 로딩 전략 수정 후 대규모 파일의 초기 로드 속도가 이전 대비 약 30~50% 향상되는 결과를 얻었습니다. * 메모리 사용량을 획기적으로 낮춤으로써 저사양 기기에서의 안정성을 확보하고, 브라우저의 메모리 부족으로 인한 앱 종료 현상을 크게 줄였습니다. * 점진적인 롤아웃과 모니터링을 통해 대규모 데이터 마이그레이션 과정에서 발생할 수 있는 데이터 손실 위험을 성공적으로 관리했습니다. 대규모 데이터를 다루는 웹 애플리케이션에서 초기 로딩 속도와 메모리 관리는 서비스의 생존과 직결됩니다. Figma의 사례처럼 데이터 구조를 세밀하게 파편화하고 '필요한 순간에만 로드'하는 지연 로딩(Lazy Loading) 전략을 시스템 심층부(엔진 레벨)부터 설계하면, 확장성과 사용자 만족도를 동시에 잡을 수 있습니다.