Как заставить агентов писать хороший CSS. Брехт Де Рюйте пробует Modern Web Guidance от Google — набор навыков, который передаёт агентам для кодинга экспертные рекомендации по платформе вместе с данными Baseline. Поиск через CLI подгружает только нужные руководства из 103 фич, а фолбеки каждую ночь проверяют тесты на Playwright. Набор не привязан к проекту, поэтому автор добавил три своих навыка: уровни токенов, темы и состояния компонентов. #ai #css

https://utilitybend.com/blog/modern-web-guidance-antigravity-and-my-own-design-token-skills/

Новинки Firefox 155 для разработчиков. Релиз расширяет функцию attr() на любые CSS-свойства с единицами измерения и фолбеками, добавляет функции progress() и alpha(), переименовывает font-stretch в font-width и добавляет Promise.allKeyed() и Promise.allSettledKeyed(). В инструментах разработки появились панель эмуляции медиафич и поддержка JSON Lines. За флагами: анимации по скроллу и изолированные реестры кастомных элементов. #firefox #browser

https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/155

Как определить неопределяемые возможности CSS через @​supports named-feature(). Брамус Ван Дамм рассказывает о функции, которую рабочая группа CSS приняла для проверки того, что иначе не проверить. Запись @​supports (display: flex) and (gap: 1em) подтверждает только парсинг, но не то, что gap работает во флексах. Пока в спецификации два ключевых слова: anchor-position-follows-transforms и single-axis-scroll-container. #css #interop

https://www.bram.us/2026/08/27/feature-detecting-undetectable-css-features-with-supports-named-feature/

Ну и ладно, напишу свой текстовый редактор! Дэвид Бушелл пробует три способа собрать редактор в браузере и показывает, чем приходится жертвовать. Канвас даёт полный контроль, но лишает выделения текста, истории отмен и вставки нескольких строк. Атрибут contenteditable с плейн-текстом возвращает нативное редактирование и доступность, но тормозит после определённого числа символов. Быстрее всех оказался обычный <textarea> с подсветкой синтаксиса поверх. #html #performance

https://dbushell.com/2026/09/01/text-editor/

Выпуск №543. Лёша Красиков, Полина Гуртовая и Никита Дубко про новинки Firefox 155, предложения в Interop 2027, top-level await в Safari, ненужный initial-scale, альфу TanStack Charts и переключатели темы.

— Лайв на Ютубе
— Слушайте на Ютубе
— Ссылки на сайте

00:01:22 Новинки Firefox 155
00:42:14 Предложения в Interop 2027
00:51:08 Top-level await в Safari
01:00:39 Ненужный initial-scale
01:18:54 Альфа TanStack Charts
01:29:06 Переключатели темы не нужны

Открыт приём заявок в Interop 2027. Предложить фичи можно до 23 сентября, а гайд объясняет, на что смотрят браузеры: нужна стабильная спецификация и тесты веб-платформы, которые автоматически проходят в Chrome, Edge, Firefox и Safari на wpt.fyi. Ещё учитывают, ломается ли что-то на реальных сайтах, спрос из опросов разработчиков и польза для доступности. Шаблонов два: направления фокуса для готовых фич и исследования для остальных. #interop #wpt

https://github.com/web-platform-tests/interop/blob/main/proposal_guide.md

Выражения от контейнера со style() и продвинутый attr(): новый способ связывать компоненты в CSS. Брехт Де Рюйте превращает HTML-атрибуты в типизированные значения CSS: data-gap="2" на гриде становится attr(data-gap cqi, 2cqi) вместо утилитарного класса. Родитель задаёт data-density="compact", а выражения @​container style() пересчитывают отступы, аватарки и типографику через один множитель --density-scale. Без классов-модификаторов, пропсов и JavaScript. #css #component

https://utilitybend.com/blog/container-style-queries-and-advanced-attr-rethinking-how-to-wire-up-my-components-in-css/

В HTML больше не нужен initial-scale. Деклан Чидлоу и Питер-Пол Кох с разницей в несколько часов пришли к одному выводу: в <meta name="viewport"> достаточно width=device-width. Часть initial-scale=1 добавляли, чтобы починить зум в старых версиях iOS, а Safari теперь и без неё правильно пересчитывает вьюпорт при смене ориентации. Минус 19 байт в каждом документе. #html #browser

https://vale.rocks/micros/20260902-1350

https://quirksmode.org/quirksblog/2026/0902-initial.html

