[시청각 기록] Chrome Full Screen with Trusted Web Activities(Google I/O'19)

이 글은 구글 I/O 19 세션의 시청각 노트입니다.
가상의 독자는 자신이기 때문에 정확성과 망라율에 문제가 있을 수 있다.

References

Speaker(s): Peter McLachlan, Andre Bandarra

Abstract

A Trusted Web Activity (TWA) displays a full screen Chrome browser inside of an Android app with no browser UI. Although Android apps routinely include web content using a Chrome Custom Tab (CCT) or WebView, a TWA offers unique advantages when you need Chrome’s performance and features in your app in full screen mode. This talk will cover how to get started using a Trusted Web Activity, case studies and quality criteria for inclusion in the Play store.
번역하다
TWA(Trusted Web Activity)는 Android 응용 프로그램에서 브라우저 UI 없이 전체 화면 크롬을 시작합니다.Android 응용 프로그램은 CCT(Chrome Custom Tab)와 WebView를 사용하여 웹 내용을 표시할 수 있으며, TWA는 응용 프로그램에서 Chrome의 성능과 기능에서 이익을 얻을 수 있다.이번 회의에서는 TWA를 어떻게 시작하는지, 그리고 사례 연구 및 플레이스토어의 품질 기준에 대해 토론할 것이다.

Contents

WebView는 오래전부터 존재했지만 이런 복잡한 일을 하려면 웹 브라우저를 만드는 일을 해야 한다

WebView는 브라우저라기보다는 렌더링 엔진에 불과합니다

TWA는 웹 콘텐츠를 전체 화면에 표시하는 가장 좋은 방법입니다.

브라우저로서 최신 Chrome의 완벽한 기능으로 사용이 용이함

TWA는 무슨 소용이 있습니까?

본 컴퓨터에 설치되지 않은 기능을 사용하려는 경우

소버전을 고속으로 돌리고 싶을 때

FAQ 등 문서 클래스

전체 화면이기 때문에 본 기기의 요소(라벨 표시줄 등)와 혼합할 수 없음

실제로는 Chrome일 뿐이므로 세션 데이터 등을 Chrome과 공유

WebView, CCT, TWA 차이

TWA 시작 방법

지원 라이브러리 가져오기

디지털 리소스 링크 설정

사이트의 도메인과 안드로이드의 패키지 이름만 지정

TWA 시작(다음 그림)

Android의 Intent 시스템은 웹 라우팅 모드와 유사합니다.

활동은 뿌리

Android 시스템은 라우터

Intent 요청

TWA를 시작하면 보조 라이브러리에서 TWA용 Intent를 만들고 거기로 이동합니다

TWA에서 Android Activity를 열려면 사용자 정의 모드 쓰기

AndroidManifest.xml에 intent-filter 쓰면 됩니다

호스트와 모드를 지정할 수 있으므로 URL로 사용하면 됩니다

Android의 95%를 차지하는 KitKat 이후 버전에서 TWA 작업

Chrome이 설치되어 있지 않으면 어떻게 됩니까?

기본 브라우저가 정상적으로 열립니다(다른 응용 프로그램으로서)

fallback도 직접 쓸 수 있음(예를 들어 WebView에서 열기)

Launcher에서 바로 TWA를 열려면 어떻게 해야 합니까?

AndroidManifest.xml에서 Launcher Activity

로 설정

github.com/GoogleChromeLabs/svgomg-twa 프레젠테이션

전체 화면이기 때문에 TWA에서만 응용 프로그램이 됩니다.

잘 움직이는 PWA 만들기

Lighthouse에 PWA 엠블럼이 있고 점수가 80 이상이면 Play 스토어에 로드됩니다

bücher.de라는 사이트에서 PWA를 TWA로 공개

Myntra에서 TWA를 간이 버전으로 포지셔닝하여 공개

기타 OYO 및 Tencent News 등도 TWA

활용
TWA 로드맵

Splash 화면 사용이 용이함

밀어내기 알림에 대응

Firefox 등 타사 브라우저에서도 TWA

사용 가능

Memo

미묘하지만 FAQ와 로그인 화면 등 어떤 서비스든 이용할 수 있는 경우도 있다