1월의 새로운 웹 플랫폼 기능

2026년 1월 동안 안정화 버전(stable) 및 베타 웹 브라우저에 도입된 흥미로운 기능들을 살펴보세요.

안정화 브라우저 출시 (Stable browser releases)

1월 중 Chrome 144와 Firefox 147이 안정화 버전으로 출시되었습니다. 이번 포스트에서는 이번 달의 다양한 새로운 기능들을 살펴보고, 여러 기능들이 Baseline Newly available(새롭게 사용 가능) 상태가 된 것을 확인합니다.

CSS Anchor Positioning (CSS 앵커 포지셔닝)

Firefox 147은 CSS Anchor Positioning 지원을 포함하며, 이 기능은 Baseline Newly available 상태가 되었습니다. 이 API를 사용하면 앵커(anchors)라고 불리는 다른 요소와 상대적으로 요소를 배치할 수 있습니다. 이는 툴팁(tooltips), 메뉴(menus), 팝오버(popovers)와 같이 페이지의 다른 요소에 맞춰 요소를 배치하고자 할 때 유용합니다.

Navigation API (내비게이션 API)

Firefox 147과 함께 Baseline Newly available 상태가 된 또 다른 기능은 Navigation API입니다. 이 API는 애플리케이션 내에서 내비게이션(navigations)을 시작, 가로채기 및 관리할 수 있는 현대적인 방법을 제공합니다.

::search-text를 이용한 페이지 내 찾기 스타일링 (Find-in-page styling with ::search-text)

Chrome 144에는 ::search-text 의사 요소(pseudo-element)가 포함되어 있습니다. 이 기능은 페이지 내 찾기(find-in-page) 검색 결과 스타일링을 ::selection 및 ::spelling-error와 유사하게 하이라이트 의사 요소(highlight pseudo-element)로서 제작자에게 노출합니다. 이를 통해 사용자가 브라우저의 페이지 내 찾기 기능을 사용할 때 검색 결과의 외관을 커스텀할 수 있습니다.

Igalia 블로그의 'Find-in-Page Highlight styling'에서 더 자세한 내용을 확인하세요.

<geolocation> 요소

Chrome 144는 사용자의 위치에 접근하기 위한 선언적이고 사용자 활성화 방식인 <geolocation> 요소를 도입합니다. 이 요소는 권한 흐름을 처리하고 사이트에 위치 데이터를 직접 제공함으로써, 별도의 JavaScript API 호출 필요성을 제거하는 경우가 많아 사용자 및 개발자의 여정을 간소화합니다.

'Introducing the HTML <geolocation> element'에서 더 자세히 알아보세요.

Temporal API (Temporal API)

Chrome 144에는 Temporal API가 포함되어 있습니다. 이는 날짜 및 시간 작업을 위한 표준 객체와 함수를 제공합니다. 이는 JavaScript에 있어 중요한 추가 사항으로, Date 객체를 대체할 강력하고 현대적인 대안을 제공합니다.

CSS caret-shape

Chrome 144에서는 텍스트 삽입 커서(caret)의 모양을 지정할 수 있는 caret-shape 속성을 도입합니다. auto, bar, block, underscore 중에서 선택할 수 있습니다.

View Transition 개선 사항

Firefox 147에는 뷰 전환(view transition) 유형을 식별하는 기능이 포함되었습니다. 이는 활성화된 뷰 전환에 대해 서로 다른 *유형(types)*을 지정할 수 있는 메커니즘을 제공합니다. 이를 통해 지정된 전환 유형에 따라 DOM 요소의 콘텐츠가 업데이트될 때 CSS를 사용하여 애니메이션을 적용할 수 있습니다. Firefox 147은 단일 페이지 애플리케이션 (SPA) 뷰 전환 유형만 지원하며, 문서 간(cross-document) 뷰 전환 유형은 지원하지 않습니다.

또한 Firefox는 이제 Document 인터페이스에서 activeViewTransition 속성을 지원하며, 이는 활성화된 전환에 대한 ViewTransition 객체를 반환합니다.

베타 브라우저 출시

베타 브라우저 버전은 다음 안정화 버전(stable version)에 포함될 기능들을 미리 보여줍니다. 이는 전 세계적으로 해당 버전이 출시되기 전에 사이트에 영향을 미칠 수 있는 새로운 기능이나 제거 사항을 테스트하기에 아주 좋은 시기입니다. 이번 달의 새로운 베타 버전은 Chrome 145와 Firefox 148입니다.

Chrome 145에는 정렬 방식(justification methods)을 제어하는 text-justify 속성과 column-wrap 및 column-height를 통한 다단 레이아웃(multi-column layout) 개선 사항이 포함되어 있습니다. 또한 GlobalEventHandlers에 onanimationcancel 이벤트를 추가했습니다. 아울러, 사용자 정의가 가능한 <select> 기능이 리스트박스(listboxes)로 확장되었습니다.

Firefox 148에는 Location.ancestorOrigins 지원이 포함되어, 문서가 <iframe> 내에 임베드되어 있는지, 그리고 어떤 사이트에 의해 임베드되었는지 확인할 수 있습니다.