본문 바로가기
세미나

포스트 코로나 시대, 웹의 현재와 미래 1차

by 맑은청이 2020. 9. 10.
728x90
반응형

2020.09.01 

한국인터넷진흥원(KISA) 에서 개최한 '포스트 코로나 시대, 웹의 현재와 미래 1차' 세미나를 들었습니다. 

2차는 24일에 개최하니 관심있으신 분은 보시는 걸 추천드립니다! 

 

https://www.youtube.com/watch?v=1FviNDmfvEA

 

일단은 세미나에 난이도에 대해 굉장히 만족을 했습니다. 

개념들도 잘 설명해주셨고, 일반인들도 이해할 수 있을 정도라 생각이 들었습니다. 

 

1회차에 발표는 다음과 같았습니다. 

△국제 웹 표준 기구(W3C)에서 논의되는 웹 신규 기술·서비스 트렌드와 전망(LG전자 송효진 선임연구원, 한국전자통신연구원 이원석 박사)

△웨일, 크롬 등 웹 브라우저에서의 다양한 기능 및 서비스(네이버 이형욱 리더, 구글 최홍찬 박사)

 

그럼 이제 들었던 내용을 기억하기 위해 정리해보겠습니다.

 

강연을 들으면서 타이핑을 했기 때문에 두서가 없을 수도 있어요..

 

 


 

다들 말씀하셨던 주제는 Web vs. APP 에 관한 내용이었습니다.

APP이 나오면서 웹의 멸종에 대해서는 지금도 논의가 많은데요.

이는 APP 이 모바일 앱 형태로 서비스를 제공하고 브라우저보다 편리하기 때문이죠. 

물론 모바일에서도 웹앱을 많이 사용합니다.  

 

그리고 브라우저에 관한 이야기를 안 할 수가 없는데 많은 분들이 아시듯이 1등 브라우저는 구글의 크롬입니다. 

거의 70%의 점유율이죠. 크롬은 안드로이드 기반으로 동작하고 있습니다. 

크롬은 웹 브라우저를 만드는데 정말 많은 인원을 투입하고 있습니다. 

1500만 명 정도에 개발자가 브라우저를 만들었다고 하네요...(실로 어마어마합니다.) 

구글이 이러한 투자를 하는 것은 광고 비즈니스로 의한 수익 때문입니다. 

(참고로 구글은 16년에 유튜브를 인수했고 18조억원의 수입을 냈습니다.)

 

 

Web 의 핵심

1. HTML

2. URL

3. HTTP

 

 

-HTML (HyperText Markup Language)

: 전적인 HTML 에 대한 대체로 HTML5 개발 

 

-URL(Uniform Resource Locator)

: 사용자와 기기를 넘나들며 리소스 공유에 활용(웹의 핵심 가치 중 하나) 

 

-HTTP(HyperText Transfer Protocol)

: HTTP의 한계를 해결하기 위해 나온 게 QUIC 프로토콜 입니다. 이는 서버와 직접 양방향 통신할 수 있는 Web API 입니다. 

 

 

웹의 전망

1. Web Assembly

2. Progressive Web Apps

3. Fugu Project

4. Web Vitals

5. Media

6. Security 

 

 

-Web Assembly (aka. WASM)

웹에서 네이티브 코드를 실행할 수 있는 환경 제공 

Chrome 84 릴리즈 

 

웹의 적은 네이티브 앱이었습니다. 

핵심은 웹에서 네이티브처럼 동작 가능하게 만들어서 웹의 강점을 살리고 극대화 시키는 겁니다. 

 

 

-PWA(Progressive Web Apps) 

PWA 도 같은 맥락인데요. 굉장히 각광받고 있는 기술입니다. 가지고 있는 한계점만 극복해내면 많은 것들이 PWA 로 대체가 될 것 입니다. 

 

모바일에 앱을 설치하듯이 웹도 설치하는 건데요. 구글이 리드하면서 개발 중이긴 하다 제한이 많기도 합니다. 

IOS 지원, 개발의 어려움, 배포의 어려움, 낮은 가용성 등이 있겠습니다. 

 

-Fugu project 이는 PWA 와 연관 시킬 수 있을 거 같습니다. 아래에 좀 더 자세히 기술 하겠습니다. 

 

-Web Vitals

구글에서 내놓은 웹 가치? 를 판단하는 지표입니다. 

 

-Media 

이미지는 중요하죠. 이를 어떻게 웹에 적목시킬지에 대한 이야기 입니다. 

실시간으로 다운을 받아야하기 때문입니다. 

 

-Security

1) HTTPS 

2) SOP(Same Origin Policy)

3) Site Isolation 

 

 


커넥티드카 유즈 케이스

즉 차가 인터넷과 연결되어 있는건데요. 지금도 있습니다. 바로 네비게이션이죠. 

차 자체를 센서로 만들어 버릴 수 있습니다. 

