HTTP Client Hint(Accept CH)

Accept-Ch, Accept-CH-Lifetime 에 대하여

Http Client Hint라는 spec에 대해 Ilya Grigorik 이 제안, 현재 draft 상태이다.
Chrome 및 firefox 에서 일부를 구현하고 있고, 관심이 있는 부분이기에 조금 알아보도록 하자.
* 현재 draft 상태이며, 폐기 될수도 있다

사용성

• header가 어떠한 상태인지 알려줌
  - 콘텐츠 최적화에 대한 필요성, 이 명세는 이를 해결하기 위한 클라이언트 힌트를 제안
• 확장가능한 HTTP요청 헤더 필드 집합 정의
• 사용자 에이전트가 장치 및 에이전트 고유의 환경 설정을 나타냄

초안논의

• https://lists.w3.org/Archives/Public/ietf-http-wg/

Hint 의 종류

• Accept-CH
  이미지 리소스에 대한 width(이미지 넓이), DPR(Device Pixel Ratio, 기기 픽셀 비율), viewport-width(보여지고 있는 화면의 넓이)에 대해서 정보를 얻을 수 있다.

Accept-CH 사용 예

해당 페이지에서 Request 한 DPR, Viewport-Width, Width

Accept-CH-Lifetime(Chrome 67+)

• 서버는 클라이언트의 요청에 의해 Accept-CH 의 값을 요청 하고 지정된 시간동안에 기억하도록 요청 할 수 있음. 최대 1일(86400초)

Accept-CH-Lifetime에 대해 지정(초)

Accept-CH-Lifetime이 설정됨

사용 예

DPR : 2.0
view : 300
viewport-width : 300

• 서버는 장치픽셀비율이 2.0 이며 요청한 자원의 의도된 디스플레이된 너비가 150px(2x 해상도에서 300px) 뷰포트의 너비가 300px

캐시와의 상호작용

1. Vary 응답 헤더 필드를 사용하여 리소스 캐시가 가능할 경우 생성가능

DPR, WIdth 캐시요청

2. 응답값에 대한 범위 지정

캐시의 키가 Width 헤더필드의 값을 포함하고 320: 0–320, 320–640등의 그룹으로 분할됨

마무리

좀더 세밀한 웹페이지를 제공해 주는 것은 어떤것일까? 웹은 이러한 부분들을 채워주기 위해서도 발전하고 있는 것 같다.

참고

• 초안 논의
• WHATWG Client Hint
• Accept-CH-Lifetime support for requesting client hints
• Client Demo
• Naver D2 - Chrome 46 Beta 추가 및 변경사항
• Next-Generation Responsive Images with Client Hints