네이버가 바라보는 웹 기술 및 환경 전망

박종목

Naver LABS

2015-12-09

웹 기술과 환경의 격차

웹 기술 현황 및 전망

웹 환경 현황 및 전망

요약 및 정리

CONTENTS

웹 기술과 환경의 격차

웹 기술 vs. 사용자 환경

Technology Specification Implementations

(Browsers) Operating Systems Devices

웹의 파편화 (Fragmentation) 문제

Device Fragmentation OS Fragmentation Web Browser Fragmentation

비표준 대체 기술

extension TBD

• Low Adoption Rates for HTML5

– Development Cost

– Immature Features

[Source: http://www.slideshare.net/DipeshMukerji/html5-mobile-web]

웹의 파편화 (Fragmentation) 문제

웹 기술 현황 및 전망

네이티브(Native) 대비 웹 기술의 경쟁력

HTML5 mobile web browser에서 Native App (Android) 수준의 기능 구현 가능성

HTML5 제약 사항

Performance

Capabilities

Productivity

W3C Open Web Platform

[Source https://www.w3.org/blog/2014/10/application-foundations-for-the-open-web-platform/]

W3C의 Web Fragmentation 이슈 대응 현황

• W3C Advancing Web Platform Application Testing CG

- 웹 파편화 이슈를 본격적으로 다루기 위해서 만들어진 새로운 Community Group.

W3C의 HTML5 발전 방향

Performance

• Performance Timeline, Network Optimizations, …

Capabilities

• Service Worker, Push Notification, …

Productivity

• Web Components, ES6, DevTools

Web Browser Engine

Apple vs. Google commits Top 10 companies after Apple, Google

WebKit Active Contributors (~2012)

WebKit Chromium

Blink Fork Blink Fork

WebKit/Chromium Active Contributors (~2015)

Web Browser Engine

WebKit Major Contributors (2015.01.01 ~ 2015.11.18)

Web Browser Engine

WebKit Active Contributors (2015)

Blink Major Contributors (2015.01.01 ~ 2015.11.18)

Chromium은 프로젝트 내부에

서브 모듈이 너무 많기 때문에

통계를 내기 어려움이 있어서

Blink 만 2015년도 Major

contributor 카운트 하였음.

Web Browser Engine

Blink Active Contributors (2015)

Web Browser Engine : 최근 진행 사항

WebKit

• JavaScriptCore : FTL JIT, B3, EcmaScript 6

• Complete initial implementation for Shadow DOM

• CMake for Mac and Win ports

• Web Animation

• CSS JIT

• Network process on WebKit2

• How to encourage more WebKit open source contribution

Blink

• Memory optimization

• Graphics rendering optimization

Skia, zero copy, GPU-accelerated path, etc

• New CSS, HTML5

WebAudio, CSS flexbox, CSS Motion Path, CSS Scroll Snap Points, Web NFC API, WebUSB API, ETC.

JavaScript

JavaScript

JavaScript 관련 표준

출처: http://www.ecma-international.org/ecma-262/6.0/

ECMAScript 6th Edition

https://github.com/lukehoban/es6features/blob/master/README.md

promises/concurrency number and math enhancements guards and trademarks (an alternative to static typing) operator overloading value types (first-class number-like objects) new record structures (records, tuples and typed arrays) pattern matching traits

ECMAScript 7th Edition (Under Progress)

웹 환경 현황 및 전망

웹 브라우저 점유율 (2008)

출처 - http://dadaviz.com/s/browser-popularity-country

웹 브라우저 점유율 (2015)

출처 - http://dadaviz.com/s/browser-popularity-country

웹 브라우저 점유율 추이

웹 브라우저 환경 - HTML5 Spec 지원 현황

Desktop

Mobile

웹 브라우저 환경 - HTML5 Spec 지원 Timeline

Desktop

웹 브라우저 환경 - HTML5 Spec 지원 Timeline

Mobile

JavaScript Engine Implementations

ECMAScript 6th Edition Features

http://kangax.github.io/compat-table/es6/

Android OS 환경 확산 Timeline

http://opensignal.com/reports/2015/08/android-fragmentation/

Smartphone OS Market Share Trends

Future of Web Operating Systems ?

요약 및 정리

Summary

웹 기술과 환경의 격차로 인해 웹의 발전 속도 저하

• Web Fragmentation 이슈

웹 기술의 발전 현황 및 방향

• Open Web Platform

• Web Engine 파편화 (Webkit vs. Chromium/Blink) 및 고도화

• JavaScript 언어의 발전 ECMAScript 6th, 7th Edition

웹 환경의 발전 현황 및 방향

• HTML5 spec 지원 수준 향상

• JavaScript 환경의 ECMAScript 6th Edition 지원 수준 미비, 향상 필요

• Web Operating System의 미래

Android / ChromeOS의 통합 방향성에 좌우

바람직한 웹의 발전 방향

표준 Web Specification 및 API 강화

단말기 제조사, OS Platform Provider, Browser Vendor가 모두 최신 HTML5 스펙 지원 및 동일 성능 / 안정성 제공

• 단, 현존 웹 환경은 대부분 해외 기업에 의존도가 높음 (Microsoft, Google, Apple)

• 단말/OS/Browser 조합별 HTML5 성능/안정성 측정 방식 공용화 필요

사용자들이 최신 단말/OS/브라우저 환경 활용

감사합니다.