Opublikowano: 28 lipca 2026 r.
Wprowadzamy teraz Chrome 151. W tym poście opisujemy niektóre z najważniejszych funkcji tej wersji. Przeczytaj pełne informacje o wersji Chrome 151.
Najważniejsze informacje o tej wersji:
- Element
<usermedia>zapewnia deklaratywną, aktywowaną przez użytkownika kontrolę strumieni z kamery i mikrofonu. - Deklaratywne przypisywanie slotów w shadow DOM umożliwia komponentom internetowym korzystanie z ręcznego przypisywania slotów bez użycia imperatywnego JavaScriptu.
- Miękkie nawigacje i wskaźniki skuteczności interakcji śledzą opóźnienia i zmiany tras w aplikacjach jednostronicowych spowodowane interakcjami.
Element <usermedia> – minimalna wersja produktu
Element <usermedia> jest najnowszym elementem w pakiecie elementów Capability Elements, po elemencie <geolocation>. To przejście od pierwotnej propozycji <permission> – części inicjatywy PEPC – pozwala przeglądarce skuteczniej radzić sobie z unikalnymi złożonościami i zachowaniami różnych funkcji sprzętowych. Wczesna propozycja skupiała się głównie na zarządzaniu stanami uprawnień, takimi jak zezwolenie i odmowa, natomiast elementy Capability Elements działają jako pośrednicy danych.
Element <geolocation> udostępnia witrynie obiekt lokalizacji, a element <usermedia> zarządza całym procesem dostępu do kamery i mikrofonu. Rejestruje intencje użytkownika, zarządza prośbą przeglądarki i dostarcza do aplikacji obiekt MediaStream. To przesunięcie eliminuje potrzebę oddzielnych wywołań getUserMedia(), upraszcza implementację i zapewnia, że przeglądarka ma zaufany sygnał o intencjach użytkownika.
Więcej informacji znajdziesz w artykule Introducing the <usermedia> element HTML.
Deklaratywny shadow DOM: atrybut shadowrootslotassignment
Chrome 151 dodaje obsługę atrybutu shadowrootslotassignment w elementach <template>. Umożliwia to tworzenie deklaratywnych shadow roots, które używają ręcznego przypisywania slotów bezpośrednio w kodzie HTML.
Do tej pory ręczne przypisywanie slotów było dostępne tylko w sposób imperatywny. Dzięki tej aktualizacji możesz określić shadowrootslotassignment="manual" w szablonie shadow root.
Atrybut akceptuje wartości named (zachowanie domyślne) i manual oraz jest odzwierciedlany przez właściwość shadowRootSlotAssignment w HTMLTemplateElement. Więcej informacji znajdziesz w dokumentacji HTMLTemplateElement.shadowRootSlotAssignment w MDN.
Ten atrybut jest już dostępny w Firefoxie i w wersji beta Safari 27, więc wkrótce będzie dostępny w wersji Baseline Newly.
Miękkie nawigacje i wskaźniki skuteczności interakcji
Chrome 151 rozszerza oś czasu skuteczności witryny, wprowadzając 2 nowe typy PerformanceEntry: soft-navigation i interaction-contentful-paint. Te wpisy pomagają deweloperom śledzić skuteczność i opóźnienia spowodowane interakcjami w aplikacjach jednostronicowych (SPA), opierając się na ustalonych Core Web Vitals, takich jak największe wyrenderowanie treści (LCP) i interakcja do kolejnego wyrenderowania (INP).
W SPA przejścia między trasami sterowane przez JavaScript nie powodują tradycyjnego wczytania strony w przeglądarce. Wpis soft-navigation rejestruje te same zmiany stanu historii dokumentu zainicjowane przez interakcje użytkownika. Gdy wystąpi miękka nawigacja, przeglądarka ustala nowy początek czasu, co pozwala dokładnie przypisać kolejne dane o skuteczności do aktywnej trasy SPA, a nie do początkowego adresu URL dokumentu.
Wpis interaction-contentful-paint mierzy nowe wyrenderowania treści w regionach DOM zmodyfikowanych przez interakcję użytkownika. Umożliwia to wgląd w opóźnienia wczytywania interakcji, nawet gdy aktualizacje treści zależą od operacji asynchronicznych, takich jak żądania fetch().
Możesz obserwować te nowe wpisy w swojej aplikacji za pomocą PerformanceObserver. Poniższy fragment kodu rejestruje w konsoli wpisy miękkiej nawigacji, w tym poprzednie miękkie nawigacje na tej stronie za pomocą opcji buforowania:
const observer = new PerformanceObserver(console.log);
observer.observe({ type: "soft-navigation", buffered: true });
Więcej informacji o implementowaniu i mierzeniu nawigacji w SPA znajdziesz w dokumentacji Soft navigations w Chrome dla deweloperów.
Więcej informacji
Omawiamy tu tylko niektóre z najważniejszych zmian. Dodatkowe zmiany w Chrome 151 znajdziesz w tych linkach:
- Informacje o wersji Chrome 151.
- Aktualizacje ChromeStatus.com dotyczące Chrome 151.
- Kalendarz publikacji Chrome.
Zasubskrybuj
Aby być na bieżąco, zasubskrybuj kanał Chrome Developers YouTube. Będziesz otrzymywać e-maile z powiadomieniami o nowych filmach. Możesz też obserwować nas na X lub LinkedIn, aby otrzymywać informacje o nowych artykułach i postach na blogu.
Gdy tylko opublikujemy Chrome 152, poinformujemy Cię o nowościach w Chrome!