Хром 116 бета

Путь движения CSS, API-интерфейс NotRestoredReason кэша назад и вперед, документ «Картинка в картинке» и многое другое.

Если не указано иное, описанные изменения относятся к новейшей версии бета-канала Chrome для Android, ChromeOS, Linux, macOS и Windows. Узнайте больше о функциях, перечисленных здесь, по предоставленным ссылкам или из списка на ChromeStatus.com. Chrome 116 является бета-версией по состоянию на 19 июля 2023 г. Вы можете загрузить последнюю версию на Google.com для настольных компьютеров или в Google Play Store для Android.

CSS

В этом выпуске добавлены две новые функции CSS.

CSS-путь движения

Путь движения позволяет авторам размещать любой графический объект и анимировать его по пути, указанному разработчиком. Это открывает ряд новых мощных возможностей преобразования, таких как позиционирование с использованием полярных координат (с помощью функции ray() ) вместо стандартных прямоугольных координат, используемых функцией translate() , или анимация элемента по определенному пути. Это упрощает определение сложных и красивых 2D-пространственных переходов. Путь может быть указан как circle() , ellipse() , rect() , inset() , xywh() , polygon() , ray() и url() .

Анимация отображения и видимости контента

Chrome 116 поддерживает свойства display и content-visibility в анимации ключевых кадров. Эта поддержка позволяет разработчикам создавать анимации выхода, после чего элемент автоматически становится display: none или content-visibility: hidden , без необходимости писать какой-либо JavaScript для обработки этого переключения после завершения анимации. Это позволяет добавлять анимацию выхода для элементов исключительно с помощью CSS.

Веб-API

Прервать сигнал.любой()

Возвращает сигнал, который прерывается при прерывании любого из исходных сигналов. Разработчики могут использовать это для объединения независимых источников прерывания, например, тайм-аутов, указанных с помощью AbortSignal.timeout() , и сигналов, связанных с AbortController, и передавать их в асинхронные API, такие как fetch() .

Поддержка BYOB для Fetch

Реализация ReadableStream в Chrome поддерживает считыватели с собственным буфером (BYOB) для считываемых потоков байтов. Теперь Response.body также является читаемым потоком байтов вместо читаемого потока «по умолчанию». Это позволяет использовать Fetch API с устройствами чтения BYOB, сокращая накладные расходы на сбор мусора и копирование, а также повышая скорость реагирования для пользователей. Blob.stream() теперь также выигрывает от этой оптимизации.

Назад/вперед кеш NotRestoredReason API

API NotRestoredReason сообщит список причин, по которым страница не обслуживается из BFcache, в древовидной структуре фрейма через API PerformanceNavigationTiming.

Документ «картинка в картинке»

Document Picture-in-Picture добавляет новый API для открытия окна, которое всегда находится сверху, и которое можно заполнить произвольными HTMLElements . Это расширение существующего API HTMLVideoElement , которое позволяет помещать HTMLVideoElement только в окно «картинка в картинке» (PiP). Это позволяет веб-разработчикам предоставлять пользователям лучший опыт работы с PiP.

Расширенные подстановочные знаки в источниках политики разрешений

Подстановочные знаки поддоменов в белых списках обеспечивали некоторую ценную гибкость, но отличались от существующих анализаторов подстановочных знаков и требовали нового кода и работы над спецификациями. Это намерение уменьшит эти накладные расходы за счет повторного использования частей существующей спецификации политики безопасности контента и scheme + wildcard domain и wildcard port в белом списке. В частности, это намерение будет использовать определения хост-источника и источника схемы вместо источника в определении списка разрешенных, требуя при этом, чтобы часть пути была пустой (поскольку политики разрешений применяются к совпадающим источникам).

Пакет FedCM: API подсказки для входа, API информации о пользователе и API контекста RP.

Это пакетное обновление позволяет настраивать федеративные потоки входа в систему, использующие Federated Credential Management API (FedCM).

