Notice
Recent Posts
Recent Comments
Link
«   2025/05   »
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
Archives
Today
Total
관리 메뉴

주니어에서 시니어로

웹뷰(WebView)란? 본문

STUDY/React Native

웹뷰(WebView)란?

_JJ_ 2023. 3. 22. 10:30

웹뷰(WebView)란?

프레임워크에 내장된 웹 브라우저 컴포넌트로 뷰(View)의 형태로 앱에 임베딩하는 것을 말한다.

즉, 앱 안에 HTML iframe을 넣은 것. 즉, 앱 내에 브라우저를 넣는 것이다.

웹 페이지를 보기 위해 혹은 앱 안에 HTML을 호출하여 앱을 구현하는 하이브리드 형태의 앱을 개발하는 데에도 많이 쓰인다.

 

 

장점

  • 하이브리드 앱은 안드로이드 네이티브 앱에 비해 개발이 비교적 쉽다
  • 네이티브 앱 수정/배포 절차를 거치지 않고도 웹뷰로 구성된 부분은 웹 배포만 하면 수정 내용 반영이 되기 때문에, 배포 주기를 빠르게 가져갈 수 있다
  • 안드로이드/IOS 동시 서비스의 경우 웹뷰 하나 수정하면 동시 반영 가능 - 개발 공수 줄어듦
  • 기기 간의 호환성을 해결하기가 상대적으로 편하다
  • 타 웹 사이트 링크로 가는 기능 등을 지원하기 위함

단점

  • 네이티브와 같은 사용자 경험을 온전하게 주기 어렵다.
  • 웹뷰 사용 시 플레이스토어/앱스토어 심사가 반려되는 사유가 될 수도 있다.
  • 애니메이션 등 다양한 UI 효과를 넣기 어렵고, 속도가 느리다.
  • 기능적인 접근 제약이 있다.

 

 

 

어떤 경우에 쓰는게 좋을까?

일부 디바이스 접근 기능이 필요하고, 쉬운 유지, 보수, 업데이트가 필요한 경우 사용하는 게 좋다.

 

1. 콘텐츠가 지속적으로 업데이트 되는 경우: 포털 앱(네이버, 다음, 구글), 쇼핑 앱(11번가, 쿠팡)

2. 보안이 중요한 경우: 은행 앱, 카드 앱

 

 

 

보통 은행 앱들은 하이브리드 앱을 사용하는 반면, 카카오뱅크는 속도와 UX, 장기적인 비용적 측면에서

네이티브 앱을 선택했다고 한다. 개인적으로 네이티브 앱을 선택한 이유 중 1개의 코드 베이스로 2개를 운영하는 게 더 어려워서..라는 부분이 공감이 갔다. 

광고가 많아 읽기에 귀찮긴 하지만 앱을 만드는 과정과 시행착오가 고스란히 느껴져 재밌게 읽었어서 링크를 남긴다. 

 

 

카카오뱅크 모바일앱 개발 이야기

박이랑(bernard.park) / 카카오뱅크 --- 카카오뱅크의 모바일앱은 어떻게 개발되었는지 그 험난한 비하인드 스토리에 대해 얘기하고, 기존 은행에 대한 불편한 점들을 어떻게 카카오뱅크만의 차별점

www.slideshare.net

 

 

 

 

reference

https://brunch.co.kr/@ea75351aef0f41e/3

https://devowen.com/389

https://velog.io/@dear_sopi9211/%EC%95%B1-%EA%B0%9C%EB%B0%9C-%EB%B0%A9%EB%B2%95%EC%9D%98-%EC%9E%A5%EB%8B%A8%EC%A0%90%EA%B3%BC-PWA

https://developer.android.com/guide/webapps/webview?hl=ko 

https://developer.apple.com/documentation/uikit/uiwebview

'STUDY > React Native' 카테고리의 다른 글

[RN/Android] APK, AAB 파일 추출  (0) 2023.03.13