TOAST UI

Applications
ChartEditorGridCalendarImage-editor
Components
App LoaderAuto CompleteColor PickerContext MenuDate PickerPaginationRollingSelect BoxTime PickerTree
Tools
TOAST UI DocESLint ConfigRelease Note
FE Guide
Posts

월간 크롬 이슈 리포트 2022년 8월호

들어가며

프런트엔드 개발의 가장 큰 디펜던시인 크롬 브라우저의 주요 이슈를 Chrome Platform Status의 Roadmap과 한 달간 blink-dev 활동 요약을 기준으로 정리하여 공유한다.

💡M은 Milestone을 의미하며, M104은 104버전을 의미한다.

💡 웹 플랫폼 관련 이슈 위주로 다루며, 서비스에 영향이 크다고 판단되는 부분은 목차에 📌를 표시한다.

💡 표준화에 대한 웹 개발자의 의견은 Chrome Platform Status에 쓰인 내용을 그대로 인용했다.

목차

  1. M104

    • 📌 쿠키의 Expires/Max-Age 속성 상한
    • CSS Transform의 개별 속성 추가
    • 미디어 쿼리 레벨 4 문법 및 평가

  2. M105

    • 비보안 컨텍스트에서의 WebSQL 지원 중단 및 제거
    • import.meta.resolve()
    • 워커에서 MSE(Media Source Extensions) 활성화
    • 📌 커스텀 식별자에서 CSS default 키워드 사용 제한(제거)
    • 제스처 스크롤 DOM 이벤트 제거

  3. M106 (dev)

    • 📌 쿠키의 domain 속성에 비 아스키 문자 지원 중단
    • window.PERSISTENT 할당 타입 지원 중단
    • HTTP/2 푸시 제거

  4. Dev Trial

    • Pop-Up API

  5. 지원 중단 및 제거 예정

    • Expect-CT(Certificate Transparency) HTTP 헤더 지원 중단
    • navigateEvent.restoreScroll() 제거
    • navigateEvent.transitionWhile() 제거
    • Event.path 지원 중단
    • 📌 document.domain setter 지원 중단
    • Web Payment API의 connect-src CSP(Content Security Policy) 정책 무시 기능 지원 중단
    • 컨텍스트 보안을 위한 공개 웹 사이트의 하위 리소스에 대한 "사설 네트워크 요청" 제한
    • "canmakepayment" 이벤트에서의 판매자 식별자 지원 중단

버전별 이슈 리스트

1. M104

📌 쿠키의 Expires/Max-Age 속성 상한

이슈

이제 쿠키가 명시적인 Expires/Max-Age 속성으로 설정되면 향후 400일 이내로 제한된다. 이전에는 이 제한이 없었고 수천년 이후에나 만료될 수 있었다.

rfc6265bix 초안대로 이제 쿠키의 Expires/Max-Age 속성에 대한 상한이 포함된다. RECOMMENDED 제한은 기간이 400일이지만 사용자 에이전트는 제한을 더 작게 조정할 수 있다. 제한보다 큰 속성은 제한까지 줄여야한다.

크롬의 측정에 따르면 모든 쿠키 셋 중 약 20%가 향후 400일 이상의 Expires/Max-Age를 갖는다. 그 20% 중 절반은 2년을 목표로 하고, 1/4은 10년 이상을 목표로 하고 나머지는 그 이상의 범위에 분산되어 있다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

References

CSS Transform의 개별 속성 추가

이슈

기존의 transform 속성을 단순하게 사용하더라도 행렬 곱셈의 순서에 대한 지식이 필요하다. 예를 들어, "transform: translate(100px) rotate(45deg)"와 "transform: rotate(45deg) translate(100px)"는 같지 않다.

새로운 CSS 속성 translate, rotate, scale를 추가하며, 이런 특성을 개별 transform 속성(이전에는 독립 transform 속성)이라고 한다. 속성을 개별적으로 적용할 수 있다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

References

미디어 쿼리 레벨 4 문법 및 평가

이슈

일반적인 수학 비교 연산자를 사용해 미디어 쿼리를 작성할 수 있다. 'or', 'not', 중첩, 'unknown' 기능 평가에 대한 지원이 추가된다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 배포 됨
  • Safari: 의견 없음
  • 웹 개발자: 의견 없음

References

2. M105

비보안 컨텍스트에서의 WebSQL 지원 중단 및 제거

이슈

Web SQL Database 표준은 2009년 4월에 처음 제안되어 2010년 11월에 폐기되었다. Gecko는 이 기능을 구현하지 않았고 Webkit은 2019년에 이 기능을 더 이상 지원하지 않는다. W3C는 웹 데이터베이스가 필요하면 Web Storage 또는 Indexed Database를 채택하라고 권장한다.

