본문 바로가기
UI UX Design/개발 기초 상식

네이티브 vs 하이브리드 vs 크로스플랫폼

by 들댕댕 2021. 2. 24.
728x90

현재 회사에서 '위치를 기반으로 한 리뷰 서비스'를 진행하고 있습니다.

 

첫 릴리즈 당시 SNS 기능을 갖춘 간단한 맛집 리뷰 서비스였는데 여러 번의 업데이트를 거치며

검색 기능 강화, 위치 기반 콘텐츠 강화, AI 추천 등 여러 기능을 추가, 고도화하고 있습니다.

더하여 마이크로 애니메이션이나 부드러운 트랜지션으로 보다 나은 사용자 경험을 위해

작년부터 리액트 네이티브에서 네이티브로 전환하고 있습니다.

 

여기서 리액트 네이티브는 뭐고 네이티브는 뭐지? 하는 의문이 생겼습니다.

예전에도 비슷하게 웹 앱, 하이브리드 앱, 프로그레시브 앱 방식의 차이가 무엇인지 헷갈렸지만

찾아봐도 헷갈려서 대충 찾아보다 말았던 기억이 납니다.

 

그래서 이참에 요즈음 앱 개발 방식을 정리해보았습니다.

 

네이티브 앱 (Native App)

Android 또는 iOS 같은 어떤 구체적인 플랫폼만을 위해 만들어진 응용 프로그램입니다.

Android 앱 개발의 경우 Kotlin 또는 Java로 네이티브 앱을 만들 수 있고 iOS의 경우 Swift 또는 Objective C로 만들 수 있습니다.

 

장점

Android, iOS 각각의 모바일 운영체제(OS)에서 제공하는 툴과 언어 등에 따라 기능들을 최대한 살리기 때문에, 속도가 빠르고 안정적이면서 동적인 효과를 구현하기에 좋습니다. 또 디바이스 전체에 액세스 권한을 가질 수 있어 기기에 저장된 주소록, 캘린더 등의 고유 정보를 사용할 수도 있습니다. (푸시 메시지, 블루투스, 위치기반 서비스, QR코드 인식, 주소록 연동, SNS 로그인, 인앱 결제 등)

 

단점

다른 방식들보다 높은 수준의 기술력이 필요하며, 각기의 모바일 운영체제(OS) 별로 앱을 개발해야 하기 때문에 개발 기간이나 비용이 많이 들 수 있습니다. 그리고 비교적 업데이트가 까다롭습니다. 코드 기반이 다르므로 개발자는 업데이트를 별도로 만들고 배포해야 합니다.

 

ex) 유튜브 네이버지도 틱톡

 

하이브리드 앱 (Hybrid App)

네이티브 앱과 웹 앱의 기능을 결합한 것이라 생각하면 됩니다.

JavaScript, HTML 및 CSS와 같이 잘 알려진 언어와 프레임 워크를 사용하며, 다양한 플랫폼에서 사용할 수 있는 앱을 빠르게 만들 수 있습니다.

 

장점

단일 코드 기반으로 iOS나 Android에서 동일한 웹페이지를 사용할 수 있으므로 비교적 개발 비용 및 시간이 적게 소요됩니다. 모든 플랫폼에서 일관된 사용자 경험을 제공할 수 있으며 앱 용량도 비교적 가볍습니다. 앱 안에 웹페이지를 불러오는 방식이기 때문에 웹상에 수정 사항이 있는 경우 사용자가 업데이트할 필요가 없습니다.

 

단점

그래픽 집약적 앱의 성능이 떨어지며 네이티브 앱에 비해 동적인 요소의 구현이 어렵습니다. 네트워크 환경과 웹사이트의 용량에 따라 속도가 느려질 수 있습니다.

 

ex) 네이버 크롬 다음

 

크로스 플랫폼 앱 (Cross-platform App)

하이브리드 앱이 웹 기술로 앱을 만드는 것이라면 크로스플랫폼은 둘 이상 플랫폼에서 돌아가는 앱 만드는것이라 할 수 있습니다. 한 가지의 개발 언어와 프레임워크로 iOS나 Android 양쪽 앱스토어에 출시할 수 있는 개발 방식으로, 네이티브 코드가 아닌 코드로 작성을 한 후 각각의 운영체제가 이해할 수 있는 코드로 변환시킵니다. 대표적으로 Google의 Flutter, React의 React Native가 있습니다.

 

장점

코드를 하나만 작성하면 이를 2개 플랫폼에서 모두 사용할 수 있으므로 시간을 굉장히 줄일 수 있고, 리액트 개발자라면 리액트 네이티브로 빠르게 모바일 애플리케이션을 개발할 수 있습니다. 또 하나의 코드로 작성하기 때문에 유지보수도 쉽습니다.

 

단점

역시 네이티브가 아닌 만큼 퍼포먼스를 100% 끌어올릴 수 없고 변환하는 작업이 필요합니다.

 

ex) 에어비앤비 페이스북 인스타그램

 

그리고

 

프로그레시브 웹 앱 (PWA : Progressive Web App)

PWA는 하이브리드 앱과 비슷하지만 약간 다릅니다. 기본적으로 사용자들에게 네이티브 앱의 느낌을 주면서도 웹 브라우저에서 바탕화면에 바로가기를 추가하여 특별한 다운로드와 인스톨 과정 없이 기본 앱처럼 사용할 수 있다는 것이 특징입니다.

 

웹 앱 (Web App)

웹 앱은 모바일 웹과 네이티브 앱을 결합한 형태로 모바일 웹의 특징을 가지면서 네이티브 앱의 장점을 갖고 있습니다. 모바일 웹보다는 조금 더 모바일에 최적화된 앱을 의미합니다.

 

모바일 웹 (Mobile Web)

모바일 웹은 모바일에서 PC용 사이트의 폰트와 이미지, 아이콘 등 데스크톱 브라우저에서 실행되는 기능을 모바일에 맞추어 표현한 사이트를 의미합니다. 쉽게 말해 PC용 홈페이지를 모바일 스크린의 크기에 맞춰 줄여 놓은 것이라고 생각하면 됩니다.

 

728x90

댓글