С помощью API подсказки для входа проверяющая сторона (RP) может указать подсказку об учетной записи пользователя, которую она хочет отображать в пользовательском интерфейсе FedCM. В основном это используется для обеспечения лучшего UX для вернувшихся пользователей.

API информации о пользователе позволяет поставщику удостоверений (IdP) получать информацию о пользователе, чтобы он мог персонализировать вход в систему для вернувшихся пользователей, например, с помощью персонализированных кнопок «Войти с помощью IdP».

С помощью API контекста RP RP может запросить в диалоговом окне FedCM замену заголовка «Вход» на «Зарегистрироваться», «Использовать» или «Продолжить», чтобы согласовать фактическое намерение пользователя.

Несоставленные события входа/выхода мыши и указателя

Сделайте свойство event.composed в mouseenter , mouseleave , pointerenter и pointerleave "false" , чтобы обеспечить соответствие спецификации и устранить пробелы во взаимодействии. И спецификация событий пользовательского интерфейса для событий мыши, и спецификация событий указателя определяют эти события как несоставленные. Обе спецификации отошли от своих первоначальных определений несколько лет назад: https://github.com/w3c/uievents/pull/210 https://github.com/w3c/pointerevents/pull/461. Помимо устранения пробела во взаимодействии, это изменение также исправляет ошибочную двойную или тройную отправку этих событий на хост теневого DOM в Chromium , когда теневой DOM также прослушивает событие .

Удалить наследование document.open песочницы

В настоящее время флаги песочницы вызывающего объекта применяются к вызываемому, когда document.open нацелен на другое окно. После этого изменения такого больше не будет..

Отчет Critical-CH вызвал перезапуск в NavigationTiming

Веб-сайты могут указать, что конкретная подсказка клиента важна для страницы, включив ее в заголовок ответа HTTP Critical-CH . Это приведет к перезапуску соединения, если подсказка, указанная в заголовке HTTP-ответа Critical-CH могла быть (но не была) включена в первоначально отправленный HTTP-запрос. Это намерение предлагает добавить readonly attribute DOMHighResTimeStamp criticalCHRestart; к интерфейсу PerformanceNavigationTiming .

Испытания происхождения продолжаются

В Chrome 116 вы можете принять участие в следующих новых пробных версиях Origin .

COOP: ограничить свойства

Cross-Origin-Opener-Policy используется для разрыва связи между всплывающим окном и открывающими элементами для повышения безопасности. «restrict-properties» — это предлагаемое значение, которое ограничивает связь, а не полностью ее разрывает. Это позволит включить crossOriginIsolated в сочетании с COEP.

Зарегистрируйтесь для участия в пробной версии COOP с ограниченными свойствами .

API статуса входа в систему FedCM

API статуса входа в систему IdP API федеративного управления учетными данными (FedCM) позволяет поставщику удостоверений (IdP) сигнализировать браузеру, когда его пользователи входят в систему или выходят из нее, чтобы FedCM мог повысить свои свойства конфиденциальности путем оптимизации своего пользовательского интерфейса.

Зарегистрируйтесь для участия в пробной версии статуса входа в систему FedCM.

API редактирования контекста

API EditContext упрощает процесс интеграции веб-приложения с расширенными методами ввода текста, такими как написание фигур ВКонтакте, панели рукописного ввода, распознавание речи и композиции IME. API улучшает доступность и производительность, а также открывает новые возможности для веб-редакторов.

Зарегистрируйтесь для участия в пробной версии исходного API EditContext.

Длинный кадр анимации

Это расширение длительных задач. Он измеряет задачу вместе с ее последующим обновлением рендеринга, добавляя такую ​​информацию, как длительные сценарии выполнения, время рендеринга и время, затраченное на принудительный макет и стиль, известный как перебор макета .

Разработчики могут использовать это как диагностику «медлительности», измеряемой INP, путем обнаружения причин перегрузки основного потока, которая часто является причиной плохого INP.

Зарегистрируйтесь для участия в пробной версии Long Animation Frame Timing