openHAB & webapp

이태영

Story

발단 전개 위기 절정

결 말

발단

https://www.facebook.com/groups/openHAB

전개

전개

전개

http://www.w3.org/2011/02/mobile-web-app-state.html

전개

전개

User Interface○ Overview openHAB 와 연결되있는 다른 technology 와 device 들이 서로 연계될 때 동일한 형태의 UI 를 제공 (Home Automation system 또는 다른 컴포넌트 타입에 종속되지 않음 )

○ Classic UI- Classic UI 는 WebApp.net 기반 Framework 을 기반으로 한 Web Interface 로 어떠한 web browser 를 통해 접속 가능하다 .- WebApp.net 는 순수 HTML5/JS 솔루션이지만 , iPhone App 와 비슷하고 , Touch 기능에 최적화 되어있다 . 이것은 iPhone/iPad 뿐만이 아니라 Android 에도 완벽하게 동작하며 , 심지어 Symbian 과 Blackberry 도 지원한다 .

○ WebApp.net- iPhone 용 웹어플리케이션을 만들 때 사용할 수 있는 오픈소스로 Mac 의 CoCoa 에서도 포함된 WebKit 라이브러리를 기반으로 만들어 졌음 . Google 의 안드로이드도 WebKit 을 기반으로 지원하기 때문에 WebApp.net 을 사용하면 Android 에서도 사용할 수 있다 .

위기

http://demo.openhab.org:8080/openhab.app?sitemap=demo

절정

http://webapp.net.free.fr/Demo/Index.html

● Browser 엔진 성능 특성 이해한 개발 필수

● 성능 관련 Practice 요약 ○ DOM 및 Render Tree 의 복잡도 관리

■ DOM, Render Tree 의 생성 및 삭제 원리 이해 ○ CSS 2D/3D 기반 GPU 가속 Rendering 효율적 활용

■ Animation 단위 === RenderLayer/Graphics Layer 단위 ○ 우선 순위가 높은 연산이 먼저 처리되도록 통제

■ UI animation 을 부드럽게 하기 위해 painting/network loading 미루기 ○ DOM inspector 를 활용한 profiling

■ timeline, CPU, heap memory 분석

절정

Browser Engine Overview

Browser Engine Overview

● Parsing 하면서 내부 Tree 생성 ○ DOM, Render, RenderLayer, GraphicsLayer(GPU)

절정

https://github.com/openhab/openhab/tree/master/bundles/ui/org.openhab.ui.webapp

절정

Webkit Main Flow

결 말

Q & A