Новинки Chrome 146. CSS-анимации по скролу позволяют декларативно управлять CSS-анимациями по позиции прокрутки. Sanitizer API помогает защитить приложения от XSS. WebGPU получает режим совместимости со старыми графическими API. Также добавлены Iterator.concat, мета-элемент для масштабирования текста на мобильных, улучшения Navigation API и более точные метрики LCP. #chrome #browser

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

Вы не знаете HTML-таблицы. Фрэнк Тейлор выходит за пределы базовых понятий и разбирает терминологию таблиц, API Table Object Model, семантику заголовочных ячеек с атрибутами scope и headers, а также практические паттерны для создания доступных и хорошо структурированных таблиц с <thead>, <tbody>, <tfoot> и хелперами на JavaScript. #html #a11y

https://blog.frankmtaylor.com/2026/03/05/you-dont-know-html-tables/

Выпуск №518. Никита Дубко и Алексей Симоненко про новинки Chrome 146, релиз Vite 8 и краткую историю доменов.

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

00:00:59 Новинки Chrome 146
00:40:47 Релиз Vite 8
01:08:54 Краткая история доменов

Уход от Sass: нативный нестинг CSS. Стюарт Робсон рассказывает, как работает нативная вложенность CSS в браузерах и сравнивает её с Sass. Он разбирает специфичность, символ &, практические отличия от Sass и примеры компонентов: алерты, карточки и формы поиска. А также интеграция с выражениями от контейнера, :has() и prefers-reduced-motion. #css #learn

https://www.alwaystwisted.com/articles/UnSassing-my-CSS-nesting

Представляем view-transitions-mock — невизуальный полифил для view transition в рамках документа. Брамус Ван Дамм создал JavaScript-реализацию View Transition API совместимую со спецификацией, которая работает во всех браузерах без кучи условий в коде. Она обрабатывает document.startViewTransition(), класс ViewTransition с промисами и типы View Transition. Обновления DOM идентичны нативным, но анимации пропускаются в старых браузерах. #viewtransition #polyfill

https://www.bram.us/2026/03/11/view-transitions-mock-is-a-non-visual-polyfill-for-same-document-view-transitions/

Temporal: девятилетний путь к исправлению времени в JavaScript. Джейсон Уильямс рассказывает, как предложение Temporal прошло от идеи до Stage 4, заменив устаревший Date API, унаследованный от Java в 1995 году. В статье описаны иммутабельные объекты, явная поддержка часовых поясов и наносекундная точность, а также temporal_rs — общая библиотека на Rust, позволяющая нескольким движкам использовать одну реализацию. #ecmascript #temporal

https://bloomberg.github.io/js-blog/post/temporal/

Неожиданные кастомные селекты. Патрик Броссет создаёт три креативные демки с новым кастомизируемым элементом <select>: изогнутую стопку папок с CSS-трансформациями и sibling-index(), веер игральных карт с anchor positioning и круговой эмодзи-пикер на тригонометрических функциях CSS. Все демки сохраняют доступность и адекватно деградируют в неподдерживающих браузерах. #css #html

https://css-tricks.com/abusing-customizable-selects/

Загнутый уголок на CSS. Китти Жиродель разбирает эффект при наведении, при котором угол изображения загибается. Техника сочетает clip-path для обрезки, белый треугольник для складки и тени под ним. Статья также описывает фолбек для эффектов размытия с помощью нескольких смещённых элементов и показывает, как CSS-переходы обеспечивают плавную анимацию. #css #animation

https://kittygiraudel.com/2026/03/05/folded-corner-with-css/

Выпуск №519. Никита Дубко, Алексей Симоненко и Вадим Макеев про статистику из браузеров, Virtual Keyboard API, обновление Shower, модалки или страницы.

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

00:01:15 Статистика из браузеров
00:19:27 Virtual Keyboard API
00:45:13 Обновление Shower
01:14:26 Модалки или страницы
01:43:23 Ответы на вопросы