비보안 컨텍스트는 보안 컨텍스트가 아닌 컨텍스트를 말한다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 해당 없음
  • Safari: 배포 됨
  • 웹 개발자: 의견 없음

References

import.meta.resolve()

이슈

import.meta.resolve()는 주어진 지정자가 현재 스크립트의 컨텍스트에서 확인할 URL을 반환한다. 즉, import(지정자)를 수행한 경우 가져올 URL을 반환한다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

References

워커에서 MSE(Media Source Extensions) 활성화

이슈

메인 윈도우 컨텍스트에서 HTMLMediaElement로 재생하기 위한 미디어 버퍼링 성능을 향상시키기 위해 DedicatedWorker 컨텍스트에서 MSE(Media Source Extensions) API 사용을 활성화한다.

DedicatedWorker 컨텍스트에서 MediaSource 객체를 만들면 애플리케이션이 MediaSourceHandle을 가져오고, HTMLMediaElement에 연결할 때 사용할 수 있도록 핸들을 메인 스레드로 전송할 수 있다. 그런 다음 MediaSource 객체를 생성한 컨텍스트가 이 객체를 사용해 미디어를 버퍼링할 수 있다.

데모

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

References

📌 커스텀 식별자에서 CSS default 키워드 사용 제한(제거)

이슈

CSS에서 CSS 프로퍼티로 허용하는 값으로 사용하는(또는 앞으로 사용할 가능성이 있는) 키워드는 커스텀 식별자에서 허용되어서는 안된다. 많은 커스텀 식별자가 CSS 프로퍼티의 값이기도 하기 때문이다.

커스텀 식별자일 수 있는 경우, 이런 키워드를 모든 CSS 프로퍼티 또는 이미 커스텀 식별자를 허용하는 특정 CSS 속성에 속성 값으로 추가하여 손상될 콘텐츠를 만들 수 있다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

References

제스처 스크롤 DOM 이벤트 제거

이슈

크롬 플러그인에서 사용하기 위해 추가된 'gesturescrollstart', 'gesturescrollupdate', 'gesturescrollend' 3가지 제스처 스크롤 DOM 이벤트는 표준이 아니다. 현재 이 API들은 전혀 동작하지 않는다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 해당 없음
  • Safari: 해당 없음
  • 웹 개발자: 의견 없음

References

3. M106 (dev)

📌 쿠키의 domain 속성에 비 아스키 문자 지원 중단

이슈

RFC6265bis의 최신 사양에 맞춰 아스키 문자가 아닌 "domain" 속성이 포함된 쿠키를 거부한다. 예를 들어 Domain=éxample.com 속성을 포함하는 쿠키를 거부한다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

References

window.PERSISTENT 할당 타입 지원 중단

이슈

requestFileSystem()에 대해 window.PERSISTENT 할당 타입 지원을 중단한다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 의견 없음
  • Safari: 의견 없음
  • 웹 개발자: 의견 없음

References

HTTP/2 푸시 제거

이슈

서버에서 보낸 HTTP/2 푸시 스트림을 수신하고 메모리에 보관하며 사용하는 기능을 제거한다. 모든 HTTP/2 연결 시작 시 SETTINGS_ENABLE_PUSH = 0을 전송해서 서버가 전송하지 않도록 요청한다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 의견 없음
  • Safari: 의견 없음
  • 웹 개발자: 의견 없음

References

4. Dev Trial

Pop-Up API

이슈

다른 모든 웹 앱 UI 위에 표시되는 일반적인 사용자 인터페이스(UI) 요소를 만드는데 사용할 수 있는 API다. 작업 메뉴, 폼 요소 제안, 컨텐츠 선택기 같은 사용자 인터랙션 요소가 포함된다. 이 API는 새로운 popup 컨텐츠 속성을 사용하여 top 레이어에 모든 요소를 표시할 수 있도록 한다. <dialog>와 비슷하지만 몇가지 중요한 차이점이 있는데 팝업 인터랙션 관리, 애니메이션 및 이벤트 지원, "modal" 모드의 부재가 포함된다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 의견 없음
  • Safari: 의견 없음
  • 웹 개발자: 의견 없음

References

5. 지원 중단 및 제거 예정

Expect-CT(Certificate Transparency) HTTP 헤더 지원 중단

이슈

Expect-CT(Certificate Transparency)는 기본적으로 시행되기 전 웹 사이트가 인증서 투명성(TC) 시행을 선택할 수 있도록 허용한 HTTP 헤더다.

이제 크롬은 모든 공공 웹사이트에서 CT를 필요로 하기 때문에 더이상 Expect-CT에 대한 보안 가치가 없다. Expect-CT를 구현한 브라우저는 없으므로 Expect-CT를 제거하는 것은 상호 운용성에 문제가 되지 않는다.

M107(10/25 배포 예정)에 적용될 예정이다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 의견 없음
  • Safari: 의견 없음
  • 웹 개발자: 의견 없음

