Хром 133 бета

Рэйчел Эндрю

Опубликовано: 15 января 2024 г.

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

CSS и пользовательский интерфейс

В этом выпуске добавлено семь новых функций CSS и пользовательского интерфейса.

Расширенная функция CSS attr()

Реализует дополнение к attr() указанное в CSS Level 5, которое позволяет использовать типы, кроме <string> , во всех свойствах CSS (в дополнение к существующей поддержке псевдоэлемента content ).

Узнайте больше в статье об обновлении CSS attr() .

CSS :open псевдокласс

Псевдокласс :open соответствует <dialog> и <details> , когда они находятся в открытом состоянии, и соответствует <select> и <input> , когда они находятся в режимах, в которых есть средство выбора и средство выбора отображается.

Запросы контейнера состояния прокрутки CSS

Используйте контейнерные запросы для стилизации потомков контейнеров на основе их состояния прокрутки.

Контейнер запроса — это либо контейнер прокрутки, либо элемент, на который влияет положение прокрутки контейнера прокрутки. Могут быть запрошены следующие состояния:

  • stuck : контейнер с липким расположением приклеен к одному из краев ползунка прокрутки.
  • snapped : контейнер, выровненный по привязке к прокрутке, в настоящее время привязан горизонтально или вертикально.
  • scrollable : можно ли прокручивать контейнер прокрутки в запрошенном направлении.

Новый container-type: scroll-state позволяет запрашивать контейнеры.

#sticky {
  position: sticky;
  container-type: scroll-state;
}

@container scroll-state(stuck: top) {
  #sticky-child {
    font-size: 75%;
  }
}

Узнайте больше в CSS scroll-state() .

CSS text-box , text-box-trim и text-box-edge

Для достижения оптимального баланса текстового содержимого свойства text-box-trim и text-box-edge , а также свойство text-box shorthand позволяют более точно контролировать вертикальное выравнивание текста.

Свойство text-box-trim определяет стороны, которые необходимо обрезать (сверху или снизу), а свойство text-box-edge указывает, как следует обрезать край.

Эти свойства позволяют точно контролировать вертикальный интервал с помощью показателей шрифта. Узнайте больше в CSS text-box-trim .

Значение hint атрибута popover

API Popover определяет поведение для двух значений атрибута popover : auto и manual . Эта функция описывает третье значение, popover=hint . Подсказки, которые чаще всего связаны с поведением типа «подсказка», ведут себя несколько иначе. В первую очередь разница в том, что hint подчиняется auto при открытии вложенных стопок поповеров. Таким образом, можно открыть несвязанную hint подсказку, в то время как существующий стек auto всплывающих окон остается открытым.

Канонический пример: окно выбора <select> открыто ( popover=auto ) и отображается всплывающая подсказка, активируемая при наведении курсора мыши ( popover=hint ). Это действие не закрывает средство выбора <select> .

Улучшения вызова всплывающего окна и позиционирования привязки

Добавляет обязательный способ установки связей между поповерами с помощью popover.showPopover({source}) . Позволяет связям инициатора создавать неявные ссылки на элементы привязки.

Поповер, вложенный в вызывающий элемент, не должен вызывать его повторно.

В следующем случае нажатие кнопки правильно активирует всплывающее окно, однако нажатие на само всплывающее окно после этого не должно его закрывать.

<button popovertarget=foo>Activate
  <div popover id=foo>Clicking me shouldn't close me</div>
</button>

Раньше это происходило, потому что щелчок всплывающего окна отображался на <button> и активировал вызывающий элемент, который закрывал всплывающее окно. Теперь это поведение изменено на ожидаемое.

Веб-API

Animation.overallProgress

Предоставляет разработчикам удобное и последовательное представление о том, как далеко продвинулась анимация на протяжении ее итераций, независимо от характера ее временной шкалы. Без свойства overallProgress вам необходимо вручную вычислить, насколько далеко продвинулась анимация, принимая во внимание количество итераций анимации и то, является ли currentTime анимации процентом от общего времени (как в случае с анимацией, управляемой прокруткой). или абсолютную величину времени (как в случае анимации, управляемой временем).

Метод pause() объекта Atomics

