하이브리드앱

19
HybridApp 자자 자자 knight76.tistory.com

Upload: knight1128

Post on 20-Dec-2014

3.637 views

Category:

Technology


4 download

DESCRIPTION

 

TRANSCRIPT

Page 1: 하이브리드앱

HybridApp 자료 조사

knight76.tistory.com

Page 2: 하이브리드앱

Background

Page 3: 하이브리드앱

Background of Application

플랫폼별 이슈(iOS, Android)

Device 별 이슈( 삼성 , LG …)

버전 별 이슈(Android 2.3.3, 3.1iOS 3, 4)

모든 버전에서 동작 가능한 어플 또는 여러 벌의 어플을

개발

• iOS, Android 발생 이전의 기존 핸드폰 /TV 시장과 똑같은 상황이 벌어지고 있음

- Porting Cost 증가 - 유지보수 Cost 증가

Page 4: 하이브리드앱

대안

플랫폼별 이슈(iOS, Android)

Device 별 이슈( 삼성 , LG …)

버전 별 이슈(Android 2.3.3, 3.1iOS 3, 4)

One Source, Multi-plat-form

Web 과 Native 기반에서 동작하는 어플

HybridApp (Hybrid Mobile We-bApp)

Page 5: 하이브리드앱

Android2.3.3

App

iOS 4

App

Android3.1

App

iOS 5

App

각 플랫폼 별로 신경 써야할 내용이 너무 많음

WebKit

Web App

오픈 소스인 Webkit 엔진이 동작되도록 Porting Layer 에 새로운 Device 만 포팅만 해서 사용하도록 함

* 참고 : 블루레이 , DVD 는 DTV java 플랫폼을 이용하고 있음

Device Device

Device Device

De-vice

Porting 관점

Porting Glue

Device Device

넷플릭스기존

배포 단위

Page 6: 하이브리드앱

HybridApp (Hybrid Mobile WebApp) = NativeApp + 모바일 Web

Porting 관점

WebKit

Native Code(Object C)

WebKit

Native Code(Java)

Android App

HTML5 + JavaScript + CSS

1. Device API 나 비공유 부분은 각각의 플랫폼 별로 개발해야 함2. WebKit 을 사용하여 모바일 Web 을 NativeApp 에 적재함

모바일 Web 부분은 HTML5 기반으로 개발되므로 , 모든 플랫폼에서 공유 가능

iOS App

Page 7: 하이브리드앱

Mobile WebApp 개발- NativeApp 으로 어플리케이션을 개발하는 것이 어려움 - 모바일 Web Browser 에서는 HTML5 를 비교적 많이 지원하고 있음 - 단점 : Mobile WebApp 은 카메라 , 마이크 , 파일 등 Device 접근에 제약이

있음

HybridApp (Hybrid Mobile WebApp) = NativeApp + 모바일 Web

- 아직 표준화된 Device API 부재로 인해서 모바일 Web 의 Device 접근성 제약 극복

- HTML5 + CSS3 + JavaScript 을 이용하여 쉽고 , 플랫폼 독립적으로 개발- 단점 : WebKit 및 HybridApp Framework 의 구조적 문제로 속도가 매우 느림

Porting 관점

Page 8: 하이브리드앱

WebKit

Page 9: 하이브리드앱

WebKit Project : 웹 컨텐트를 렌더링하고 , 자바스크립트 오류를 검증 툴을 포함

- Not Brower, Just Engine- BSD-style and LGPL licenses. - 포팅된 플랫폼 : iOS, 심비안 , Google chrome, Safari , Adobe AIR , An-

droid , Amazon Kindle , QT …- MAC OS X system framework version of the engine- Cross Platform C++, 1.8 Million line- Component

- WebCore : HTML 와 SVG 에 대해서 Layout, 렌더링 , DOM 파싱 - JavaScriptCore : 자바스크립트 프레임웍- Drosera :  자바스크립트 오류 확인 툴- Sunspider : 자바스크립트 성능 측정 툴

- WebKit 포팅시에는 WebCore 와 JavaScriptCore 만 사용

Porting 관점

Page 10: 하이브리드앱

KDE Konqueror

Browser(Linux)

KHTML library

KJS library

SafariBrowser

WebCore

JavascriptCore

오픈 소스화

Mac OS 로 포팅

History

Page 11: 하이브리드앱

WebKit Project

WebCore (HTML 파싱 , 렌더링 )

/platforms JavascriptCore( 프레임웍 )

Porting Glue

OS

WebKit API

MAC QT Windows

graphics, network

Architecture

Page 12: 하이브리드앱

Hybrid App 개발 - HybridApp Framework 이용 - NativeApp 에 WebKit 적재

Page 13: 하이브리드앱

- MobileWeb 을 NativeApp 처럼 만들어 주는 Framework- Mobile Web 을 위한 WebKit 제공 - Device 에 접근 가능한 JavaScript 기반 Device API 제공 - NativeApp 과 같이 배포 가능하도록 Packaging 제공

- HTML5 + CSS3 + JavaScript 를 사용하여 App 개발 - One Source, Multi Platform 적용 가능

- JavaScript 를 통하여 MobileWeb 이 접근하지 못하던 Device 에 접근 가능 - 카메라 , 마이크 , 파일 등 - NativeApp 만큼 Deivce 연동이 매끄럽지 못함 - Device 연동 UI 에도 제약이 많음

- PhoneGap, Titanium, Appspresso 등이 유명함

Hybrid App Frame-work

Page 14: 하이브리드앱

PhoneGap (http://www.phonegap.com/)- 많이 유명- WebKit 과 자체 Device API 제공 - iPhone, Android, Blackberry, Palm, Microsoft, Symbian) 지원

Titanium Mobile (http://www.appcelerator.com/) - JavaScript 를 Cross-Compiler 를 통해 Native Code(Objective-C 나

Java) 로 변환해 주는 Framework - Javascript 가 Native Code 로 Invoke- iPhone, Android, BlackBerry 지원

Hybrid App Framework

Page 15: 하이브리드앱

Appspresso (http://www.appspresso.com/) - 국내사인 KTH 에서 개발 - KTH 의 푸딩얼굴인식이 Appspresso 로 개발됨- WebKit 과 Device API 지원- Device API 는 WAC 의 Waikiki 2.0 beta 지원 - 2 개 플랫폼 (iPhone, Android) 지원

Hybrid App Framework

Page 16: 하이브리드앱

NativeApp 에 WebKit 적재

WebKit

Native Code

WebKit

Native Code

Platform B

HTML5 + JavaScript + CSS

Platform A

Page 17: 하이브리드앱

WAC

Page 18: 하이브리드앱

WAC (Wholesale Applications Community)- 세계적인 이동통신사와 제조사들이 통합 AppStore 구축을 위해 만든

커뮤니티- WAC Spec 을 통해 Device API 표준화를 진행중에 있음 (WAC 2.0

나옴 2011 년 6 월 )- Waikiki : WAC 에서 개발중인 OS 독립적인 WebApp 플랫폼 개발

프로젝트 http://public.wholesaleappcommunity.com/redmine/

WAC

Page 19: 하이브리드앱

Thank YouEnd of Document