크롬(Chrome) 70 버전부터는 클릭 한 번으로 데스크톱에 프로그레시브 웹 앱(PWA, Progressive Web App)을 설치할 수 있게 되었습니다. 그렇다면 PWA란 무엇일까요? 그리고 왜 좋은 걸까요?
프로그레시브 웹 앱(PWA)이란?
프로그레시브 웹 앱(PWA)은 스마트폰 앱과 같은 사용 경험을 웹에서 그대로 제공하는 애플리케이션입니다. PWA의 기본적인 특징은 다음과 같습니다.
- 어떤 브라우저를 기본으로 사용하든 모든 인터넷 사용자가 이용할 수 있습니다.
- 반응형으로 설계되어 어떤 기기에서든 화면 크기에 딱 맞게 표시됩니다.
- 네이티브 앱과 비슷한 형태라 주소(URL)를 입력할 필요 없이, 스마트폰에서처럼 아이콘 하나만 누르면 바로 실행됩니다.
- 온라인은 물론 오프라인이나 네트워크 연결이 불안정한 환경에서도 사용할 수 있습니다.
PWA를 사용해야 하는 이유
속도가 빠릅니다. PWA는 캐시에서 먼저 로드한 후 네트워크에 연결하기 때문에 네트워크가 없어도 즉시 실행됩니다. 반면 일반 브라우저는 연결을 먼저 요청한 뒤 내용을 불러오기 때문에 빈 화면이 잠시 나타나는데, 많은 사용자가 이 몇 초의 지연조차 견디지 못하고 이탈해버립니다.
저장 공간을 거의 차지하지 않습니다. 기기에 설치한 네이티브 앱처럼 느껴지지만 용량은 훨씬 작습니다. 실제로 스타벅스 PWA는 네이티브 앱 용량의 0.4% 수준에 불과합니다. 홈 화면에서 아이콘을 찾아 실행하며, 알림 기능 등 네이티브 앱에서 하던 일을 그대로 할 수 있습니다.
신뢰성이 높습니다. PWA는 메인 브라우저와 별도로 실행되는 자바스크립트 파일인 '서비스 워커(Service Worker)'를 활용합니다. 서비스 워커는 네트워크 요청을 제어하고, 해당 요청을 캐싱해 성능을 개선하며, 캐시된 콘텐츠에 오프라인으로도 접근할 수 있게 해줍니다. 덕분에 네트워크 연결 여부와 관계없이 항상 앱을 로드하고 사용할 수 있습니다. 물론 최신 콘텐츠를 확인하려면 네트워크 연결이 복구되어야 합니다.
사용이 더 자연스럽습니다. 브라우저처럼 매번 웹 주소를 입력할 필요가 없습니다. 홈 화면이나 바탕화면의 아이콘을 탭하거나 클릭하기만 하면 곧바로 앱이 실행됩니다.
PWA 설치 방법
앱 스토어를 찾아다니거나 다운로드받는 번거로움 없이, 홈 화면(바탕화면)에 바로 설치할 수 있습니다.
먼저 PWA를 지원하는 사이트를 선택하세요. 아직 지원 사이트가 많지는 않지만, 트위터(X), 핀터레스트, 트리바고, 우버, 스타벅스 등은 사용자들에게 잘 작동하는 것으로 알려져 있습니다. 일부는 전체 웹 페이지에서 바로 접근할 수 있지만, 트위터처럼 모바일 사이트를 통해서만 설치할 수 있는 경우도 있습니다.
PWA를 제공하는 사이트에 접속한 뒤, 오른쪽 상단의 메뉴 아이콘을 클릭합니다.
“[앱 이름] 설치(Install)” 메뉴를 선택해 설치를 진행합니다. 예를 들어 트위터 모바일 사이트에 접속했다면 “메뉴 > Twitter 설치”를 클릭하면 됩니다.
설치 옵션이 보이지 않는다면 해당 사이트에서 PWA를 제공하지 않는 것일 가능성이 높습니다. 포기하기 전에 모바일 버전 사이트를 먼저 확인해 보시길 권합니다.
설치 권한 대화상자가 나타나면 “설치”를 클릭합니다.
바탕화면 아이콘을 선택하거나, Windows 10이라면 시작 메뉴의 앱 목록에서 실행할 수 있습니다. 앱은 독립된 창, 작업표시줄 아이콘, 시작 메뉴 항목과 함께 열립니다.
PWA 삭제 방법
설치한 프로그레시브 웹 앱을 삭제하고 싶다면, 앱 상단의 점 세 개(세로 배열) 아이콘을 클릭한 후 “[앱 이름] 삭제(Uninstall)”를 선택하면 됩니다.
이런 장점들이 많다 보니 직접 사용해 보고 싶어질 것입니다. 현재 사용 가능한 PWA의 확실한 목록을 찾기는 어렵지만, 여러분에게 잘 맞는 PWA를 발견했다면 아래 댓글로 알려주세요.