Добавляет метод pause() к объекту пространства имен Atomics , чтобы намекнуть процессору, что текущий код выполняет спин-блокировку.

Отчеты по хэшу CSP для сценариев

Сложным веб-приложениям часто необходимо отслеживать загружаемые подресурсы в целях безопасности.

В частности, будущие отраслевые стандарты и лучшие практики (например, PCI-DSS v4) требуют, чтобы веб-приложения вели учет всех скриптов, которые они загружают и выполняют.

Эта функция основана на CSP и API отчетов и позволяет сообщать URL-адреса и хэши (для CORS/того же происхождения) всех ресурсов сценария, загружаемых документом.

Шаг по сохранению состояния DOM

Добавляет примитив DOM ( Node.prototype.moveBefore ), который позволяет перемещать элементы по дереву DOM без сброса состояния элемента.

При перемещении вместо удаления и вставки сохраняется следующее состояние:

  • Элементы <iframe> остаются загруженными.
  • Активным элементом остается фокус.
  • Поповеры, полноэкранные и модальные диалоговые окна остаются открытыми.
  • CSS-переходы и анимация продолжаются.

Предоставить атрибут attributionsrc в <area>

Согласовывает доступность атрибута attributionsrc в <area> с существующим поведением обработки атрибута, даже если он не был предоставлен.

Кроме того, имеет смысл поддерживать атрибут <area> , поскольку этот элемент является первоклассной поверхностью навигации, а Chrome уже поддерживает это на других поверхностях <a> и window.open

Предоставление угрубленного renderTime между источниками во времени элемента и LCP (независимо от Timing-Allow-Origin )

Записи времени элемента и LCP имеют атрибут renderTime , сопоставленный с первым кадром, в котором было нарисовано изображение или текст.

В настоящее время этот атрибут защищен для изображений из разных источников, требуя наличия заголовка Timing-Allow-Origin в ресурсе изображения. Однако это ограничение легко обойти (например, отображая изображения одного и того же происхождения и изображения из разных источников в одном кадре).

Поскольку это стало источником путаницы, мы вместо этого планируем снять это ограничение и вместо этого увеличить время рендеринга на 4 мс, если документ не изолирован между источниками. По-видимому, это достаточно грубо, чтобы избежать утечки какой-либо полезной информации о времени декодирования изображений с перекрестным происхождением.

Интерфейс FileSystemObserver

Интерфейс FileSystemObserver уведомляет веб-сайты об изменениях в файловой системе. Сайты отслеживают изменения в файлах и каталогах, на которые пользователь ранее предоставил разрешение, на локальном устройстве пользователя или в файловой системе сегмента (также известной как исходная частная файловая система) и получают уведомления об основных изменениях, например тип изменения.

Зависание в режиме энергосбережения

Когда режим энергосбережения активен, Chrome заморозит «группу контекста просмотра», которая была скрыта и молчала более пяти минут, если какая-либо подгруппа кадров одного происхождения в ней превышает порог использования ЦП, если только она:

  • Обеспечивает функциональность аудио- или видеоконференций (определяется путем идентификации микрофона, камеры или захвата экрана/окна/вкладки или RTCPeerConnection с «открытым» RTCDataChannel или «живым» MediaStreamTrack).
  • Управляет внешним устройством (обнаруживается с использованием WebUSB, Web Bluetooth, WebHID или Web Serial).
  • Удерживает веб-блокировку или соединение IndexedDB, которое блокирует обновление версии или транзакцию в другом соединении.

Замораживание заключается в приостановке выполнения. Формально он определен в API жизненного цикла страницы.

Порог использования ЦП будет откалиброван таким образом, чтобы заморозить примерно 10 % фоновых вкладок, когда режим энергосбережения активен.

Несколько карт импорта

Карты импорта в настоящее время должны загружаться перед любым модулем ES, и в каждом документе может быть только одна карта импорта. Это делает их хрупкими и потенциально медленными для использования в реальных сценариях: любой модуль, который загружается до них, нарушает работу всего приложения, а в приложениях со многими модулями они становятся большим блокирующим ресурсом, поскольку необходимо загрузить всю карту для всех возможных модулей. первый.

Эта функция позволяет импортировать несколько карт для одного документа, объединяя их согласованным и детерминированным способом.

