32
1 1 ETRI 표준연구센터 서비스융합표준연구팀 wslee@{etri.re.kr, w3.org} Developing Offline Web Apps

Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

  • Upload
    others

  • View
    2

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

11

ETRI 표준연구센터서비스융합표준연구팀

이 원 석wslee@{etri.re.kr, w3.org}

Developing Offline Web Apps

Page 2: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

22

웹 응용웹 응용이란?웹 응용의 종류

웹 응용의 문제점

Offline 웹 응용 사례

Offline 웹 응용 아키텍처

Offline 웹 응용 툴킷Google gearsDojo offline

Offline 웹 응용 표준화

결론 및 향후 전망

참고문헌KRNET 2008

목차

Page 3: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

33

웹웹 응용응용

KRNET 2008

Page 4: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

44

브라우저 기반 응용

자바스크립트 + XHTML + CSS 기반 개발(웹 표준 기반)모바일 단말의 리소스/기능 사용 제한

웹 응용이란?

KRNET 2008

워드프로세서

Page 5: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

55

웹 응용의 종류

KRNET 2008

Web apps Google ZohoWord Processor Google Docs Zoho Writer

Spreadsheet Google Spreadsheet Zoho Sheet

Slideshows Google Presentation Zoho ShowWeb Clippings Google Notebook Zoho Notebook

Email Gmail Zoho MailChat Google Talk Zoho ChatWiki (Google acquired JotSpot) Zoho Wiki

Database Application Zoho CreatorOnline Database Zoho DB

Project Management Zoho Projects

Web Conferencing (Google acquired Marratech) Zoho Meeting

Customer Relationship Manager Zoho CRM

Personal Organizer Zoho Planner

Web site hosting Google Page CreatorFeed Reader Google Reader

Personalized Homepage iGoogle (Zoho Start Page only for Zoho Apps)

점차 웹 응용과 데스크탑 응용의 영역에대한 구분이 사라지고 있음

Page 6: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

66

웹 응용은 인터넷에 연결된 상태에서만 정상적으로동작

사용자는 오프라인 상태에서도 e-메일 클라이언트, 오피스 응용 등 다양한 응용의 사용을 원함

예)비행기 안에서 업무 처리를 위한 메일 작성, 문서 작성등이 가능해야 함

웹 응용의 문제점

KRNET 2008

Page 7: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

77

Offline 웹 응용 사례 [1]

KRNET 2008

Page 8: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

88

Offline 웹 응용 사례 [2]

KRNET 2008

Page 9: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

99

Offline 웹 응용 사례 [3]

KRNET 2008

Page 10: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

1010

OfflineOffline 웹웹 응용응용 아키텍처아키텍처

KRNET 2008

Page 11: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

1111

AJAX 기반 웹 응용 아키텍처

KRNET 2008

Page 12: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

1212

내부 데이터베이스를 이용한 읽기 및 쓰기

동기화를 위해 수정 내용 큐잉

UI와 서버 통신의 완전한 분리

Offline 웹 응용 아키텍처

KRNET 2008

Page 13: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

1313

OfflineOffline 웹웹 응용응용 툴킷툴킷

KRNET 2008

Page 14: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

1414

하나의 응용은 하나의 URL로 표현

온라인/오프라인 간의 자연스러운 지원

온라인 상황에서도 로컬 데이터 사용 능력 지원

모든 플랫폼, 모든 사용자에 대한 가능성

오프라인 웹 응용의 철학

KRNET 2008

Page 15: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

1515

브라우저 플러그인FirefoxInternet ExplorerOpera and safari ?

라이선스오픈 소스(New BSD 라이선스)

Google Gears

KRNET 2008

Page 16: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

1616

개발자들에게 오프라인 지원 웹 응용 개발을 지원하기 위한오픈 소스 브라우저 확장

Google docs: offline 지원Gmail 및 Google Calendar: offline 지원 예정

구성 요소LocalServer

응용 자원(XHTML, 자바스크립트, 이미지 등)을 내부적으로 캐쉬하고서비스함

Database관계형 데이터베이스 내부에 데이터 저장 관리 + full text search

WorkerPool자바스크립트에 쓰레드 유사 기능 지원

Google Gears

KRNET 2008

Page 17: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

1717

HTTP/HTTPS 요청을 캐싱된 데이터를 이용하여 제공

네트워크 상태와 상관없이 요청된 URL에 대한 자원의 캐싱 여부에따라 처리

자원 저장의 두 종류ResourceStore

자바스크립트를 이용해 임시의 URL들을 캠쳐링

응용들이 URL로 식별되는 사용자 데이터 파일의 저장을 허용(e.g. PDF, image)

ManagedResourceStoremanifest 파일에 선언된 URL들을 캡쳐링

웹 응용 실행에 필요한 자원의 집합의 캡쳐링 허용