가장 중요한 건 관제이죠. 다음과 같은 서비스를 제공할 수 있을겁니다. 

 

▶전체 상황을 회사에서 모니터링을 하면서 운전자 패턴 분석 -> 보험료 선정 

주차장 예약 등을 통해 차와 서비스를 연동시킬 수 있겠죠.

 

회사에서는 이런 데이터를 모아서 서비스 업체에 제공해 수익 창출이 가능해 질겁니다. 다양한 서비스를 제공할 수도 있겠죠.

 

W3C와 GENIVI(네비게이션을 만드는 업체) 가 협력하고 완전차 제작이 가능한 볼보나 여러 기업들이 협력하고 있기 때문에 중요한 의미를 가집니다. 

 

VISS : 네비게이션에 올라건 차량 클라우드의 데이터를 모아서 생태계를 생성할 수 있음 

VIAS : 표준은 아님 

 

현재의 업계가 원하는 건 휴대폰에 앱을 설치하듯이 차도 연결하고 싶어한다는 점입니다. 

 

여기서 자율주행 차 보안에 대한 질문을 했습니다. 

업계에서도 이 부분에 대한 신경을 많이 쓰고 있고 차 안에는 크게 두개의 컴퓨터가 있는데 하나는 엔진 컨트롤 유닛으로 자율 주행을 총괄하는 ECU 이고 하나는 네비게이션 쪽인 IVI 입니다. 

ECU과의 통신은 제한적입니다. idle 인터페이스를 정의하는 언어를 통해서 static 하게 생성된 코드를 통해서만 ecu 와 통신하게 합니다. 즉 개발자가 건들고 싶어도 할 수 없다는 거죠. 정의된 코만 통신하게 만들어서 위험을 낮추는 겁니다. 

 

또 네비게이션 사이에 firehole 이라는 걸 둬서 ECU 접근에 제어를 둡니다.  

 

 


이형욱 리더 네이버 웨일 

웹의 현재에 관련된 이야기

 

-HTML Lazy loading 

: 이미지들을 한꺼번에 받고 시작하면 보지도 않는 걸 다운 하게 됩니다. 

그래서 이 기능은 실제 화면에 보이는 것만 다운하고 사용자가 보는 것만 로딩하게 됩니다. 

 

- 이미지 최적화 , Client Hints

: 갖고 있는 단말의 정보를 보내서 서버에서 맞는 걸 보내줌 

 

-Resource Hints

 

-Priority Hints

 

-Web Packaging 

하나하나 전송하는 게 아니라 리소스 여러개 패킷해서 전송 

MHTML 와 유사하고 차이점은 자바스크립트 사용이 가능하다입니다. 

 

보안 관련 기능 Same Origin Policy(SOP) 

: 샌드 박스 정책 

이것만 쓰기에는 기능을 제공하기 힘들기 때문에 나온 게 CSP(Content Security Policy) 입니다. 

Cross-Origin Resources Sharing(CORS) 도 있습니다. 

 

-Secure Context 도 중요합니다. 

:웹에서 제공해야하는 최소한의 안전 영역입니다. 

 

 

-Blocking mixed contents 

: http 로 기능하는 게 https 안에 섞여있는 것. 

이를 차차 정리중이라고 합니다. 

 

-Goodbye TLS 1.0 and TLS 1.1

: 1.2 가 나온지 10년이 지났는데 아직도 쓰는 데가 많다고 합니다. 

 

-Subresource Integrity 

: 안전하게 딜리버리 하는 건데 해시값을 매번 만들어야 되는 단점이 있습니다. 

 

-SRI cache

: Cross domain 이라도 같은 걸 쓰면 cache 를 동일하게 쓰도록 허용해 로딩을 개선할 수 있습니다. 

 

-New Default Referrer-Policy 

: 사용자가 어떤 경로로 들어왔는지 확인합니다. 

사실 보안에는 좋지만 서비스 입장에서는 좋은 기술이 아닙니다. 

 

-Same Site Cookies 

: 일분 조건에만 쿠키 사용을 제한하는 겁니다. 

 

-First-Party Sets

: 개인 정보 보호, 웹사이트 개발이 어렵습니다. 이는 같은 회사여도 다른 도메인을 운영하는 경우 쿠키 공유가 안되기 때문인데요. 이를 해결하기 위해 나온 방식으로 도메인을 그룹핑해줍니다. 

 

-Web Crypto API

 

-Web Authentication API

: 최근 핫한 파이도입니다. 

대부분 브라우저에서 지원해주고 생체나 키로 로그인 하는 것이죠

 

-세이프 브라우징

: 구글이나 여러 회사에서 협력하여 만든 DB 로 검사하여 사용자가 피싱사이트에 들어가는 걸 실시간으로 알 수 있게 방어하는 기술입니다. 

 

-WebXR

