Google for Developers Korea Blog: Chrome 58 베타 버전에서 변경된 내용들을 확인해 보세요.

Chrome 58 베타 버전에서 변경된 내용들을 확인해 보세요.

2017년 4월 26일 수요일

여기문현경(Web Technologies GDE) 별도의 언급이 없는 한, 아래에 기술된 변경 사항은 Android, Chrome OS, Linux, Mac, Windows용 최신 Chrome 베타 채널 릴리스에 적용됩니다. IndexedDB 2.0 Chrome에서는 이제 IndexedDB 2.0 표준이 완벽하게 지원되므로 브라우저에서 큰 데이터 세트를 더 간단히 다룰 수 있습니다. IDB 2.0은 새로운 스키마 관리, 일괄 작업 메서드 및 더욱 표준화된 실패 처리 기능을 제공합니다.

사이트의 데이터베이스 구조는 성능에 큰 영향을 미치며 변경하기 어려울 수 있습니다. 업데이트를 단순화하기 위해 이제 리팩토링 후 즉시 객체 저장소 및 색인의 이름을 알맞게 변경할 수 있습니다. 또한, 맞춤 키를 간결하게 표현할 수 있는 바이너리 키 덕분에 성능 저하를 걱정할 필요 없이 사이트에서 더 많은 네츄럴 키를 사용할 수 있습니다.
getKey() 및 openKeyCursor() 메소드를 사용하여 데이터를 더 쉽게 검색할 수 있고, 데이터베이스 키가 필요할 때 더 나은 성능을 제공합니다. 새 continuePrimaryKey() 커서 메서드를 사용하면 중복된 기본 키에 대한 걱정 없이 트랜잭션과 페이지 로드에서 대규모 데이터 액세스를 더욱 쉽게 나눌 수 있습니다. getAll() 및 getAllKeys() 메서드를 사용하면 커서를 사용하지 않고서도 전체 데이터세트를 일괄 복구할 수 있습니다. iframe 탐색 기능 개선

자동으로 페이지를 리디렉션하는 광고와 같은 타사 콘텐츠는 사용자를 성가시게 하고 보안 문제를 일으킬 수 있습니다. 따라서 개발자는 이러한 문제를 방지하기 위해 타사 콘텐츠를 샌드박싱한 iframe 안에 넣을 수 있습니다. 하지만 경우에 따라 이러한 유형의 콘텐츠는 표준 광고와 같이 클릭할 때 최상위 수준 페이지를 탐색해야 합니다.

이 문제를 해결하기 위해 이제 Chrome 58에서 iframe 샌드박스 키워드 allow-top-navigation-by-user-activation을 지원합니다. 이 키워드는 자동 리디렉션을 차단하면서 샌드박싱한 iframe이 사용자 상호작용에 의해 트리거될 때 최상위 수준 페이지(the top-level page)를 탐색할 수 있는 기능을 제공합니다. PWA용 몰입형 전체 화면 Android 메인 스크린에서 PWA(Progressive Web App)가 실행될 때 검색주소창을 숨기는 독립 실행형 앱과 같은 모드로 실행됩니다. 이 기능은 매력적인 사용자 환경을 조성하고 콘텐츠를 위한 화면 공간을 확보하는 데 도움이 됩니다. 그러나 게임, 동영상 플레이어 또는 기타 서식 있는 콘텐츠와 같이 더욱 뛰어난 몰입형 환경을 얻기 위해서는 시스템 바와 같은 다른 모바일 UI 요소가 여전히 방해가 될 수 있습니다.
이제 PWA가 웹 앱 매니페스트(web app manifest)에서 display: fullscreen을 설정하여 사이트가 시작될 때 메인 스크린에서 앱 UI 이외의 UI를 숨김으로써 완벽한 몰입형 환경을 제공할 수 있습니다.

PWA가 메인 스크린에서 실행됨(왼쪽), 메인 스크린에서 독립형 모드로 실행됨(중간), 메인 스크린에서 전체 화면 모드로 시작됨(오른쪽) 이번 릴리스에 포함된 기타 기능

Worker 및 SharedWorker를 생성할 때 data: URL을 사용하여 불투명 출처(opaque origin)를 제공함으로써 Worker를 사용한 개발을 더욱 안전하게 만들 수 있습니다.

개발자는 PointerEvents.getCoalescedEvents()를 사용하여 PointerEvent가 전달된 이후 모든 입력 이벤트에 액세스할 수 있으므로, 그리기 앱에서 정확한 포인트 기록을 사용하여 더 부드러운 곡선을 쉽게 생성할 수 있습니다.

이제 개발자가 새 ControlsList API를 사용하여 download, fullscreen 및 remoteplayback 버튼과 같은 Chrome의 네이티브 미디어 컨트롤을 맞춤설정할 수 있습니다.

Android용 Chrome에서 개선된 메인 스크린에 추가 흐름을 사용하여 설치된 사이트는 매니페스트의 범위에 포함된 출처에서 제공되는 오디오와 동영상을 제한 없이 자동 재생할 수 있습니다.

Android용 Chrome에서 autoplay 속성을 사용하는 동영상은 브라우저에서 일관성을 유지하기 위해 화면을 벗어나면 일시 중지되고 뷰로 돌아오면 다시 시작됩니다.

