2021 Chrome Dev Summit의 모든 주요 공지사항을 요약하고 자세한 내용을 확인할 수 있는 링크를 제공합니다.
이 게시물에서는 2021 Chrome Dev Summit의 모든 주요 공지사항을 자세히 알아볼 수 있는 링크와 함께 정리합니다.
웹의 상호 운용성 개선
웹 호환성은 웹 개발자에게 가장 큰 과제 중 하나이므로 Google은 다른 브라우저 공급업체와 협력하여 5가지 주요 호환성 문제인 플렉스박스, 그리드, position: sticky, aspect-ratio, 변환을 해결해 왔습니다.
이러한 노력으로 이미 이러한 핵심 영역에서 개선이 이루어졌습니다. 자세한 내용은 Compat 2021 중간 업데이트를 참고하세요.
새로운 클래스의 애플리케이션이 웹에서 실행되도록 허용
Project Fugu는 웹에 새로운 클래스의 애플리케이션을 허용하는 것을 목표로 하는 프로젝트입니다. fugu-tracker.web.app에서 Fugu API의 진행 상황을 확인할 수 있습니다.
Adobe는 최근 Adobe, Google, 웹 표준 조직 간의 공동작업으로 Photoshop을 웹에 제공한다고 발표했습니다. Photoshop의 웹 여정 게시물에서 자세히 알아보세요.
개인 정보 보호
많은 일반적인 웹 기능이 개인 정보 보호를 염두에 두지 않고 설계된 서드 파티 쿠키 및 기타 교차 사이트 추적 메커니즘을 사용하기 때문에 개발자가 증가하는 개인 정보 보호 요구사항을 충족하기가 어렵습니다.
Google은 서드 파티 쿠키를 단계적으로 지원 중단하고 은밀한 추적 및 브라우저 지문을 줄이기 위해 웹 커뮤니티 및 업계 이해관계자와 협력하여 생태계를 지원하는 새로운 개인 정보 보호 기술을 개발하고 있습니다.
개인 정보 보호 샌드박스 사이트에서 이 작업에 대해 자세히 알아보세요. 개발자를 위한 제안서에 관한 정보 및 가이드, 월별 업데이트 또는 변경사항 및 진행 상황, 사용자 에이전트 문자열 변경의 일정 및 테스트 세부정보에 관한 정보도 제공됩니다.
Core Web Vitals 개선
Google은 핵심 웹 바이탈을 개선하기 위해 인기 있는 JavaScript 프레임워크의 개발자와 협력하고 있으며, 이 과정에서 의견을 보내주시면 감사하겠습니다. 전반적인 응답성 및 부드러움에 관해 알아보고 의견을 알려주세요.
업데이트된 버전의 PageSpeed Insights, 현재 Canary에서 제공되는 새로운 Chrome DevTools용 녹음기 패널, 새로운 Lighthouse용 사용자 흐름 API도 발표되었습니다.
새 웹 플랫폼 기능 사용 설정
RenderingNG는 Chromium의 렌더링 엔진을 대대적으로 리팩터링하는 프로젝트로, Chrome에서 오래된 버그를 수정하고 새로운 기능을 제공합니다. 여기에는 수년간 웹 개발자의 주요 요청이었던 컨테이너 쿼리가 포함됩니다.
컨테이너 쿼리는 미디어 쿼리를 사용하여 반응형 디자인을 만든 적이 있는 사용자에게 익숙합니다.
하지만 표시 영역 크기를 쿼리하는 내부에서 구성요소가 있는 컨테이너의 크기를 쿼리할 수 있습니다.
Google은 Chrome의 #enable-container-queries 플래그 뒤에서 신규 사양의 시험 구현을 위해 노력해 왔습니다.
RenderingNG에 관해 자세히 설명하는 블로그 게시물을 읽거나 이 동영상을 시청하여 이 작업이 한때 불가능하다고 생각되었던 기능 구현을 어떻게 가능하게 하는지 자세히 알아보세요.
멋지고 반응형 사이트를 만들 수 있도록 지원
새로운 반응형 디자인은 화면 또는 컨테이너 크기 그 이상입니다. 디자인 학습 과정에서 최신 반응형 사이트를 만드는 방법을 알아보세요. 첫 5개 모듈은 오늘 출시되며 나머지는 앞으로 몇 주에 걸쳐 게시될 예정입니다.
올해 Chrome 및 기타 브라우저에 새로운 CSS 속성이 도입되어 멋진 환경을 더 쉽게 만들 수 있습니다.
accent-color 및 size-adjust에 대해 자세히 알아보세요.
새로운 CSS를 빠르게 활용할 수 있도록 레이아웃 패턴을 출시했습니다. 이를 통해 많은 일반적인 인터페이스 패턴을 위한 강력한 시작점을 얻을 수 있습니다.
웹 기술을 학습하는 데 도움이 되는 과정 제공
디자인 학습 외에도 올해 초에 출시된 종합 CSS 과정인 CSS 학습의 새로운 모듈을 출시합니다.
또한 기능이 있고 액세스 가능한 양식을 설계하는 데 도움이 되는 종합 과정인 양식 학습도 개발했습니다. 이 과정과 함께 PWA 알아보기의 처음 몇 개 모듈도 확인할 수 있습니다.