References

이슈

restoreScroll()은 navigationEvent.scroll()로 대체된다. scroll()은 개발자가 순회가 아닌 탐색에 대한 스크롤 타이밍을 제어할 수 있다는 점을 제외하면 동일하게 동작한다.

M108(11/29 배포 예정)에 적용될 예정이다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 의견 없음
  • Safari: 의견 없음
  • 웹 개발자: 긍정적

References

이슈

navigateEvent.transitionWhile()은 탐색을 가로채서 동일한 문서의 탐색으로 변환한 다음, 제공된 프라미스를 사용하여 새로운 탐색이 완료되는 동안 브라우저와 웹 애플리케이션의 다른 부분에 전환 단계에 있다는 신호를 보낸다.

설계 결함이 보고되어 navigateEvent.transitionWhile()이 navigationEvent.intercept()로 대체된다. transitionWhile()의 동일한 기본 기능에 대해 보다 유용한 API를 제공하기 위해 intercept()가 도입되었다.

M108(11/29 배포 예정)에 적용될 예정이다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 의견 없음
  • Safari: 의견 없음
  • 웹 개발자: 긍정적

References

Event.path 지원 중단

이슈

Event.path는 리스너가 호출될 객체의 배열인 이벤트의 경로를 반환하는 비표준 API다. 크롬에서만 지원되므로 웹 호환성 문제가 발생한다. 웹 개발자는 동일한 결과를 반환하는 표준 API인 Event.composedPath()로 변경해야한다.

M109(23년 1/10 배포 예정)에 적용될 예정이다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 의견 없음
  • Safari: 의견 없음
  • 웹 개발자: 긍정적

References

📌 document.domain setter 지원 중단

이슈

document.domain setter를 사용하면 개발자가 동일 출처 정책을 완화하여 크롬에서 관리하는 기본적인 보안 경계를 복잡하게 만든다. 또한 크롬의 프로세스 모델에 대한 post-Spectre 도입을 방해한다. Origin-keyed agent clusters를 통해 옵트인 해야하며 지원을 중단한다. setter는 남지만 출처가 변경되지 않는다.

크롬의 threat model에서는 프로세스를 유일한 방어 가능한 보안 경계로 간주해야한다. 이를 위해서는 출처를 프로세스에 맞추는 것이 가장 중요하다.

다른 출처 간의 비동기 메시지를 보내기 위해서는 document.domain 대신 window.postMessage를 사용하기를 권장한다. M106에 적용 예정이었으나 적용이 연기되어 M109(23년 1/10 배포 예정)에 적용될 예정이다.

데모

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

References

Web Payment API의 connect-src CSP(Content Security Policy) 정책 무시 기능 지원 중단

이슈

manifest를 가져올 때 Web Payment API가 connect-src CSP(Content Security Policy) 정책을 무시할 수 있는 기능을 지원 중단한다.

M110(23년 2/7 배포 예정)에 적용될 예정이다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 해당사항 없음
  • Safari: 해당사항 없음
  • 웹 개발자: 의견 없음

References

컨텍스트 보안을 위한 공개 웹 사이트의 하위 리소스에 대한 "사설 네트워크 요청" 제한

이슈

공개 웹 사이트의 하위 리소스에 대한 사설 네트워크 요청은 보안 컨텍스트에서만 시작할 수 있어야 한다. 예를 들어 인터넷에서 인트라넷으로의 요청, 인터넷에서 루프백으로의 요청이 있다. 현재(M103) Origin Trial 중에 있으며, M113(23년 5/2 배포 예정)에 적용될 예정이다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

References

"canmakepayment" 이벤트에서의 판매자 식별자 지원 중단

이슈

"canmakepayment" 서비스 워커 이벤트는 사용자가 설치된 결제 앱에 등록된 카드가 있는지 여부를 판매자에게 알려준다. 판매자의 출처와 임의의 데이터를 결제 앱 출처에서 서비스 워커에게 조용히 전달한다.

사용자의 프라이버시를 보장하기 위해 "canmakepayment" 서비스 워커 이벤트에서 판매자의 출처 및 임의의 데이터를 제거해야한다.

M114(23년 5/30 배포 예정)에 적용될 예정이다.

표준화

상기 제안에 대한 타 브라우저의 의견은 다음과 같다.

  • Firefox: 의견 없음
  • Safari: 의견 없음
  • 웹 개발자: 의견 없음

References

#browser
#toastui
임재언2022.08.30
Back to list
Applications
ChartEditorGridCalendarImage-editor
Components
App LoaderAuto CompleteColor PickerContext MenuDate PickerPaginationRollingSelect BoxTime PickerTree
Tools
TOAST UI DocESLint ConfigRelease Note
FE Guide
Posts
© NHN Cloud Corp.