Successfully reported this slideshow.

네이티브 웹앱 기술 동향 및 전망

15

Share

Loading in …3
×
1 of 19
1 of 19

네이티브 웹앱 기술 동향 및 전망

15

Share

Download to read offline

한국 웹20주년 국제 콘퍼런스에서 발표한 자료로 네이트브 플랫폼과 격차를 줄이기 위해 Web Platform이 어떻게 발전해 가고 있는지에 대해 설명한다. 또한 향후 HTML5/Web Platform에 대한 전망도 소개한다.

한국 웹20주년 국제 콘퍼런스에서 발표한 자료로 네이트브 플랫폼과 격차를 줄이기 위해 Web Platform이 어떻게 발전해 가고 있는지에 대해 설명한다. 또한 향후 HTML5/Web Platform에 대한 전망도 소개한다.

More Related Content

Related Books

Free with a 14 day trial from Scribd

See all

Related Audiobooks

Free with a 14 day trial from Scribd

See all

네이티브 웹앱 기술 동향 및 전망

  1. 1. 네이티브 웹앱 기술 동향 및 전망 이 원 석 / 삼성전자 W3C System Applications WG 의장 W3C HTML5 Korean Interest Group 의장 - Native와의 격차를 어떻게 줄일 것인가? -
  2. 2. HTML5/Web의 현안들 …
  3. 3. HTML5/Web의 주요 이슈들 (1/2) <Source: Vision Mobile> 성능과 제한된 HW API 제공이 가장 시급히 해결해야할 이슈
  4. 4. HTML5/Web의 주요 이슈들 (2/2) <Source: Vision Mobile> W3C Device APIs에 대한 브라우저 적용현황 주요 브라우저 간 파편화 이슈에 대한 개선 필요
  5. 5. HTML5 핵심 표준 개발 현황 …
  6. 6. HTML5 Spec < source: http://htmlwg.org/heartbeat/PR-html5-20140916/ > 2014년 10월까지 표준완료 예상 HTML5.1 대신 아이템 별 Spec 개발 여부 검토
  7. 7. HTML5 - Service Workers 오프라인 지원: 개발자가 Web app caching 관리 백그라운드 실행 지원 Persistent 시스템 이벤트 처리 (Push, Alarm 등) 지원 네이티브 앱 수준의 UX 제공 가능 Chromium, Mozilla에서 Top Priority Feature < source: http://www.w3.org/TR/service-workers/ >
  8. 8. HTML5 – Manifest format Web App의 인스톨 정보 제공 Name, Icon, Start URL, Orientation 등 홈스크린 설치, 태스크 관리자 통합 가능 ServiceWorker 오프라인 기능과 함께 Native와 같은 사용자 경험 제공 < source: http://www.w3.org/TR/pointerevents/ >
  9. 9. HTML5 – Push API CP가 단말에 메시지를 Web Push를 이용하여 전송 사용자는 Web 페이지에서 Push 서비스 구독 신청 Browser가 실행되지 않은 상황에서도 message 수신 소규모 CP도 네이티브 App 개발 없이 Web에서 Push 사용 가능 < source: http://www.w3.org/TR/push-api/ >
  10. 10. HTML5 - <picture> and srcset attribute < source: http://arstechnica.com/information-technology/2014/09/how-a-new-html-element-will-make-the-web-faster/?utm_source=html5weekly&utm_medium=email > M-dot Site로 모바일 대응  Responsive Web Responsive Web Design의 이미지 처리 문제 큰 이미지를 CSS를 통해서 작게 처리 모바일 단말에서 로딩 속도 이슈 Chrome 38, Firefox 33, Opera 25 지원 예정 <picture> <source media="(min-width: 650px)" srcset="images/kitten-stretching.png"> <source media="(min-width: 465px)" srcset="images/kitten-sitting.png"> <img src="images/kitten-curled.png" alt="a cute kitten"> <!-- As the fallback --> </picture>
  11. 11. HTML5 - WebRTC •Web Real-Time Communication –Video/Audio/Data 및 P2P 통신 기능에 대한 Web 표준 –Video: 화상통화, 얼굴 또는 객체 인식, 다자간 컨퍼런싱 –Audio: 전화, 음성인식, 음성메일, 음성공유 –Data: 리치 메시징, 게임, 파일/스크린 공유 •표준 현황 (2014년 4Q까지 Last Call Working Draft 예상) –Media Capture and Streams (getUserMedia) –WebRTC 1.0: Real-time Communication Between Browsers •모든 단말 간 화상통화 및 데이터 교환 가능 •향후 IMS와 WebRTC 통합 예상
  12. 12. HTML5 – Web Components •개발자가 자체적으로 HTML 엘리먼트를 만드는 기술 –Templates, Decorators, Custom Element, Shadow DOM, HTML imports 로 구성 •HTML 컴포넌트를 캡슐화 하여 쉽게 적용 •제작한 컴포넌트 재활용하여 개발 효율화 가능 •Material Design with Polymer
  13. 13. Privileged APIs (1/2) < System Applications WG – Phase 1 >
  14. 14. Privileged APIs (2/2) < System Applications WG – Phase 2 >
  15. 15. ES6 - Promise •ECMAScript 6 버전에 표준화 진행 중 •비동기 코드 실행을 추상화한 오브젝트로 기존 Callback의 다중 중첩 복잡도 문제를 해결 •비동기 API 프로그래밍을 동기 API 프로그래밍 스타일로 작성할 수 있도록 하여 코드 Readability를 극대화 •W3C 웹 표준 API Spec에 활용
  16. 16. 정리 및 향후 전망 …
  17. 17. HTML5/Web에 대한 전망 (1/2) •네이티브와 격차 최소화 노력 지속 –성능개선: ServiceWorker, <picture> and srcset attribute –신규 기능 확대 지원: WebRTC, Push, Manifest, Privileged APIs –Web App 개발 최적화 (코드 관리 개선, 파편화 대응 등) •신규기능: ES6 Promise, Web Components 등 •개발도구: 모바일 지원, 성능/로딩타임 Profiler 등 •라이브러리: Polyfill, JS framework 등 •HTML5/Web 기술 장점 극대화하는 방향으로 발전 –설치/업데이트 필요 없는 App 실행 환경 •URL 기반 App 실행, 항상 최신의 App 실행, Device 간 Sync 지원
  18. 18. HTML5/Web에 대한 전망 (2/2) •IDC의 HTML5 향후 전망 –가까운 미래(2017년)까지는 모바일 단말에서 Native App 대체 불가 –그러나, 아래 분야에서는 HTML5 App 큰 성장 예상 •Content publishing app 분야(전자책/매거진), 기업용 App 분야, Hybrid App 분야 •가트너 2014년 모바일 예측 –2017년까지 모바일 단말의 브라우저는 정교한 App 전달 플랫폼으로 발전 •새롭게 개발되는 web app의 50% 이상이 복잡한 자바스크립트로 구성 •이러한 web app은 질 높은 사용자 경험 제공 –HTML5는 다양한 플랫폼 지원을 위한 최고의 기술이 될 전망 –그러나 향후 몇 년간 성능, 파편화, 기술적 미성숙 이슈 존재
  19. 19. < source: http://www.w3.org/20/ >

×