CSSkit, высокопроизводительный CSS-тулчейн на Rust. Проект Кита Циркеля объединяет парсинг, минификацию, линтинг, форматирование, транспиляцию, бандлинг и анализ CSS в одном инструменте без конфигурации. Также включает интеграцию с LSP для поддержки в IDE. Проект вдохновлён oxc и находится в стадии альфы. #css #tools

https://csskit.rs

Новинки Firefox 149 для разработчиков. Релиз добавляет значение popover="hint", CloseWatcher для кастомных закрываемых компонентов, поддержку xywh() в shape-outside, vertical-align как сокращённое свойство, опциональные условия @container, HTMLSelectElement.showPicker() для элементов <datalist> и HTMLMediaElement.captureStream(). #firefox #browser

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

Новинки WebKit в Safari 26.4. Джен Симмонс представляет 44 новые фичи: grid lanes для masonry-раскладок, WebTransport для двусторонней связи с низкой задержкой и Keyboard Lock API для перехвата клавиатурных сокращений в полноэкранном режиме. Также добавлены name-only container queries, потоковые scroll-driven animations, ReadableByteStream и улучшения раскладки, Web Inspector и доступности. Плюс 191 багфикс. #safari #browser

https://webkit.org/blog/17862/webkit-features-for-safari-26-4/

Под капотом: CSS-архитектура редизайна. Брехт де Рёйте рассказывает о каскадных слоях для приоритета стилей, трёхуровневой системе дизайн-токенов, функции light-dark() для переключения тем, нормализации стилей через :where(), выражениях от контейнера для адаптивных компонентов, логических свойствах и прогрессивном улучшении через @supports. #css #design

https://utilitybend.com/blog/under-the-hood-a-closer-look-at-the-css-architecture-behind-the-redesign

The Layout Maestro — практический курс по CSS-раскладкам. Курс Ахмада Шадида учит думать о раскладке, а не просто запоминать синтаксис. Он охватывает флексы, гриды, выражения от контейнера и :has() через визуальные уроки и интерактивные демо, помогая строить устойчивые раскладки, которые не ломаются при изменении контента или размера экрана. #css #learn

https://thelayoutmaestro.com

Выпуск №520. Полина Гуртовая, Вадим Макеев и Алексей Симоненко про Safari 26.4, Firefox 149, TypeScript 6.0 и миксины в CSS.

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

00:01:07 Safari 26.4
00:42:52 Firefox 149
01:19:03 TypeScript 6.0
01:41:42 Миксины в CSS
01:59:28 Ответы на вопросы

CSS is DOOMed: рендеринг DOOM в 3D на CSS. Нильс Линхир создал версию классической игры, где каждый визуальный элемент — это <div>, расположенный в 3D-пространстве с помощью CSS-трансформаций, а JavaScript отвечает только за игровую логику. Проект использует тригонометрические функции CSS, @property для анимируемых кастомных свойств, anchor positioning для HUD и SVG-фильтры для призрачных врагов. #css #3d

https://nielsleenheer.com/articles/2026/css-is-doomed-rendering-doom-in-3d-with-css/

Кастомные элементы с поддержкой форм на практике. Роб Левин делится опытом добавления поддержки Form-Associated Custom Element в библиотеку AgnosticUI с помощью ElementInternals API. Статья описывает две стратегии валидации: делегирование нативным элементам формы и реализацию валидации напрямую, с пошаговыми примерами для input, radio и combobox, включая проблемы изоляции Shadow DOM. #webcomponents #html

https://frontendmasters.com/blog/form-associated-custom-elements-in-practice/

Нативные JSON-модули наконец-то стали реальностью. Мэтт Смит объясняет, как атрибуты импорта позволяют загружать JSON-файлы напрямую через import data from 'data.json' with { type: 'json' } без сборщика. Браузеры и рантаймы обрабатывают JSON-модули нативно с явным указанием типа, что избавляет от трансформаций на этапе сборки и закладывает основу для будущих типов модулей. #json #js

https://allthingssmitty.com/2026/03/16/native-json-modules-are-finally-real/