PWA, Progressive Web App이란 무엇일까

PWA를 이해하기 앞서 알아야하는 개념에 대해 먼저 설명하겠습니다.

 

1. Native App (네이티브 앱)

2. Web Application (웹 앱)

3. Hybrid Application(하이브리드 앱)

4. Cross-Platform Application (크로스-플랫폼)

5. Progressive Web Application (PWA)

 

1. Native App

스마트폰이 처음 출시했을때 부터 있었던 가장 기본적인 형태의 앱입니다.

해당 스마트폰에 깔린 os(안드로이드, ios등)에 맞는 해당 os 전용의 앱이라고 생각하면 됩니다.

따라서 Native App은 해당 OS가 제공하는 가이드와 프레임워크로 주어진 방식대로 제작되기 때문에

네이티브 앱은 안드로이드 혹은 IOS에서 주어진 모든 자원과 기능들을 활용할 수 있습니다.

하드웨어 자원, 전후 카메라, 내부 파일 시스템들을 각각의 OS가 허용하는 한 얼마든지 직접 활용할 수 있습니다.

즉, 스마트폰의 기능을 최대한 활용할 수 있는 고퀄리티의 앱입니다.

이러한 Native App의 특징은 각각의 OS에 맞춰 개발, 검수를 받아야한다는 과정에 있어 단점도 있고, 고퀄리티의 앱을 개발할 수 있다는 장점도 있습니다.

 

2. Mobile Web Application

모바일 웹 애플리케이션은 스마트폰 사용자들을 대상으로 만든 웹사이트입니다.

스마트폰의 좁은 세로 화면에서 보기 좋게 만들어진 웹이 모바일 웹입니다.

장점으로는 모바일 웹 앱을 개발하게 되면 OS에 상관없이 어느 OS에서도 동작할 수 있고, 내용이 바뀔 때도 해당 사이트만 업데이트하면 되니까 스토어의 검수를 기다릴 필요 없이 원하는 때에 버전없을 할 수 있게 됩니다.

단점으로는 기능과 성능 측면에 있습니다. 웹 사이트라는것은 즉 브라우저에서 돌아가는 컨텐츠입니다.

따라서 이 모바일 웹이 갖출 수 있는 기능은 스마트폰에 깔려있는 크롬이나 사파리 등 브라우저들이 사용할 수 있는 기능에 국한됩니다. 때문에 스마트폰의 모든 자원을 활용할 수 있는 고성능의 게임이나 그래픽 툴 등의 앱은 제작하기 어렵습니다.

 

3. Hybrid Application(하이브리드 앱)

Native Application과 Mobile WebApplication 이 둘 사이에서 절충점을 찾은게 하이브리드입니다.

네이티브로 만들되 그안에 브라우저 창을 둬서, 일부 또는 대부분의 기능을 웹 형태로 제공하는 것입니다.

쉽게 말하자면 안드로이드나 IOS 전용으로 각각 스토어에 올리는 네이티브 앱을 만드는데

그 안에 크롬이나 사파리 같은 브라우저와 같이 웹사이트를 보여주는 창을 하나 넣게됩니다.

이 IOS, 안드로이드에서 둘 다 WebView로 불립니다.

그래서 이 앱을 실행하면 이앱에서 실행한 사이트가 WebView로 실행됩니다.

웬만한 기능들은 웹사이트로 만들어서 이 웹뷰안에서 이용하도록 만들고, 웹사이트로써 구현할 수 없는 기능들은 네이티브 레벨에서 처리하도록 합니다.

 

4. Cross-Platform Application (크로스-플랫폼)

React Native, Flutter, Xamarin과 같은 크로스-플랫폼은 또 다른 방식의 접근입니다.

하나의 언어, 한번의 개발로 안드로이드, IOS에서 모두 동작하는 네이티브 앱을 만들기 위한것 입니다.

React Native에서의 java script, Flutter에서의 다트 또는 자마린의 C#으로 코딩을 하면 IOS와 안드로이드에서 이해할 수 있는 언어로 각각 변환이 되서 폰에서 돌아가게 되는 것입니다.

웹은 웹 브라우저나 웹 뷰가 제공하는 영역의 기능만 사용할 수 있지만 크로스오버 플랫폼은 더 깊은 영역까지 닿을 수 있도록 만들어져있습니다. 플랫폼의 전용 언어를 사용하여 개발한것에 비해서는 아직은 활용할 수 있는 기능들에 그리고 그 속도와 매끄러움에 한계가 있지만, 이미 웬만 앱들을 준수한 퀄리티로 만들 수 있을만큼 발전해왔습니다.

만약 여기에 웹뷰를 통해 사이트를 보여주게 된다면 해당 앱은 크로스 오버 플랫폼이자 하이브리드 앱이 되는것입니다.

 

 

5. Progressive Web Application (PWA)

PWA는 먼저 설명한 것들을 대체하기 위한 것 또는 그것들의 단점을 다 해결할 수 있는 무언가가 아니라

개발하기 쉽고 사용하기 편리한 앱을 만들기 위한 또 하나의 접근법, 방법론입니다.

정확히는 모바일 웹의 한계를 브라우저의 발전을 통해 끌어올린 것입니다.

PWA는 모바일과 데스트톱 모두에서 사용할 수 있는 웹 애플리케이션의 형태로, 웹의 지정된 내용들은 폰에 저장이 되서 오프라인에서도 작동하고, 푸쉬 알림을 제공합니다. 또한, 앱 스토어를 통하지 않고 웹 브라우저를 통해 설치가 가능하며, 네이티브 애플리케이션과 유사한 사용자 경험을 제공합니다. PWA는 웹 애플리케이션과 네이티브 앱의 장점을 결합한 형태로 최근에는 많은 기업에서 채택하여 사용되고 있습니다.