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

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

Рэйчел Эндрю

Стабильные версии браузера

В мае Chrome 102, Safari 15.5 , Firefox 100 и Firefox 101 стали стабильными.

В Chrome 102 и Safari 15.5 есть атрибут inert . Он удаляет элементы из последовательности вкладок и дерева доступности, если они неинтерактивны. Например, элемент, который в данный момент находится за пределами экрана или скрыт.

Browser Support

  • Хром: 102.
  • Край: 102.
  • Firefox: 112.
  • Сафари: 15.5.

Source

В Chrome 102 добавлено новое значение until-found для атрибута HTML hidden . Это позволяет находить текст на странице и прокручивать его к фрагменту, находящемуся внутри свёрнутой области страницы, например, в шаблоне «гармошка». Подробнее см. в статье «Делаем свёрнутый контент доступным с помощью hidden=until-found» .

В Chrome 102 представлен Navigation API — API, стандартизирующий клиентскую маршрутизацию в одностраничных приложениях. Ранее этот API назывался App History API.

Browser Support

  • Хром: 102.
  • Край: 102.
  • Firefox: не поддерживается.
  • Safari: не поддерживается.

Source

Firefox 101 поддерживает конструируемые таблицы стилей . Поддерживаются конструктор CSSStyleSheet() , а также методы replace() и replaceSync() . Конструируемые таблицы стилей упрощают создание таблиц стилей для использования с Shadow DOM. В следующем примере таблица стилей создаётся с помощью конструктора CSSStyleSheet() , CSS-правило добавляется с помощью метода replaceSync() , а полученное правило выводится в консоль.

const stylesheet = new CSSStyleSheet();
stylesheet.replaceSync('body { color: red; }');
console.log(stylesheet.rules[0].cssText);

Browser Support

  • Хром: 73.
  • Край: 79.
  • Firefox: 101.
  • Сафари: 16.4.

Source

Также в Firefox 101 есть функция prefers-contrast media, что делает эту функцию доступной во всех браузерах.

Browser Support

  • Хром: 96.
  • Край: 96.
  • Firefox: 101.
  • Сафари: 14.1.

Source

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

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

Новые бета-версии в апреле — Chrome 103 и Firefox 102 .

В Firefox 102 включена функция update носителя. Она используется для проверки возможности устройства вывода изменять внешний вид контента после его отображения. Она принимает следующие значения:

none
После отображения контент не может быть обновлен. Например, печатный документ.
slow
Устройство может обновлять контент, но слишком медленно для отображения плавной анимации. Например, экраны E-ink.
fast
Содержимое может меняться динамически и достаточно быстро, чтобы отображать анимацию. Например, экран компьютера или телефона.

Browser Support

  • Хром: 113.
  • Край: 113.
  • Firefox: 102.
  • Сафари: 17.

Source

Chrome 103 включает API локального доступа к шрифтам , который обеспечивает доступ к локально установленным шрифтам пользователя.

Эти бета-функции скоро появятся в стабильных версиях браузеров.

Редактировать: В предыдущей версии этой статьи упоминался метод Element.isVisible() , который отсутствует в этой версии.

Часть серии «Новинки в Интернете»