이제 사이트에서 color-gamut Media Query를 사용하여 Chrome과 출력 기기에서 지원되는 대략적인 색상 범위에 액세스할 수 있습니다.

이제 float 및 clear와 같은 여러 레이아웃 속성을 수동으로 재설정하지 않고, display: flow-root를 사용하여 새로운 블록 서식 지정 컨텍스트를 추가할 수 있습니다.

자바스크립트 파싱 시간을 줄이기 위해 SVGPoint, SVGRect 및 SVGMatrix가 지오메트리 외부에 있는새 인터페이스로 이전되었습니다.

이제 개발자가removeRange()라는 새로운 Selection API 함수를 사용하여 지정된 텍스트 범위를 프로그램 방식으로 삭제할 수 있습니다.

이제 스타일러스 기기와 페인팅 앱에 더 많은 정보를 제공할 수 있도록 Mac용 Chrome에서 PointerEvent.tangentialPressure 및 PointerEvent.twist 속성이 지원됩니다.

개발자 환경을 단순화하기 위해 공식 매개변수 및 인수 목록에 대해 자바스크립트에서 후행 쉼표가 허용 됩니다.

WebAudio API의 새 playback AudioContextLatencyCategory를 통해 개발자가 쉽게 지연 시간, 전력 및 CPU 효율성 간의 균형을 맞출 수 있습니다.

지원 중단 및 상호 운용성 개선 사항

Apple-interchange-newline, Apple-converted-space, Apple-paste-as-quotation, Apple-style-span 및 Apple-tab-span은 비표준 CSS 클래스이므로 지원이 중단되었습니다.

usemap 속성은 이제 사양에 더 잘 부합하도록 호환성 대소문자 구분이 없는 것이 아니라 대소문자 구분 매칭을 사용합니다.

이제 사이트에서 강력한 기능과 관련된 Chrome의 정책에 따라 알림 권한을 요청하거나 Notifications API를 사용하여 비 영구적인 로컬 알림을 생성할 때 HTTPS를 사용해야 합니다.

사양과 더 잘 부합하도록, cancelBubble은 이제 true로 설정된 경우 stopPropagation()에 대한 별칭으로 간주되고 false로 설정된 경우 아무 것도 수행하지 않습니다.

VTTRegion 인터페이스 함수, addRegion() 및 removeRegion()이 WebVTT 사양에서 삭제되었고 Chrome에서 삭제될 예정입니다.

데이터에 대한 최상위 수준 탐색:위장이나 피싱 시도로부터 사용자를 보호하기 위해 URL 지원이 중단되었습니다.

HTMLEmbedElement 또는 HTMLObjectElement의 인스턴스는 이전 호출자가 제거되었으므로 더 이상 함수로 호출할 수 없습니다.

사전 표준 ChaCha20-Poly1305 암호화는 이러한 알고리즘의 표준화에 따라 RFC 7539 및 RFC 7905와 같은 IETF 및 Chrome 41에서 표준 버전의 후속 출시에서 제거되었습니다.

상호 운용성 향상을 위해 이제 Selection.addRange()가 기존 범위와 겹치는 경우 두 범위를 병합하는 대신 추가 범위를 무시합니다.

강력한 기능 및 사양 준수와 관련된 Chrome의 정책에 따라 안전하지 않은 출처를 통해 전송되는 암호화된 미디어 확장 프로그램의 지원이 중단되었습니다.

AudioBuffer 생성자가 이제 컨텍스트 인수 대신 AudioBufferOptions 사전의 sampleRate 멤버를 받아들여 인터페이스를 단순화하고 AudioBuffer를 AudioContext 간에 공유할 수 있음을 강조합니다.

서비스 워커에서 동기 FileReaderSync API의 지원이 중단되었습니다. 서비스 워커 사양에서는 모든 유형의 동기 요청을 서비스 워커 외부에서 시작해야 하기 때문입니다.

HTML 표준에 부합하도록 이제 abbr 및 acronym 요소에서 기본적으로 점선 밑줄을 지원합니다.

motion-path, motion-offset 및 motion-rotation CSS 속성이 새 버전인 offset-path, offset-distance, offset-rotate에 맞게 삭제되었습니다.

이제 selectionDirection, selectionStart, selectionEnd와 같은 Selection API 속성에 액세스할 때 Chrome이 InvalidStateError DOMException을 발생시키지 않고 null을 반환합니다.

사양에 더 잘 부합하도록 너무 큰 오프셋 값을 자동으로 제한하는 대신, 이제 Selection API의 setBaseAndExtent()가 IndexSizeError DOMException 예외를 발생시킵니다.

사양에 더 부합하도록 DocumentType 노드 입력에 대해 자동으로 실패 처리하는 대신, 이제 Selection API의 setBaseAndExtent(), extend() 및 collapse()가 InvalidNodeTypeError DOMException을 발생시킵니다.

사양에 더 잘 부합하도록 이제 getRangeAt()이 항상 위치 정규화를 통해 새 Range를 반환합니다.

AudioSourceNode 인터페이스는 WebAudio 사양에 포함되지 않으므로 삭제되었습니다.

webkitdropzone 속성은 널리 채택되지 않았기 때문에 삭제되었습니다.

게시자: Victor Costan, IndexedDB Interloper