테크를 사랑하는 독자라면 '프로그레시브 웹 앱(Progressive Web Apps)'이라는 용어를 한 번쯤 접해봤을 것입니다. 앱의 미래라고 불리는 이 기술은 왜 그렇게 주목받고 있으며, 모든 웹사이트가 꼭 가져야 하는 이유는 무엇일까요?
하지만 프로그레시브 웹 앱이 정확히 무엇인지 궁금해하는 분들이 많습니다. 프로그레시브 웹 앱은 기존 웹 앱과 완전히 다른 것은 아니지만, 개발자가 반드시 충족해야 하는 몇 가지 핵심 개념이 존재합니다.
프로그레시브 웹 앱(PWA)이란 무엇인가?
프로그레시브 웹 앱(PWA)은 브라우저 위에서 동작하는 웹 앱으로, CSS, HTML, JavaScript로 만들어집니다. PWA를 모바일 웹사이트와 네이티브 앱의 중간 형태, 즉 하이브리드로 이해할 수도 있습니다.
PWA는 최신 웹 기술을 활용하기 때문에 개발자는 사용자에게 모바일 앱과 같은 경험을 제공하면서도, 더 빠르고 안전하며 로딩 속도까지 개선된 웹사이트를 만들 수 있습니다. 사용자 입장에서는 일반 웹사이트처럼 보이지만 실제로는 하나의 애플리케이션처럼 느껴지는 것이 특징입니다.
또한 PWA는 최신 웹 표준을 따르기 때문에 거의 모든 브라우저에서 빠르고 안정적으로 작동하도록 설계됩니다.
인터넷 연결 속도가 느리더라도 프로그레시브 웹 앱은 즉시 로딩됩니다. 심지어 오프라인 상태에서도 동적 콘텐츠를 제외한 기능은 그대로 사용할 수 있습니다.
오프라인에서 프로그레시브 웹 앱 사용하는 방법
프로그레시브 웹 앱을 오프라인에서 사용하려면 Chrome의 일부 실험적 기능을 먼저 활성화해야 합니다. Chrome 주소창에 다음 명령어를 입력하세요.
chrome://flags/#bypass-app-banner-engagement-checks
화면 하단에 나타나는 '지금 다시 시작(Relaunch Now)' 버튼을 클릭합니다. 이후 프로그레시브 웹 앱을 지원하는 사이트에 방문하면 설치 여부를 묻는 안내가 표시됩니다.
참고로 이 글이 작성된 시점에는 Safari/iOS에서 프로그레시브 웹 앱이 작동하지 않았습니다. 즉, 오프라인 모드, 푸시 알림, 홈 화면 설치 같은 기능을 이용할 수 없었습니다. 이후 Apple은 iOS 11.3부터 서비스 워커와 홈 화면 추가 등 기본적인 PWA 기능을 부분적으로 지원하기 시작했습니다.
프로그레시브 웹 앱의 대표적인 사례는 트위터(Twitter) 웹사이트입니다. 트위터는 '홈 화면에 추가' 안내를 제공하고, 데이터 소비량을 줄이며, 서비스 워커(service worker) 스크립트를 통해 거의 즉각적인 로딩 속도를 자랑합니다.
프로그레시브 웹 앱의 보안
PWA는 브라우저에서 동작하기 때문에 앱 스토어가 필요 없으며, 항상 HTTPS를 통해 보안을 유지합니다. HTTPS를 지원하지 않는 사이트는 프로그레시브 웹 앱으로 분류될 수 없습니다. 해당 사이트에는 반드시 SSL 또는 TLS 인증서가 설치되어 있어야 합니다.
프로그레시브 웹 앱은 어떤 기기든 대응할 수 있습니다. 스마트폰, 태블릿, PC 등 기기 종류에 상관없이 작동하며, 셸(shell) 모델 기반으로 제작되기 때문에 앱 스타일의 탐색과 상호작용을 그대로 경험할 수 있습니다.
서비스 워커 업데이트 프로세스가 콘텐츠를 항상 최신 상태로 유지해주기 때문에 오래된 버전의 앱을 사용할 걱정도 없습니다. 또한 URL만으로 손쉽게 공유할 수 있고, 앱 스토어에 의존하지 않고도 홈 화면에 바로가기를 저장할 수 있습니다.
모바일 홈 화면에 추가할 수 있을 뿐만 아니라 푸시 알림도 전송할 수 있습니다. PWA를 도입한 기업 역시 유지보수 시간과 비용을 크게 줄일 수 있다는 점에서 실질적인 이점을 얻습니다.
Firefox 역시 Chrome의 발걸음을 따랐습니다. Firefox 58부터 프로그레시브 웹 앱을 지원하며, 유효한 매니페스트(manifest)를 갖추고 HTTPS로 제공되는 사이트를 방문하면 주소창에 배지가 표시됩니다.
배지를 클릭하면 '홈 화면에 추가'라는 메시지가 나타납니다. 홈 화면에서 앱을 실행한 후 외부 링크를 눌러도 사이트에서 진행 중이던 작업 내용은 그대로 유지됩니다.
PWA vs. 네이티브 앱
프로그레시브 웹 앱은 네이티브 앱보다 유리한 점이 많습니다. 개발자가 더 이상 플랫폼별로 앱을 따로 만들 필요가 없기 때문입니다. 이는 개발 시간과 비용을 획기적으로 절약해줍니다.
개발자는 현재 존재하는 모든 플랫폼과 기기에서 작동하는 단 하나의 앱만 만들면 됩니다. 또한 네이티브 앱과 달리 PWA는 사용 전에 별도로 설치할 필요가 없다는 것도 큰 장점입니다.
물론 PWA도 아직 역사가 짧은 기술인 만큼 단점이 있습니다. 예를 들어 태블릿이나 스마트폰의 하드웨어 기능과 연동할 때 지원 범위가 제한적입니다.
아직까지는 Bluetooth, 지문 센서, 가속도계, NFC 같은 기능과 통합할 수 없습니다. 당분간은 네이티브 앱이 PWA보다 안정적이겠지만, 앞으로 기술이 어떻게 발전할지는 지켜볼 가치가 충분합니다.
그렇다고 PWA와 네이티브 앱이 완전히 다른 것은 아닙니다. 두 방식 모두 홈 화면에서 실행되며 매우 유사한 웹 경험과 사용자 인터페이스(UI)를 제공합니다.
PWA의 한계
프로그레시브 웹 앱은 차세대 기술로 주목받고 있지만 몇 가지 한계가 존재합니다. 우선 Edge, Safari, Internet Explorer 등 일부 브라우저에서는 작동하지 않습니다. 반면 삼성 안드로이드 브라우저, Opera, Chrome 등 비교적 최신 버전의 브라우저에서는 정상적으로 작동합니다.
이러한 제약은 기기에도 영향을 미칩니다. 모든 기기가 PWA를 지원하는 것은 아니며, Android 역시 PWA를 지원하지만 아직 신생 기술이다 보니 일부 호환성 문제가 남아 있습니다.
iOS는 홈 화면 바로가기 생성과 알림 지원에 문제가 있어 당시 PWA를 제대로 지원하지 못했습니다. Apple이 PWA를 공식적으로 지원할지 여부는 명확히 밝혀진 바 없었으나, 이후 iOS 11.3부터 기본적인 PWA 기능이 부분 지원되기 시작했습니다.
앱 간 로그인(cross-application login)이 중요한 사용자라면 PWA를 피하는 것이 좋습니다. PWA는 데이터를 독립적으로 수집할 수 없기 때문에 이 기능을 지원하지 않습니다.
결론
프로그레시브 웹 앱은 아직 역사가 짧은 기술이며, 신중하게 도입을 검토하거나 준비 중인 기업들도 많습니다. 하지만 사용자의 모바일 경험을 한층 향상시켜 줄 수 있다는 점에서 분명히 미래의 기술이라 할 수 있습니다.
프로그레시브 웹 앱이 계속 자리 잡을 것이라고 생각하시나요, 아니면 사라질 기술이라고 보시나요? 여러분의 생각을 댓글로 공유해주세요.