: 웹에서 AR, VR로 가능하게 합니다. 다양한 서비스를 제공하는 거죠.

 

-WebCPU 

: 화면 랜더링 뿐만 아니라 기존에 할 수 없던 연산이나 그래픽이 웹에서도 가능해질 겁니다. 

 

-WebNN API 

: 핫한 AI 입니다.

현재는 한정된 API 를 제공하고 있습니다. 성능과 커버리지 문제 때문인데요. 이를 해결하고자 기존의 모델을 로드하고 실행함을 망라하는 API 를 제공합니다. 즉 AI processing 이 가능 한 겁니다. 

 

 


 

최홍찬 박사(구글)

구글 크롬 웹기능팀 테크 리드

W3c Web Audio API표준 편집장

 

핵심은 Fugu Project 였습니다.

너무 재밌게 잘 들었는데요.

Fugu 는 복어라는 의미입니다. 

잘 요리하면 맛있지만 잘못하면 죽잖아요?

이 프로젝트의 이념이 들어있는 겁니다. 

 

웹이 5년 뒤에도 성공한 플랫폼이기 위해서

-웹 표준화의 속도 개선

-개발자와의 소통

-필요 기능의 구현 

 

즉 개발자들이 활용할 API 들을 제공하는 겁니다. 

 

'웹에서는 안 돌아가겠지' 라는 생각을 안 하게 말입니다. 

 

웹 플랫폼과 네이티브와의 기능 차이를 줄이고 웹의 장점은 그대로 보존하면서 개발자들이 웹에서 새로운 경험을 만들어 낼 수 있도록 하는 겁니다. 

 

1. 권한 허가

2. 개인정보 보호

3. 보안

 

위와 같은 3가지 사항이 충족이 돼야 겠습니다. 

 

흥미로운 사실 하나를 알았는데 애플이 외부 웹킷이 허용이 되지 않아 아이폰에서 크롬이나 파이어폭스를 켜도 결국 사파리 위에서 돌아가는 거라고 하네요. 이로 인해 크롬에서 API 제공이 불가능하다고 합니다. 구글에 건의를 해도 소용이 없다고 하네요..(왜 이렇게 하는 걸까요?) 

 

다음은 이런 푸구 스튜디오를 통해 엡데이트한 유의미한 프로젝트들을 소개합니다. 

 

 

-Google Earth Studio 의미있는 업데이트

Native File System API (큰사이즈 이미지 랜더링 가능)

NaCI -> WASM(크롬이 아닌 다른 곳 사용 가능)

 

 

-스트림 게임

기술 발전은 최근 빛나는 성장

사용된 API

Game Pad API

Pointer Lock API 마우스가 윈도우 밖으로 나갈 수 없도록 잠그는 과정

WebRTC

Web Audio API

 

-ZOOM

접근성이 문제점이었음

설치를 해야만 가능했음

초등학생도 사용해야함

자사가 가능한 독자적인 비디오 기능이 웹에서는 불가능했음

 

WebCodec

WebTransport

Audio Worklet

WASM SIMD(벡터화된 수치영상)

 

이런 성과로 원활한 서비스 가능

 

-잔디소프트

자체 개발 HTML5 게임엔진

웹 게임 기반에 기능을 극한으로 올림

넷마블과 퍼블리싱 계약을 함

 

 

 

 

이제 FUGU Project 에 미래에 대해 이야기 해봅시다. 

intel 과 협력 중이고 작년에 독자적 브라우저 개발을 포기한 Microsoft 도 참여 줍니다. 

 

또 데스크탑 PWA 에 관심을 가지고 있습니다. ( 위에서 구글이 리드하고 있다고 언급되었습니다.)

설치가 가능한 웹, 앱 같은 웹. 이는 혁식이라고 할 수 있는거죠. 

 

왜 PWA 가 데스크탑에서 더 큰 의미일까요?

데스크탑이 좀 더 진입장벽이 높고 강력한 API 와 높은 처리 성능을 가지고 있는데 PWA 가 이를 웹으로 끌고 올 수 있어서 입니다. 

 

 

 


이번 세미나를 통해 정말 재밌고 흥미로운 사실들을 많이 알게 되었습니다!

빨리 2회차도 봤으면 좋겠습니다ㅎㅎ

너무 막 작성해서 필요없겠지만 강의 들으면서 정리했던 파일도 올려봅니다. 

 

포스트코로나시대,웹의현재와미래.hwp
0.16MB

728x90
반응형

'세미나' 카테고리의 다른 글

POC2020 온라인 컨퍼런스  (0) 2020.11.11
제 9회 서울여대 정보보호 레몬 세미나 후기  (0) 2020.09.26
Decentralize Web  (0) 2020.09.24
지능형 에지 컴퓨팅 기술  (0) 2020.09.23
포스트 퀀텀 세미나 내용 정리  (0) 2020.08.19