Новинки Chrome 153. Элементы <camera> и <microphone> декларативно запрашивают захват видео и звука. Стилизация кнопки ограничена, а доступ можно вернуть после отказа. Теперь overflow принимает значения прокрутки рядом с clip, и overflow: scroll clip создаёт контейнер прокрутки по одной оси. Свойство scroll-axis-lock управляет диагональной прокруткой. В JavaScript появились Iterator.zip() и Iterator.zipKeyed() для объединения итераторов. #chrome #browser

https://developer.chrome.com/release-notes/153

Сделайте логотип ярче белого. Крис Беннетт собрал инструмент, который превращает логотип в HDR-JPEG: выбранные цвета светятся до 7,5 раз ярче обычного белого на HDR-экранах, а во всех остальных случаях это совершенно обычная картинка. Лучше всего сияют светлые элементы на тёмном фоне. Ещё автор показывает, как красить текст такой картинкой через background-clip: text внутри @media (dynamic-range: high). #color #image

https://www.soverybright.com/

Выпуск №544. Никита Дубко, Лёша Красиков и Вадим Макеев про новинки Chrome 153, MCP-сервер MDN, HTML-бойлерплейт, цвета ярче белого и React 19.3.

— Лайв на Ютубе
— Слушайте на Ютубе
— Ссылки на сайте

00:01:41 Новинки Chrome 153
00:22:09 MCP-сервер MDN
00:29:24 HTML-бойлерплейт
01:22:34 Цвета ярче белого
01:33:42 React 19.3

Главный поток браузера — дорогой ресурс. Сонхёп Ли напоминает: в одном потоке живут JavaScript, стили, лейаут, отрисовка и события, а на всё это — около 10 миллисекунд на кадр, на 120 Гц вдвое меньше. Тратить их можно с умом: дробить длинные задачи через scheduler.yield(), объединять события дебаунсом и тротлингом, расставлять приоритеты и откладывать неважное. Или отдать работу композитору и воркерам. Всё показано на интерактивных демо. #performance #js

https://kciter.so/posts/the-expensive-main-thread/en/

Новинки Firefox 156 для разработчиков. Инспектор раскрывает шаги вычисления значения var(), attr() и env(), прослеживая их до источника. Вызовы scheduler.yield() сохраняют приоритет и сигнал отмены, даже если await завершился синхронно. Promise.try() передаёт нативный промис как есть, а переменные using больше нельзя переприсваивать. За флагами: named-feature() в @​supports и Container Timing API. #firefox #browser

https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/156

Новинки WebKit в Safari 27. Вышли релиз-ноуты от Apple: кастомизируемый <select>, scroll anchoring, WebAssembly JSPI, ariaNotify(), псевдокласс :heading, ключевые слова revert-rule и stretch, sizes="auto", import defer, субпиксельная строчная раскладка и статический роутинг для сервис-воркеров — всего 83 новые возможности и 844 исправления. #safari #css

https://developer.apple.com/documentation/safari-release-notes/safari-27-release-notes

Современные типы для веба. Филип Уолтон устал от того, что TypeScript помечает ошибками View Transition API, Long Animation Frame API и fetchLater(): официальные типы для DOM включают только те API, что уже есть в двух движках. Поэтому он выпустил modern-web-types — замену, собранную тем же генератором и по данным W3C webref, но с порогом в один движок: плюс 433 интерфейса, 223 глобальные переменные и 311 свойств и методов у существующих. #tools #js

https://philipwalton.com/articles/modern-web-types/

Сноски на полях с помощью CSS anchor positioning. Венсан Берна связывает знак сноски и саму заметку через anchor-name и position-anchor, оба значения берутся из дата-атрибутов типизированным attr(). Каждая заметка встаёт напротив своего знака сноски, а если мешает предыдущая, то max() из двух значений anchor() опускает её строкой ниже. На узких экранах и в старых браузерах сноски остаются под абзацем приглушённым цветом. #css #anchor

https://vincent.bernat.ch/en/blog/2026-css-sidenotes

Выпуск №545. Полина Гуртовая, Вадим Макеев и Алексей Симоненко про новинки Firefox 156, релиз Safari 27, выравнивание иконок, боковые сноски и аргументы против JPEG XL.

— Лайв на Ютубе
— Слушайте на Ютубе
— Ссылки на сайте

00:01:22 Новинки Firefox 156
00:14:44 Релиз Safari 27
01:06:33 Выравнивание иконок
01:17:58 Боковые сноски
01:30:29 Аргументы против JPEG XL