Новое в Chrome 114

Адриана Хара

Вот что вам нужно знать:

  • CSS text-wrap: balance доступен для улучшения макетов текста.
  • Файлы cookie, разделенные по сайтам верхнего уровня ( CHIPS ), находятся здесь.
  • Поповеры стали проще, чем когда-либо, с Popover API .
  • И есть еще много чего .

Я Адриана Хара. Давайте углубимся и посмотрим, что нового для разработчиков в Chrome 114.

text-wrap:balance .

Используйте text-wrap: balance для улучшения макета текста. Анимация ниже показывает, какую разницу можно добиться с помощью этой одной строки.

Попробуйте демо

Как разработчик, вы не знаете окончательный размер, размер шрифта или даже язык текста. Все переменные необходимы для эффективной обработки переноса текста. Поскольку браузер знает все факторы, с помощью text-wrap:balance вы можете попросить браузер найти лучшее решение для сбалансированного переноса строк.

Два предыдущих примера показаны вместе, один помечен как несбалансированный, а другой как сбалансированный.

Сбалансированный текстовый блок более приятен глазу читателя. Он лучше привлекает внимание и в целом его легче читать.

Балансировка заголовков будет и должна быть основным вариантом использования text-wrap: balance . Балансировка текста требует затрат производительности, поэтому для снижения затрат он работает только для четырех строк.

Прочтите эту статью с образцами и более подробной информацией, чтобы улучшить макеты текста.

CHIPS: файлы cookie с независимым разделенным состоянием.

CHIPS (файлы cookie с независимым разделенным состоянием) позволяют разрешить разделение сторонних файлов cookie сайтом верхнего уровня с использованием нового атрибута cookie Partitioned .

До появления CHIPS, когда пользователь посещает сайт A, встроенный сайт C мог установить файл cookie на компьютере пользователя. Если пользователь затем посещает сайт B, который также встроен в сайт C, сайт C может получить доступ к тому же файлу cookie, который был установлен на сайте A. Это позволяет сайту C собирать информацию о действиях пользователя на сайтах A, B и на каждом сайте, на котором он встроен. на.

Диаграмма, показывающая сайты и хранилище с неразделенными файлами cookie.

Несмотря на то, что межсайтовое отслеживание является проблемой, существуют обоснованные потребности в межсайтовых файлах cookie, которые можно обеспечить с помощью сохранения конфиденциальности с помощью разделения файлов cookie.

При использовании CHIPS, когда пользователь посещает сайт A и встроенный контент с сайта C устанавливает файл cookie с атрибутом Partitioned, файл cookie сохраняется в разделенном банке только для файлов cookie, которые сайт C устанавливает, когда он встроен на сайт A. Браузер будет отправлять только эти файлы. cookie, когда сайтом верхнего уровня является A.

Диаграмма, показывающая сайты и разделенное хранилище с файлами cookie.

Когда пользователь посещает новый сайт, например сайт B, сайт C не получит файл cookie, который был установлен, когда C был встроен в сайт A.

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

API Поповера.

С помощью Popover API проще создавать элементы временного пользовательского интерфейса (UI), которые отображаются поверх всего другого пользовательского интерфейса веб-приложения.

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

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

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

Ознакомьтесь с этой статьей для получения дополнительной информации.

И многое другое!

Конечно, есть еще много всего.

  • DevTools позволяет приостанавливать и отлаживать код C и C++ в приложениях WebAssembly с поддержкой DWARF .
  • Параметр exclusionFilters в navigator.bluetooth.requestDevice() позволяет веб-разработчикам исключать некоторые устройства из средства выбора браузера.
  • Существует пробная версия Background Blur .

Дальнейшее чтение

Здесь рассматриваются лишь некоторые ключевые моменты. Перейдите по ссылкам ниже, чтобы узнать о дополнительных изменениях в Chrome 114.

Подписаться

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

Привет, Адриана Хара, как только выйдет Chrome 115, я буду здесь, чтобы рассказать вам, что нового в Chrome!