Interop 2026 назвал 20 направлений фокуса. Apple, Google, Igalia, Microsoft и Mozilla будут работать над совместимостью и тестами веб-платформы для anchor positioning, продвинутым
https://wpt.fyi/interop-2026
Читайте подробнее в анонсах: Apple, Google, Igalia, Microsoft и Mozilla.
attr(), view transitions, Navigation API, WebTransport, WebRTC и CSS-свойством zoom, чтобы повысить совместимость браузеров для разработчиков. #interop #browserhttps://wpt.fyi/interop-2026
Читайте подробнее в анонсах: Apple, Google, Igalia, Microsoft и Mozilla.
🔥34❤8👍5
Вышли результаты State of React 2025. Релиз React 19, закрытие Create React App, объявление React Foundation на React Conf и стабильный Compiler 1.0 укрепили клиентский React, а споры вокруг RSC, директив и декабрьский CVE показали, что серверная часть ещё взрослеет. AI-инструменты вроде v0 и Cursor подстегнули вайб-кодинг. #stateof #react
https://2025.stateofreact.com/
https://2025.stateofreact.com/
🔥11👍7❤4🎉2
Выпуск №514. Полина Гуртовая, Вадим Макеев про фокус Interop 2026, новинки Safari 26.3, эластичный текст на CSS и State of React 2025.
— Лайв на Ютубе
— Слушайте на Ютубе
— Ссылки на сайте
— Лайв на Ютубе
— Слушайте на Ютубе
— Ссылки на сайте
❤15👍14
514. Фокус Interop 2026, новинки Safari 26.3, эластичный текст на…
Веб-стандарты
00:00:59 Фокус Interop 2026
00:42:40 Новинки Safari 26.3
00:57:58 Эластичный текст на CSS
01:22:59 State of React 2025
00:42:40 Новинки Safari 26.3
00:57:58 Эластичный текст на CSS
01:22:59 State of React 2025
👍19❤10
Новинки Chrome 145. Поддержка CSS-свойства
https://developer.chrome.com/release-notes/145
text-justify, проценты в letter-spacing и word-spacing, а также column-wrap и column-height для мультиколонок, плюс focusVisible для focus() и улучшенный overscroll. Также добавлены объект Origin, upsert-методы для Map, window.crashReport, а строка user-agent теперь отдаётся сокращённой по умолчанию. #chrome #browserhttps://developer.chrome.com/release-notes/145
👍21❤4
Декларативное меню на <dialog> с invoker commands. Дэвид Бушелл показывает гамбургерное меню на нативном
https://dbushell.com/2026/02/12/declarative-dialog-menu-invoker-commands/
<dialog> с новым Invoker Command API и небольшим JS-фолбэком для старых браузеров. Плюс заметки про :focus-visible в WebKit, closedby="any" и view transitions. #webdev #csshttps://dbushell.com/2026/02/12/declarative-dialog-menu-invoker-commands/
👍19❤13🔥5
Доступные строительные блоки для веба. Серия коротких видео от TetraLogical о базовых принципах доступных интерфейсов: заголовки, картинки, кнопки, ссылки и поля форм. Подробности о понятных подписях, хорошем контрасте, логичном порядке контента и семантическом HTML для пользователей клавиатур и скринридеров. #a11y #video
https://www.youtube.com/playlist?list=PLTqm2yVMMUKV_6GjmzgxqLuG9Ydgrk5QT
https://www.youtube.com/playlist?list=PLTqm2yVMMUKV_6GjmzgxqLuG9Ydgrk5QT
👍21❤8
Border-shape: будущее неквадратного веба. Юна Кравец рассказывает о
https://una.im/border-shape/
border-shape, новом CSS-свойстве, которое меняет геометрию самого блока, поэтому фон, border-image, обводка фокуса и тень повторяют его форму. Уже доступно в Chrome Canary для тестирования. #css #chromehttps://una.im/border-shape/
🔥61👍10❤9
Выпуск №515. Вадим Макеев, Полина Гуртовая, Никита Дубко про Chrome 145, Anchor Positioning, csskit, corner-shape и border-shape, WebMCP и MCP для Next.js.
— Лайв на Ютубе
— Слушайте на Ютубе
— Ссылки на сайте
— Лайв на Ютубе
— Слушайте на Ютубе
— Ссылки на сайте
❤30👍7
515. Chrome 145, Anchor Positioning, csskit, corner-shape и border…
Веб-стандарты
00:01:38 Новинки Chrome 145
00:29:51 Anchor Positioning и csskit
00:45:17 Сложное внедрение corner-shape
01:04:52 Неквадратный веб с border-shape
01:22:39 Зачем нам WebMCP
01:36:52 Отладка Next.js с MCP
00:29:51 Anchor Positioning и csskit
00:45:17 Сложное внедрение corner-shape
01:04:52 Неквадратный веб с border-shape
01:22:39 Зачем нам WebMCP
01:36:52 Отладка Next.js с MCP
🎉20👍6❤4🔥4
Подробный гид по стилизации списков в CSS. Ричард Раттер показывает, как задавать отступы в
https://piccalil.li/blog/an-in-depth-guide-to-customising-lists-with-css/
lh, настраивать маркеры через ::marker, и делать кроссбраузерные символы с @counter-style, ну или использовать давно знакомый ::before, когда не хватает браузерной поддержки. #csshttps://piccalil.li/blog/an-in-depth-guide-to-customising-lists-with-css/
❤19🔥14👍5
Спрайты в вебе. Джош Комо показывает, как анимировать спрайты в CSS во вьюпорте
https://www.joshwcomeau.com/animation/sprites/
<img>: object-fit, object-position и steps(jump-none) для чёткой покадровой смены, а также разбирает, когда спрайты лучше GIF и когда лучше процедурная анимация. #css #animationhttps://www.joshwcomeau.com/animation/sprites/
👍45❤12
Новинки Firefox 148 для разработчиков. Релиз добавляет HTML Sanitizer API и Trusted Types, а также
https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/148
Iterator.zip() и zipKeyed(), функцию CSS shape(), улучшения anchor positioning и экспериментальный Document Picture-in-Picture API. #firefox #browserhttps://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/148
👍24🔥10❤2
Практическое руководство по элементу <img>: от основ до LCP. Джоан Леон разбирает атрибуты
https://joanleon.dev/en/guia-practica-elemento-img/
srcset и sizes для адаптивных изображений, <picture> с AVIF и WebP, а также loading=lazy, width и height против CLS, decoding и fetchpriority. Отдельно о том, когда стоит добавить preload для LCP-картинок и почему иногда всё-таки нужны CDN. #performance #htmlhttps://joanleon.dev/en/guia-practica-elemento-img/
🔥24👍13❤3
WebAssembly как полноценный язык для веба. Райан Хант пишет, что загрузка и доступ к веб-API через прослойку JavaScript усложняют разработку и даёт лишний оверхед, а WebAssembly Component Model и WIT могут принести прямой доступ к API, загрузку через
https://hacks.mozilla.org/2026/02/making-webassembly-a-first-class-language-on-the-web/
<script> и более быстрые обновления DOM. #webassembly #firefoxhttps://hacks.mozilla.org/2026/02/making-webassembly-a-first-class-language-on-the-web/
🔥41👍7❤5
Выпуск №516. Никита Дубко и Вадим Макеев про новинки Firefox 148, ленивую загрузку медиа, перфоманс
— Лайв на Ютубе
— Слушайте на Ютубе
— Ссылки на сайте
<img> и сжатие со словарями.— Лайв на Ютубе
— Слушайте на Ютубе
— Ссылки на сайте
🔥23❤9👍9
516. Новинки Firefox 148, ленивая загрузка медиа, перфоманс img…
Веб-стандарты
00:01:30 Новинки Firefox 148
00:25:40 Ленивая загрузка медиа
00:41:25 Перфоманс img
01:22:39 Сжатие со словарями
01:46:15 Ответы на вопросы
00:25:40 Ленивая загрузка медиа
00:41:25 Перфоманс img
01:22:39 Сжатие со словарями
01:46:15 Ответы на вопросы
❤24👍7🔥7
Нативная случайность в CSS. Альваро Монторо разбирает
https://alvaromontoro.com/blog/68092/native-random-values-in-css
random() и random-item(), две новые CSS-функции из Values and Units Module Level 5. random() возвращает значение в заданном диапазоне с опциональным шагом, а random-item() выбирает из списка дискретных значений. Обе функции поддерживают параметры совместного использования для корреляции результатов между свойствами и элементами. Пока частичная поддержка есть только в Safari 26.2. #css #safarihttps://alvaromontoro.com/blog/68092/native-random-values-in-css
👍20❤5
Как задать цвет темы для Safari 26. Мартин Грубингер рассказывает, что Safari 26 отказался от
https://grooovinger.com/notes/2026-02-27-safari-26-header-background
<meta name="theme-color"> и теперь определяет цвет интерфейса по фону body или фиксированного элемента вверху страницы. В статье предложен трюк на scroll-driven анимациях: скрытый фиксированный элемент сохраняет нужный цвет, пока не уходит из вида при прокрутке. Подход не работает, если страница перезагружается не в начальной позиции прокрутки. #safari #csshttps://grooovinger.com/notes/2026-02-27-safari-26-header-background
🔥17👍4❤1
Словарное сжатие наконец здесь, и результаты впечатляют. Тим Перри объясняет, как Compression Dictionary Transport работает с Zstandard и Brotli поверх HTTP: предыдущие ответы используются как словари для сжатия данных почти до размера дельт. JS-бандлы YouTube уменьшаются до 90% по сравнению с Brotli, HTML поиска Google — почти на 50%. Уже используется в Google, Shopify, Pinterest и Notion. Chrome 130+, Safari и Firefox на подходе. #performance #http
https://httptoolkit.com/blog/dictionary-compression-performance-zstd-brotli/
https://httptoolkit.com/blog/dictionary-compression-performance-zstd-brotli/
🔥58👍6❤5