W3C HTML5 표준 기술 동향 - 2017
6 likes1,830 views
This slides is about tech trend of HTML5 mostly focused on industry and W3C. It was presented in W3C HTML5 Conference 2017 in Seoul.
W3C HTML5 표준 기술 동향 - 2017
- 1. W3C HTML5 표준 기술 동향 이원석 (ETRI 표준연구본부) / W3C HTML5 KIG/KCG 의장 @wonsuk73
- 2. HTML5 주요 업계 동향 정리 …
- 4. <Source: https://medium.com/reloading/preload-prefetch-and-priorities-in-chrome-776165961bbf > March 2017 PWA 확대 및 Android Platform 통합 지속 추진 적극적인 신규 기능 추가 Chrome의 점유율 확대로 더 적극적 성능개선을 위한 기능 추가
- 5. <Source: https://blogs.windows.com/msedgedev/2017/01/31/introducing-webrtc-microsoft-edge/ > Jan. 2017
- 9. <Source: https://www.thurrott.com/windows/windows-10/142649/microsofts-bold-plan-bring-pwas-windows-10 > Oct. 2017 내년 상반기 윈도우 10의 핵심 플랫폼 기능으로 PWA 지원 예정 브라우저 기능을 확대하고 이를 윈도우 10과 통합하여 모든 디바이스 플랫폼으로 활용
- 10. <Source: https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_10_1.html > March 2017 사파리 브라우저에 새로운 표준 기술 적용 확대 Fetch API, IndexedDB 2.0, the Gamepad API, Input Events, Custom Elements, CSS Grid, HTML5 form validation, and more
- 11. <Source: https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Safari_11_0/Safari_11_0.html > June 2017 사파리 브라우저에 새로운 표준 기술 적용 확대 WebRTC, Web Assembly 등
- 12. Aug. 2017 <Source: https://twitter.com/webmaxru/status/893027996659060738 > ServiceWorker 개발중?
- 13. <Source: https://hacks.mozilla.org/2017/06/firefox-54-e10s-webextension-apis-css-clip-path/ > June 2017
- 15. <Source: https://blog.mozilla.org/blog/2017/11/14/introducing-firefox-quantum/ > Nov. 2017 <Source: https://hacks.mozilla.org/2017/11/entering-the-quantum-era-how-firefox-got-fast-again-and-where-its-going-to-get-faster/ > 파이어폭스 퀀텀 출시 빠른 성능과 새로운 UX 디자인 적용 최신 웹 표준 기술에 대한 빠른 대응
- 16. <Source: http://www.asiae.co.kr/news/view.htm?idxno=2017102716190033499 > HTML5 기반 카카오 스낵 게임 확대 중
- 17. <Source: http://www.adweek.com/digital/coolgames-tetris-facebook-instant-games/ > HTML5 기반 페이스북 인스턴트 게임
- 18. W3C HTML5 주요 표준화 동향 …
- 19. HTML5 Spec < source: http://www.w3.org/TR/2014/REC-html5-20141028/ > W3C HTML5 최종 표준 (2014년 10월) W3C HTML5.1 표준 (2016년 10월) W3C HTML5.2 표준 - PR (2017년 12월?)
- 20. Web Payments WG < source: http://www.w3.org/TR/2014/REC-html5-20141028/ > 표준 개발과 브라우저 지원이 가장 빠른 기능 구글, 애플, 삼성전자, 알리바바, 비자, 마스터 등 모든 플레이어 참여
- 22. Web Assembly WG < source: https://www.w3.org/2017/08/wasm-charter > 초기 목표 C/C++ 프로그램을 웹에서 안전하게, 네이티브 속 도로 실행할 수 있도록 하는 것
- 24. Use cases for Web Assembly • High performance games (Epic Unreal, Unity) • Audio and Video codecs / 3D model compression • Google Earth • Speech synthesis / recognition • Media applications (Photoshop, After Effects, Maya, Blender, etc.) • Bring existing C/C++ apps to the Web (Linux Stack, Emacs, Vim) • Libraries for cryptography, computer vision, barcode reading • Applications requiring reliable performance, blocking APIs, precise memory control
- 25. <Source: https://blog.mozilla.org/blog/2017/11/13/webassembly-in-browsers/ > Nov. 2017 크롬, 파이어폭스, 사파리, 엣지 브라우저 지원
- 26. WebRTC Spec < source: https://www.w3.org/2017/08/wasm-charter > 6년 동안 개발 API 표준 – W3C 코덱 표준(Opus 및 H.264) - IETF 및 ITU-T/MPEG 프로토콜 표준: IETF (수백 페이지의 표준)
- 27. Service Worker WG < source: https://www.w3.org/2017/08/sw-charter > Facebook 등 기업 요청으로 별도 WG 생성
- 28. Service Worker WG < source: https://wicg.github.io/BackgroundSync/spec/ > 클라이언트 데이터에 대한 백그라운드 데이터 싱크 기능 (onsync serviceworker event)
- 29. WebVR CG < source: https://www.w3.org/community/webvr/ > WebVR API 브라우저 구현 현황 2018년 WG 설립 예정
- 30. WebVR CG • Why WebVR? – VR 사용자 확보의 어려움 – 다양한 디바이스 플랫폼을 지원하는 VR 컨텐츠 확보의 어려움 – VR 사용자와 VR 비사용자 간의 연결 및 경험 공유 – VR 컨텐츠 개발자 확보의 어려움 • WebVR 컨텐츠 활용 예 (Web 컨텐츠를 한단계 업그레이드?) – 실감나는 컨텐츠 서비스(360도 view 등) – 건축가, 인테리어 및 가구업체 들의 활용 – Tripadvisor API와 2D map을 이용한 3차원 호텔 예약 서비스
- 31. WebVR CG • Why WebVR? < source: https://www.w3.org/2017/Talks/ac-slides/ak-webvr/?full#8 >
- 32. WebVR CG • Tech Stack for WebVR
- 33. CSS Houdini < source: https://github.com/w3c/css-houdini-drafts/wiki > CSS Rendering Engine에 대한 Javascript API 표준
- 34. Browser Extension CG < source: https://browserext.github.io/browserext/ > Chrome, Firefox and Edge
- 35. Automotive WG < source: https://browserext.github.io/browserext/ > 커넥티드 카와 차량 내외부의 응용 및 서비스 간 연동 에 필요한 표준 인터페이스 정의 폭스바겐 AG, 재규어 랜드로버 참여
- 36. Automotive Web 해커톤 < source: https://rp.kddi-research.jp/hackathon >
- 37. < source: https://www.w3.org/community/wicg/ > Web Platform Incubator CG WICG Web Platform의 새로운 Feature를 논의하고 제 안하는 Lightweight 장소
- 38. <Source: https://wicg.github.io/shape-detection-api/ > Web Platform Incubator CG 이미지나 이미지 소스에서 얼굴인식, QR 코드 인 식 등 인식 API 크롬, 오페라 지원
- 39. <Source: https://wicg.github.io/web-share/ > Web Platform Incubator CG HTTPS에서만 지원 크롬 61 Android, 오페라 48
- 40. Web Platform Incubator CG < source: https://browserext.github.io/browserext/ > 디렉토리 선택시 디렉토리 내 모든 파일 처리 Chrome, Firefox and Edge 지원
- 41. 정리 및 향후 전망 …
- 42. 정 리 • 네이티브와 격차 최소화 노력 지속 – 성능개선: WebAssembly, ServiceWorker, defer, async 등 – 신규 기능 확대 지원: Web Payments, WebRTC, Generic Sensor, Bluetooth, NFC, – Web App 개발 최적화 (코드 관리 개선, 파편화 대응 등) • 신규기능: CSS, Houdini, Web Components 등 • 개발도구: 모바일 지원, 성능/로딩타임 Profiler 등 • 라이브러리: Polyfill, JS framework 등 – Extension 호환성: Browser Extensions • 주목해야 할 기술들 – WebVR, WebRTC, Web Payments, HTTP HTTPS – Automotive Web, WebAssembly, Physical Web
- 43. 다시 한번 혁신적인 웹 이노베이션 진행 중!! <Source: https://www.w3.org/2017/Talks/tpac-slides/tpac2017-jeff/#core-innovation >