Manifest 파일의 버전이 변경되는 경우 자동 업데이트 실행(checkForUpdate() 메소드 이용)

차이점: 리소스에 대한 자동 업데이트 지원 여부ManagedResourceStore: 자동 업데이트

ResourceStore: 수동 업데이트

LocalServerLocalServer

KRNET 2008

Page 18: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

1818

캐쉬된 URL의 컨테이너

각각의 3가지의 속성에 의해서 식별name: 저장 자원을 식별하기 위한 이름

requiredCookie: 저장 자원의 쿠키 요구 여부

domain: 현재 페이지의 도메인, 프로토콜과 포트

-- ResourceStoreResourceStore

KRNET 2008

Page 19: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

1919

독립된 manifest 파일에 응용에 대한 자원들 기술

각각의 자원을 캡쳐 및 업데이트 제공

자동적인 업데이트 지원

각 응용에 대해 다수 사용자 지원

- ManagedResourceStore

KRNET 2008

( ManagedResourceStore 코드 예 )

Page 20: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

2020

manifest 화일JavaScript Object Notation (JSON) 폼맷

KRNET 2008

- ManagedResourceStore

Page 21: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

2121

사용자 컴퓨터에 사용자 데이터를 영구적으로 저장

SQLite + full-text search 기능 확장

데이터베이스 파일 위치

Database

KRNET 2008

Page 22: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

2222

데이터베이스 생성

데이터베이스 검색

Full-text Search

KRNET 2008

db.execute('CREATE VIRTUAL TABLE recipe USING fts2(dish, ingredients)');

var rs = db.execute('SELECT dish FROM recipe WHERE recipe MATCH ?', ['tomatoes']);

Page 23: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

2323

자바스크립트에 스레드 기능 제공

브라우저 UI가 블록되는 문제 해결

IPC 기반 통신 제공(sendMessage() 사용)동기화에 활용

WorkerPool

KRNET 2008

Window, document no access

Message passing

User Interface

Page 24: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

2424

WorkerPool 코드 예

KRNET 2008

Page 25: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

2525

Google gears 기반 툴킷으로 상위 레벨 API와 추가 기능 제공

주요구성Offline widget(on/offline detection)Sync framework

Offline 상황에서 실행된 액션들을 저장하고 , online이 되면 서버와 sync 기능 제공

Slurp()응용과 관련된 모든 리소스를 스캔

Dojo storage, Dojo SQLEncryption

Dojo offline

KRNET 2008

(Offline widget 예)

Page 26: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

2626

데이터 저장소Dojo SQL

Gears의 SQLite 구현 위에 위치

Encryption 지원

Dojo Storage간단한 해쉬 테이블(키/값 쌍)

Dojo offline

KRNET 2008

Page 27: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

2727

Offline Offline 웹웹 응용응용 표준화표준화

KRNET 2008

Page 28: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

2828

HTML 5 표준 개발에 포함Offline 웹 응용 API 표준화 진행 중

Offline Web Applications2008년 6월 3일 초안 발표

W3C Working Group Note

표준화 대상SQL APIsOffline application caching APIsRelated APIs

Online/offline events APIsStatus APIsLocal Storage API

W3C HTML 5

KRNET 2008

Page 29: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

2929

결론결론 및및 향후향후 전망전망

KRNET 2008

Page 30: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

3030

안정적인 Offline 툴킷 기반 유무선 Offline 웹응용 지속적으로 증가

W3C HTML WG에서 Offline 웹 응용 표준개발 중

웹 응용이 offline 문제를 해결함에 따라 웹 응용활용이 더욱 증가할 것으로 예상

아직 웹 응용은 아직 해결해야 할 많은 문제들이있으나 향후 이러한 문제들이 해소되면 ?

결론 및 향후 전망 [1]

KRNET 2008

Page 31: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

3131

결론 및 향후 전망 [2]

KRNET 2008

출처: http://almaer.com/blog/category/gears

Page 32: Developing Offline Web Apps · 2012. 5. 9. · Slideshows Google Presentation Zoho Show Web Clippings Google Notebook Zoho Notebook Email Gmail Zoho Mail Chat Google Talk Zoho Chat

3232

Creating Offline Web Applications With Dojo Offlinehttp://docs.google.com/View?docid=dhkhksk4_8gdp9gr

Getting Started with Google Gearshttp://immike.net/blog/2007/05/31/getting-started-with-google-gears/

Google Gears APIhttp://code.google.com/apis/gears/

Slideshows for tag: offlinehttp://www.slideshare.net/tag/offline?order=popularity

The Dojo Offline Toolkit http://dojotoolkit.org/offline

W3C Working Group Note 30 May 2008, “Offline Web Applications”,http://www.w3.org/TR/offline-webapps/

Web 2.0 Take the Web Offline to the Desktophttp://www.docstoc.com/docs/525367/Web-20-Take-the-Web-Offline-to-the-Desktop

참고자료

KRNET 2008