
130 - 프로그레시브 웹 앱
5.6
어플리케이션 셸 아키텍처
지금까지 캐싱 전략을 계획하면서, 콘텐츠 사이트에 적합한 접근 방법을 생각했습
니다. 하지만 앞으로 작업하게 될 많은 프로그레시브 웹 앱은 기존의 콘텐츠 사이
트보다는 훨씬 앱에 가까워 보일 것입니다. 이제 동적인 웹 앱을 어떻게 캐싱하고
제공할 수 있는지 살펴보겠습니다.
여기에는 지금까지 사용한 도구와 기술이 그대로 적용됩니다. 현재까지 배운 모든
것을 활용하여 웹 앱에 적합한 캐싱 전략인 앱 셸 아키텍처
(
앱 셸로 알려져 있음
)
를
구현할 것입니다.
앱 셸이 혁명적인 아이디어는 아닙니다. 사실 웹 앱은 이미 비슷한 접근 방식으로
만들어지고 있습니다. 많은 자바스크립트 프레임워크는 ‘콘텐츠’와 ‘사용자 인터
페이스’, 그리고 이 둘을 로딩하고 표시하고 컨트롤하는 ‘로직’을 분리하도록 강제
합니다. 앱 셸 아키텍처는 앱에서 가장 기본적 인터페이스 표시하는 데 필요한 리
소스와 기본 로직을 분리하도록 권장합니다. 사용자에게 최대한 빨리 앱 셸을 표
시할 수 있도록, 가능한 가볍게 만든 쉘을 우선 렌더링하여 보여주며, 이후 콘텐츠
와 나머지 추가 기능은 로딩이 완료되어 사용 가능할 때 덧붙입니다. 화면에 나중
에 보여지게 될 부분보다 지금 ‘화면에 보여지는’ 디자인 구조와 콘텐츠를 더 높은
우선 순위로 처리합니다. ...