Новое на веб-платформе в январе

Откройте для себя некоторые интересные функции, которые появились в стабильных и бета-версиях веб-браузеров в январе 2024 года.

В январе 2024 года Firefox 122 , Chrome 121 и Safari 17.3 стали стабильными. В этом посте рассматриваются новые функции, добавленные в веб-платформу.

<hr> в <select>

Firefox 122 добавляет элементы <hr> в качестве допустимых дочерних элементов <select> . Это помогает улучшить читаемость списков выбора с большим количеством опций. Все основные браузерные движки теперь поддерживают эту функцию. Однако стоит отметить, что ни один браузер в настоящее время не отображает <hr> в дереве доступности.

Поддержка браузера

  • 119
  • 119
  • 122
  • 17

HTMLSelectElement.showPicker

Также для элементов <select> в Firefox есть метод showPicker() для HTMLSelectElement . Это тот же самый инструмент выбора, который обычно отображается при выборе элемента, но его можно активировать нажатием кнопки или другим взаимодействием с пользователем.

Поддержка браузера

  • 121
  • 121
  • 122

Источник

Самый большой API-интерфейс Contentful Paint (LCP)

Firefox 122 также поддерживает LCP API . Этот API производительности предоставляет информацию о времени для самого большого изображения или текста перед взаимодействием пользователей с веб-страницей. Подробную информацию о LCP можно найти в документации LCP .

Поддержка браузера

  • 77
  • 79
  • 122
  • Икс

Источник

Свойства полосы прокрутки CSS

В Chrome 121 добавлена ​​поддержка свойств полосы прокрутки scrollbar-color и scrollbar-width . Подробнее об этом читайте в статье Оформление полосы прокрутки .

Поддержка браузера

  • 121
  • 121
  • 64
  • Икс

Источник

CSS font-palette

Свойство font-palette позволяет выбрать определенную палитру для отображения цветового шрифта. Это свойство теперь поддерживает анимацию, поэтому переключение между палитрами становится плавным переходом между двумя выбранными палитрами.

Методы transfer() и transferToFixedLength() класса ArrayBuffer

Firefox включает методы JavaScript transfer() и transferToFixedLength() класса ArrayBuffer . Метод transfer() создает новый ArrayBuffer с тем же содержимым байтов, что и текущий ArrayBuffer , а затем отсоединяет исходный ArrayBuffer . Метод transferToFixedLength() работает таким же образом, но создает ArrayBuffer фиксированного размера.

Поддержка браузера

  • 114
  • 114
  • 122
  • 17,4

Источник

Обновления API правил спекуляций

Сайты используют API Speculation Rules , чтобы программно сообщать Chrome, какие страницы нужно предварительно отрисовывать, что повышает удобство работы пользователей за счет сокращения времени навигации по страницам.

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

Бета-версии браузера

Бета-версии браузера дают вам предварительный просмотр того, что будет в следующей стабильной версии браузера. Это прекрасное время для тестирования новых функций или удалений, которые могут повлиять на ваш сайт, прежде чем мир получит эту версию. Новые бета-версии — Firefox 123 , Chrome 122 и Safari 17.4 . Эти выпуски привносят в платформу множество замечательных функций. Ознакомьтесь со всеми подробностями в примечаниях к выпуску. Вот лишь несколько основных моментов.

Бета-версия Firefox 123 включает в себя декларативный теневой DOM .

Также в Firefox 123 поддерживается код состояния информационного ответа HTTP 103 Early Hints для предварительной загрузки ресурсов , которые могут потребоваться странице, пока сервер подготавливает полный ответ.

В бета-версии Safari 17.4 есть много хорошего. Для CSS есть поддержка @scope , align-content в блочных контейнерах и ячейках таблицы, а также псевдоэлементов ::grammar-error и ::spelling-error , а также многое другое.

В формах поддержка режима вертикального письма в элементах управления формой, метод showPicker() для <input type="date"> и поддержка <hr> внутри <select> в iOS.

JavaScript также получает некоторые новые функции, среди прочего, благодаря поддержке методов detached() , transfer() и transferToFixedLength() класса ArrayBuffer .

Бета-версия Chrome 122 включает unsanitized опцию в методе read() API Async Clipboard для получения несанкционированного формата HTML. Для JavaScript появились новые помощники итераторов и новые методы для встроенного класса Set .

Также в Chrome 122 есть API Storage Buckets , целью которого является сделать более предсказуемым постоянное вытеснение хранилища при сильном нехватке памяти.