Заголовки доступа к хранилищу

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

Поддержка создания ClipboardItem с помощью Promise<DOMString>

ClipboardItem , который является входными данными для асинхронного метода write() буфера обмена, теперь принимает в своем конструкторе строковые значения в дополнение к Blob. ClipboardItemData может быть большим двоичным объектом, строкой или обещанием, которое разрешается либо в большой двоичный объект, либо в строку.

Память веб-сборки64

Предложение Memory64 добавляет поддержку линейной памяти WebAssembly размером более 2^32 бит. Он не предоставляет новых инструкций, а вместо этого расширяет существующие инструкции, позволяя использовать 64-битные индексы для памяти и таблиц.

API веб-аутентификации: метод PublicKeyCredential getClientCapabilities()

Метод PublicKeyCredential getClientCapabilities() позволяет определить, какие функции WebAuthn поддерживаются клиентом пользователя. Метод возвращает список поддерживаемых возможностей, что позволяет разработчикам адаптировать возможности аутентификации и рабочие процессы на основе конкретных функций клиента.

WebGPU: однокомпонентные форматы вершин (и unorm8x4-bgra)

Добавляет дополнительные форматы вершин, отсутствующие в первоначальной версии WebGPU из-за отсутствия поддержки или старых версий macOS (которые больше не поддерживаются ни одним браузером). Однокомпонентные форматы вершин позволяют приложениям запрашивать только необходимые данные, тогда как раньше им приходилось запрашивать как минимум в два раза больше для 8- и 16-битных типов данных. Формат unorm8x4-bgra делает немного более удобным загрузку цветов вершин в кодировке BGRA, сохраняя при этом тот же шейдер.

Алгоритм X25519 API веб-криптографии

Алгоритм «X25519» предоставляет инструменты для согласования ключей с использованием функции X25519, указанной в [RFC7748]. Идентификатор алгоритма «X25519» можно использовать в интерфейсе SubtleCrypto для доступа к реализованным операциям:generateKey, importKey,exportKey, DerivateKey и DerivateBits.

Новые испытания происхождения

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

Отключить зависание в энергосбережении

Эта пробная версия отказа позволяет сайтам отказаться от блокировки режима энергосбережения, который доступен в Chrome 133.

Устаревания и удаления

В этой версии Chrome представлены устаревшие и удаленные версии, перечисленные ниже. Посетите ChromeStatus.com, чтобы просмотреть списки запланированных, текущих и предыдущих удалений.

В этом выпуске Chrome исключена одна функция.

Устарело ограничение maxInterStageShaderComponents для WebGPU.

maxInterStageShaderComponents limit устарело по ряду факторов. Предполагаемая дата удаления в Chrome 135.

  • Избыточность с помощью maxInterStageShaderVariables : это ограничение уже служит аналогичной цели, контролируя объем данных, передаваемых между этапами шейдера.
  • Незначительные расхождения: хотя существуют небольшие различия в способах расчета двух пределов, эти различия незначительны и ими можно эффективно управлять в пределах ограничения maxInterStageShaderVariables .
  • Упрощение. Удаление maxInterStageShaderComponents упрощает интерфейс шейдера и упрощает работу разработчиков. Вместо того, чтобы управлять двумя отдельными ограничениями с небольшими различиями, они могут сосредоточиться на более подходящем названии и всеобъемлющем maxInterStageShaderVariables .

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

Раньше, когда ресурс предварительно загружался с помощью <link rel=prefetch> , Chrome игнорировал семантику его кэша (а именно max-age и no-cache ) при первом использовании в течение пяти минут, чтобы избежать повторной загрузки. Теперь Chrome удаляет этот особый случай и использует обычную семантику HTTP-кеша.

Это означает, что веб-разработчикам необходимо включить соответствующие заголовки кэширования (Cache-Control или Expires), чтобы увидеть преимущества <link rel=prefetch> .

Это также влияет на нестандартный <link rel=prerender> .

Удалить запуск страницы приветствия Chrome с вкладками первого запуска начальных настроек.

Включение chrome://welcome в свойство first_run_tabs файла initial_preferences теперь не будет иметь никакого эффекта. Это удалено, поскольку эта страница является избыточной для первого запуска, который запускается на настольных платформах.