이 페이지는 Cloud Translation API를 통해 번역되었습니다.

Chrome 67의 새로운 기능

Pete LePage

프로그레시브 웹 앱이 데스크톱에 도입됩니다.
일반 센서 API를 사용하면 가속도계, 자이로스코프와 같은 기기 센서에 훨씬 더 쉽게 액세스할 수 있습니다.
BigInt를 사용하면 큰 정수를 훨씬 쉽게 처리할 수 있습니다.

이 외에도 다양한 기능이 있습니다.

저는 피트 르페이지입니다. Chrome 67에서 개발자를 위해 새롭게 제공되는 기능을 살펴보겠습니다.

변경사항의 전체 목록을 확인하려면 Chromium 소스 저장소 변경사항 목록을 확인하세요.

데스크톱 PWA

Spotify의 데스크톱 프로그레시브 웹 앱

이제 ChromeOS 67에서 데스크톱 프로그레시브 웹 앱이 지원되며 Mac 및 Windows 지원 작업도 이미 시작되었습니다. 설치되면 다른 앱과 동일한 방식으로 실행되며 주소 표시줄이나 탭 없이 앱 창에서 실행됩니다. 서비스 워커는 빠르고 안정적이며 앱 창 환경은 통합된 느낌을 줍니다. 또한 사용자에게 몰입도 높은 환경을 제공합니다.

시작하는 방법은 지금 하고 있는 것과 다르지 않습니다. 기존 프로그레시브 웹 앱에 실행한 모든 작업이 계속 적용되므로 추가 중단점만 고려하면 됩니다.

앱이 표준 PWA 기준을 충족하면 Chrome에서 beforeinstallprompt 이벤트를 실행하지만 사용자에게 자동으로 메시지를 표시하지는 않습니다. 대신 이벤트를 저장한 다음 앱에 앱 설치 버튼과 같은 UI를 추가하여 사용자에게 앱을 설치할 수 있다고 알립니다. 그런 다음 사용자가 버튼을 클릭하면 저장된 이벤트에 대해 메시지가 호출됩니다. 그러면 Chrome에서 사용자에게 메시지를 표시합니다. 사용자가 '추가'를 클릭하면 Chrome에서 앱 표시줄과 런처에 PWA를 추가합니다.

데스크톱 프로그레시브 웹 앱을 빌드할 때 고려해야 하는 기술적 및 특별한 설계 고려사항을 제니와 제가 자세히 설명하는 Google I/O 강연을 확인하세요.

Mac이나 Windows에서 이 기능을 사용하려면 전체 데스크톱 프로그레시브 웹 앱 게시물에서 플래그를 지원하는 방법에 대한 자세한 내용을 확인하세요.

Generic Sensor API

센서 데이터는 몰입형 게임, 피트니스 추적, 증강 현실 또는 가상 현실과 같은 환경을 지원하기 위해 많은 앱에서 사용됩니다. 이제 웹 앱에서 Generic Sensor API를 사용하여 이 데이터를 사용할 수 있습니다.

이 API는 기본 Sensor 인터페이스와 그 위에 빌드된 일련의 구체적인 센서 클래스로 구성됩니다. 기본 인터페이스가 있으면 구체적인 센서 클래스의 구현 및 사양 프로세스가 간소화됩니다. 예를 들어 자이로스코프 클래스는 매우 작습니다.

const sensor = new Gyroscope({frequency: 500});
sensor.start();

sensor.onreading = () => {
    console.log("X-axis " + sensor.x);
    console.log("Y-axis " + sensor.y);
    console.log("Z-axis " + sensor.z);
};

핵심 기능은 기본 인터페이스에 의해 지정되며 자이로스코프는 각가속도를 나타내는 세 가지 속성으로 이를 확장할 뿐입니다. Chrome 67은 가속도계, 자이로스코프, 방향 센서, 모션 센서를 지원합니다.

Intel은 여러 일반 센서 API 데모 및 샘플 코드를 모아 제공하고, 9월의 웹용 센서 게시물에 알아야 할 모든 내용을 업데이트했습니다.

`BigInt`초

BigInt는 임의의 정밀도로 정수를 나타낼 수 있는 JavaScript의 새로운 숫자 원시입니다. 큰 정수 ID와 고정밀도 타임스탬프는 JavaScript에서 Numbers로 안전하게 표현할 수 없으므로 실제 버그가 발생하는 경우가 많습니다. 이러한 이유로 이러한 숫자를 문자열로 대신 표현하는 경우가 많습니다.

let max = Number.MAX_SAFE_INTEGER;
// → 9_007_199_254_740_991
max = max + 1;
// → 9_007_199_254_740_992 - Yay!
max = max + 1;
// → 9_007_199_254_740_992 - Uh, no?

BigInt를 사용하면 오버플로 없이 정수 산술을 안전하게 저장하고 실행할 수 있습니다. 오늘날 큰 정수를 다루려면 일반적으로 BigInt과 같은 기능을 에뮬레이션하는 라이브러리를 사용해야 합니다.

let max = BigInt(Number.MAX_SAFE_INTEGER);
// → 9_007_199_254_740_991n
max = max + 9n;
// → 9_007_199_254_741_000n - Yay!

BigInt가 널리 사용되면 이러한 런타임 종속 항목을 삭제하고 네이티브 BigInts를 사용할 수 있습니다. 네이티브 구현이 더 빨라질 뿐만 아니라 추가 라이브러리를 로드할 필요가 없으므로 로드 시간, 파싱 시간, 컴파일 시간도 단축됩니다.

그 외에도 다양한 기능 제공

이는 개발자를 위한 Chrome 67의 몇 가지 변경사항일 뿐입니다. 물론 그 외에도 많은 변경사항이 있습니다.

Credential Management API는 Chrome 51부터 지원되었으며 사용자 인증 정보를 생성, 검색, 저장하기 위한 프레임워크를 제공합니다. 이를 위해 PasswordCredential 및 FederatedCredential라는 두 가지 사용자 인증 정보 유형을 사용했습니다. Web Authentication API는 브라우저가 보안 키, 지문 리더 또는 사용자를 인증할 수 있는 기타 기기와 같은 인증자에 의해 생성된 비공개/공개 키 쌍으로 사용자를 인증할 수 있는 세 번째 사용자 인증 정보 유형 PublicKeyCredential를 추가합니다. Chrome 67에서는 데스크톱의 USB 전송을 통해 U2F/CTAP 1 인증자를 사용하는 API를 사용 설정합니다.

에이지님의 WebAuthn으로 강력한 인증 사용 설정 게시물에서 자세히 알아보세요.

Google I/O 종료

I/O에 참석하지 못했거나 참석했지만 일부 웹 세션을 놓쳤다면 Chrome 및 웹 재생목록을 확인하여 Google I/O의 최신 소식을 모두 확인하세요.

DevTools의 새로운 기능

Chrome 67의 DevTools에 관한 새로운 기능을 알아보려면 Chrome DevTools의 새로운 기능을 확인하세요.

그런 다음 YouTube 채널에서 구독 버튼을 클릭하면 새 동영상이 출시될 때마다 이메일 알림을 받게 됩니다.

저는 펫 르페이지입니다. Chrome 68이 출시되는 대로 Chrome의 새로운 기능을 바로 알려드리겠습니다.