🦊 Фронти на связи!
«Привет, это Фронти!» — эту фразу вы слышали целых 30 раз в 2025 году. Пришло время свернуть хвостик калачиком: новых выпусков в этом году больше не будет. Все авторы статей разбежались по теплым краям отдыхать, и я их полностью поддерживаю. Мне тоже пора в свою уютную норку — набираться сил и видеть сны про эффективный код.
Но перед тем как нырнуть в спячку, я подготовил для вас праздничный отчёт о своих лисьих подвигах в 2025 году!
📊 Итоги в цифрах:
* 30 выпусков пролетели как одно мгновение.
* 1407 статей! Ого, сколько полезного мы натаскали в норку.
* 46.9 — среднее количество ссылок в одном выпуске.
* Июнь 2025 стал самым жарким: целых 289 статей за месяц!
* Любимые темы: После обязательных «Инструментов» вы больше всего шуршали в разделах «CSS и дизайн» (178 статей), «React и фреймворки» (170) и «Node.js» (148).
🦊 Лисья шутка недели:
— Почему лиса никогда не открывает сайты в Internet Explorer?
— Потому что даже дикий зверь знает, когда пора валить в лес!
Весь этот год мы с Колей Шабалиным старались, чтобы наш дайджест помогал вам не заблудиться в бесконечных фронтенд-дебрях.
Огромное лисье спасибо:
Всем читателям — за то, что вы с нами. Тем, кто пишет добрые слова — они греют лучше любого меха! И отдельные благодарности тем, кто поддерживает нас донатами и звёздами. Ваша поддержка — это важно для нас!
📅 Что дальше?
31-й выпуск выскочит из засады уже в январе 2026 года. Точную дату пока держу в секрете (на самом деле, жду, когда авторы доедят салаты и напишут что-нибудь новенькое).
Желаю всем в Новом году крепкого здоровья и невероятных успехов! Отдыхайте на полную катушку, чтобы с новыми силами вернуться в наш странный, но такой увлекательный мир фронтенда.
До встречи в 2026-м! Ваш Фронти 🦊✨
«Привет, это Фронти!» — эту фразу вы слышали целых 30 раз в 2025 году. Пришло время свернуть хвостик калачиком: новых выпусков в этом году больше не будет. Все авторы статей разбежались по теплым краям отдыхать, и я их полностью поддерживаю. Мне тоже пора в свою уютную норку — набираться сил и видеть сны про эффективный код.
Но перед тем как нырнуть в спячку, я подготовил для вас праздничный отчёт о своих лисьих подвигах в 2025 году!
📊 Итоги в цифрах:
* 30 выпусков пролетели как одно мгновение.
* 1407 статей! Ого, сколько полезного мы натаскали в норку.
* 46.9 — среднее количество ссылок в одном выпуске.
* Июнь 2025 стал самым жарким: целых 289 статей за месяц!
* Любимые темы: После обязательных «Инструментов» вы больше всего шуршали в разделах «CSS и дизайн» (178 статей), «React и фреймворки» (170) и «Node.js» (148).
🦊 Лисья шутка недели:
— Почему лиса никогда не открывает сайты в Internet Explorer?
— Потому что даже дикий зверь знает, когда пора валить в лес!
Весь этот год мы с Колей Шабалиным старались, чтобы наш дайджест помогал вам не заблудиться в бесконечных фронтенд-дебрях.
Огромное лисье спасибо:
Всем читателям — за то, что вы с нами. Тем, кто пишет добрые слова — они греют лучше любого меха! И отдельные благодарности тем, кто поддерживает нас донатами и звёздами. Ваша поддержка — это важно для нас!
📅 Что дальше?
31-й выпуск выскочит из засады уже в январе 2026 года. Точную дату пока держу в секрете (на самом деле, жду, когда авторы доедят салаты и напишут что-нибудь новенькое).
Желаю всем в Новом году крепкого здоровья и невероятных успехов! Отдыхайте на полную катушку, чтобы с новыми силами вернуться в наш странный, но такой увлекательный мир фронтенда.
До встречи в 2026-м! Ваш Фронти 🦊✨
🎄12❤🔥5❤3
Что стало Widely available в Baseline в декабре 2025
Коротко:
• calc() keywords
• JavaScript modules in workers
• window.print() 😄
Длинно: https://habr.com/ru/articles/979276/
Коротко:
• calc() keywords
• JavaScript modules in workers
• window.print() 😄
Длинно: https://habr.com/ru/articles/979276/
❤🔥5👍2👏1
Forwarded from CSS Боль
Рамки в форме вырезов — без SVG, картинок и костылей
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Кажется, CSS-маски умеют всё… пока дизайнер не говорит: «А можно, чтобы рамка повторяла форму выреза?»
В новом выпуске «CSS Боль» рассказываем, почему привычные
🐭 Смотреть на YouTube
🐹 Смотреть в VK
Кажется, CSS-маски умеют всё… пока дизайнер не говорит: «А можно, чтобы рамка повторяла форму выреза?»
В новом выпуске «CSS Боль» рассказываем, почему привычные
border и box-shadow внезапно перестают работать, и как современный CSS позволяет решить задачу аккуратно, надёжно и с отличной поддержкой.Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4
Forwarded from CSS Боль
Когда дизайнер присылает макет с «инвертированным углом», начинаются страдания. Псевдоэлементы, абсолютное позиционирование, подгонка радиусов — и всё это разваливается, как только под карточкой появляется градиент или картинка.
Александр Першин написал nebo.css — опенсорсную библиотеку для впуклых углов. Название расшифровывается как negative border radius. По духу это как normalize.css: подключаете один CSS-файл, добавляете класс
Разбираем, как это устроено: https://habr.com/ru/articles/987944/
GitHub: https://github.com/htmlacademy/nebo.css
Александр Першин написал nebo.css — опенсорсную библиотеку для впуклых углов. Название расшифровывается как negative border radius. По духу это как normalize.css: подключаете один CSS-файл, добавляете класс
nebo — и угол готов. Работает на любых фонах, настраивается через CSS-переменные.Разбираем, как это устроено: https://habr.com/ru/articles/987944/
GitHub: https://github.com/htmlacademy/nebo.css
🔥18
Forwarded from PiterJS (Дим)
✨ Дождались! PiterJS #86 уже вот-вот!
Тематика этой встречи — интерфейсы. Так что интересно будет не только фронтендерам, но и дизайнерам.
⏰ Когда: 29 января 19:00
📍 Где: Selectel (Цветочная 19)
📰 Программа
🗣
🎤 Что может фронтендер рассказать дизайнеру
🗣
🎤 Атомарные состояния в UI/UX
🗣
🎤 Вырезы в блоках. Революция
🎫 Регистрация: https://piterjs.org/#meetup=16t4un_a87dnm
Тематика этой встречи — интерфейсы. Так что интересно будет не только фронтендерам, но и дизайнерам.
⏰ Когда: 29 января 19:00
📍 Где: Selectel (Цветочная 19)
📰 Программа
🗣
19:10 Игорь Алексеенко🎤 Что может фронтендер рассказать дизайнеру
🗣
20:10 Дмитрий Земляченко🎤 Атомарные состояния в UI/UX
🗣
22:00 Александр Першин🎤 Вырезы в блоках. Революция
🎫 Регистрация: https://piterjs.org/#meetup=16t4un_a87dnm
👍5❤2🔥1
🦊 Привет, это Фронти!
Встречайте дайджест #31.
Invoker: диалоги без JS, анимации с акселерометра, CSS Grid Lanes и @starting-style, фреймворки 2026 от Карниато, RSC и Next.js: патчи DoS, Node 25.5 и одиночный exe (SEA), AGENTS.md против скиллов, Bun быстрее, Yarn на Rust, ReliCSS для старого CSS. Что интересного на этой неделе?
🧪 HTML и Платформа
- Invoker Commands: открывать и закрывать диалоги и попапы без JavaScript.
- Анимации с акселерометра смартфона прямо в браузере — лучше смотреть на телефоне.
- Влияние производительности на UX и прогнозы по веб-доступности.
- Фокус в
🎨 CSS и дизайн
- CSS Grid Lanes: когда появятся и как пользоваться уже сейчас.
- Основы вёрстки: поток, box model и позиционирование.
- Отладка
- Что нового в CSS в 2026, favicons в 2026, стекинг-контексты.
📦 JavaScript
- Обзор JavaScript-фреймворков на 2026 год от Райана Карниато (SolidJS).
⚛️ React и фреймворки
- DoS в React Server Components: патчи в 19.2.4, 19.1.5, 19.0.4 — обновляйтесь.
- RSC для максимальной производительности: доклад с ReactNext ’25.
- Как писать хорошие unit-тесты для React.
- DoS в self-hosted Next.js: фиксы в 15.5.10, 16.1.5 и canary.
⚙️ Node.js
- Node 25.5.0: сборка одиночного exe флагом
- Бенчмарки Node 16→25, проверка уязвимостей, OpenSSL CVE, Redis-клиенты.
- Bun быстрее (async/await +35%), Yarn 6 на Rust в превью.
🧠 Ещё интересное
- AGENTS.md обходит «навыки» в эвалах — выводы Vercel.
- 100k строк TypeScript на Rust с помощью Claude Code.
🌐 Браузеры и инструменты
- Chrome Canary: метатег
- ReliCSS ищет устаревший CSS, Color Palette Pro, Typewriter Web Component, Nxtlify для Nuxt UI.
- Lodash 4.17.23 с фиксом CVE.
🦊 Лисья шутка недели:
Если диалоги можно открывать без JS,
то почему у меня до сих пор три обработчика на одну кнопку?
Полный выпуск уже на месте 👉 https://frontend-weekly.ru/weekly-digest-31/
Встречайте дайджест #31.
Invoker: диалоги без JS, анимации с акселерометра, CSS Grid Lanes и @starting-style, фреймворки 2026 от Карниато, RSC и Next.js: патчи DoS, Node 25.5 и одиночный exe (SEA), AGENTS.md против скиллов, Bun быстрее, Yarn на Rust, ReliCSS для старого CSS. Что интересного на этой неделе?
🧪 HTML и Платформа
- Invoker Commands: открывать и закрывать диалоги и попапы без JavaScript.
- Анимации с акселерометра смартфона прямо в браузере — лучше смотреть на телефоне.
- Влияние производительности на UX и прогнозы по веб-доступности.
- Фокус в
<dialog>: ловить его вручную больше не нужно.🎨 CSS и дизайн
- CSS Grid Lanes: когда появятся и как пользоваться уже сейчас.
- Основы вёрстки: поток, box model и позиционирование.
- Отладка
@starting-style в Chrome DevTools. - Что нового в CSS в 2026, favicons в 2026, стекинг-контексты.
📦 JavaScript
- Обзор JavaScript-фреймворков на 2026 год от Райана Карниато (SolidJS).
⚛️ React и фреймворки
- DoS в React Server Components: патчи в 19.2.4, 19.1.5, 19.0.4 — обновляйтесь.
- RSC для максимальной производительности: доклад с ReactNext ’25.
- Как писать хорошие unit-тесты для React.
- DoS в self-hosted Next.js: фиксы в 15.5.10, 16.1.5 и canary.
⚙️ Node.js
- Node 25.5.0: сборка одиночного exe флагом
--build-sea, node:sqlite, fs.watch с ignore. - Бенчмарки Node 16→25, проверка уязвимостей, OpenSSL CVE, Redis-клиенты.
- Bun быстрее (async/await +35%), Yarn 6 на Rust в превью.
🧠 Ещё интересное
- AGENTS.md обходит «навыки» в эвалах — выводы Vercel.
- 100k строк TypeScript на Rust с помощью Claude Code.
🌐 Браузеры и инструменты
- Chrome Canary: метатег
text-scale для доступности. - ReliCSS ищет устаревший CSS, Color Palette Pro, Typewriter Web Component, Nxtlify для Nuxt UI.
- Lodash 4.17.23 с фиксом CVE.
🦊 Лисья шутка недели:
Если диалоги можно открывать без JS,
то почему у меня до сих пор три обработчика на одну кнопку?
Полный выпуск уже на месте 👉 https://frontend-weekly.ru/weekly-digest-31/
26👍8❤🔥2🔥1
Baseline: Январь 2026
Коротко:
• animation-composition
• Array by copy
• Two-value display property
Длинно: https://habr.com/ru/articles/987464/
Коротко:
• animation-composition
• Array by copy
• Two-value display property
Длинно: https://habr.com/ru/articles/987464/
❤🔥8
🦊 Привет, это Фронти!
Встречайте дайджест #32.
HTML учит геолокацию, Anchor Positioning вяжет связи в CSS, AI дебажит React (но сеньор пока нужен), эмодзи уронил дашборд — боль, Node 25.6 с SIMD и новым URL, Babel 7 финал и ESLint 10 на старте, OpenClaw — TS-агент захватил GitHub, State of JS: Hono — фаворит, Gatsby жив и дружит с React 19. Что ещё интересного на этой неделе?
🧪 HTML и Платформа
- Новый элемент
- Combobox vs. Multiselect vs. Listbox: как не промахнуться с выбором.
- JPEG XL: нужен ли нам ещё один формат изображений?
- Один контент — множество «версий»: полезно для мышления про доступность.
🎨 CSS и дизайн
- CSS Anchor Positioning: рисуем «связи» между элементами без JS.
- «Слишком ранний брейкпоинт»: почему мы рано схлопываемся в одну колонку.
- Shrinkwrap-решение: ширина под переносимый текст в чистом CSS.
- Оптимизированные встраивания видео без JavaScript, Nice Select.
📦 JavaScript
- Явное управление ресурсами:
- Тротлинг отдельного сетевого запроса в Chrome DevTools.
⚛️ React и фреймворки
- AI дебажит React: краш-тест от Nadia Makarevich — AI помогает, но не заменяет.
- Эмодзи уронил дашборд: ускорение в 100× одной строкой.
- React
- Inngest переехали с Next.js на TanStack Start — разбор и грабли.
- Gatsby v5.16 с поддержкой React 19 — жив!
- Классы мешают мемоизации React Compiler — данные вперёд, методы назад.
⚙️ Node.js
- Node 25.6.0: TextEncoder ускорили через SIMD, URL обновили до Unicode 17, можно отключать трекинг Promise в async_hooks.
- State of JS 2025: Express — самый популярный, Hono — самый любимый.
- Chalk → встроенный
- Bun v1.3.8: нативный парсинг Markdown.
🧠 Ещё интересное
- OpenClaw: open-source TS-агент, который за неделю взорвал GitHub.
- История TypeScript от Андерса Хейлсберга: как появился TS и зачем компилятор на Go.
- Angular меняет дефолт change detection, Astro 5.17, Svelte-дайджест.
🌐 Браузеры и инструменты
- Babel 7 — финальный релиз, Babel 8 RC уже готовится.
- ESLint 10.0.0 RC2 — можно трогать и готовить плагины.
- Lodash 4.17.23: security reset для вечной утилиты.
- jQuery UI 1.14.2 — теперь с jQuery 4.0.
- Rspress 2.0, Croner 10, focus-trap 8.0, jsdom 28.0.
🦊 Лисья шутка недели:
HTML теперь знает, где ты находишься,
CSS знает, к чему ты привязан,
а один эмодзи знает, как положить весь дашборд.
Фронтенд в 2026 — это детектив, а не разработка.
Полный выпуск уже на месте 👉 https://frontend-weekly.ru/weekly-digest-32/
Встречайте дайджест #32.
HTML учит геолокацию, Anchor Positioning вяжет связи в CSS, AI дебажит React (но сеньор пока нужен), эмодзи уронил дашборд — боль, Node 25.6 с SIMD и новым URL, Babel 7 финал и ESLint 10 на старте, OpenClaw — TS-агент захватил GitHub, State of JS: Hono — фаворит, Gatsby жив и дружит с React 19. Что ещё интересного на этой неделе?
🧪 HTML и Платформа
- Новый элемент
<geolocation> — геолокация прямо из HTML.- Combobox vs. Multiselect vs. Listbox: как не промахнуться с выбором.
- JPEG XL: нужен ли нам ещё один формат изображений?
- Один контент — множество «версий»: полезно для мышления про доступность.
🎨 CSS и дизайн
- CSS Anchor Positioning: рисуем «связи» между элементами без JS.
- «Слишком ранний брейкпоинт»: почему мы рано схлопываемся в одну колонку.
- Shrinkwrap-решение: ширина под переносимый текст в чистом CSS.
- Оптимизированные встраивания видео без JavaScript, Nice Select.
📦 JavaScript
- Явное управление ресурсами:
using и Symbol.dispose — декларативный cleanup.- Тротлинг отдельного сетевого запроса в Chrome DevTools.
⚛️ React и фреймворки
- AI дебажит React: краш-тест от Nadia Makarevich — AI помогает, но не заменяет.
- Эмодзи уронил дашборд: ускорение в 100× одной строкой.
- React
<ViewTransition> — новый компонентный API для анимаций переходов.- Inngest переехали с Next.js на TanStack Start — разбор и грабли.
- Gatsby v5.16 с поддержкой React 19 — жив!
- Классы мешают мемоизации React Compiler — данные вперёд, методы назад.
⚙️ Node.js
- Node 25.6.0: TextEncoder ускорили через SIMD, URL обновили до Unicode 17, можно отключать трекинг Promise в async_hooks.
- State of JS 2025: Express — самый популярный, Hono — самый любимый.
- Chalk → встроенный
styleText: миграция без зависимостей.- Bun v1.3.8: нативный парсинг Markdown.
🧠 Ещё интересное
- OpenClaw: open-source TS-агент, который за неделю взорвал GitHub.
- История TypeScript от Андерса Хейлсберга: как появился TS и зачем компилятор на Go.
- Angular меняет дефолт change detection, Astro 5.17, Svelte-дайджест.
🌐 Браузеры и инструменты
- Babel 7 — финальный релиз, Babel 8 RC уже готовится.
- ESLint 10.0.0 RC2 — можно трогать и готовить плагины.
- Lodash 4.17.23: security reset для вечной утилиты.
- jQuery UI 1.14.2 — теперь с jQuery 4.0.
- Rspress 2.0, Croner 10, focus-trap 8.0, jsdom 28.0.
🦊 Лисья шутка недели:
HTML теперь знает, где ты находишься,
CSS знает, к чему ты привязан,
а один эмодзи знает, как положить весь дашборд.
Фронтенд в 2026 — это детектив, а не разработка.
Полный выпуск уже на месте 👉 https://frontend-weekly.ru/weekly-digest-32/
26❤5❤🔥3🔥2
Forwarded from CSS Боль
clip-path и CSS-маски не меняют форму блока — они её имитируют. Рамка, тень, outline не знают о вырезах и работают как с обычным прямоугольником.
Свойство border-shape работает по-другому. Как border-radius научил рамки скругляться, так border-shape + функция shape() учат их принимать произвольную форму. Рамки повторяют контур, box-shadow и outline тоже.
В спецификации CSS Borders Level 4 уже есть черновик, а в Chrome Canary — первые работающие прототипы. Пока ждём поддержку в браузерах, самое время разобраться с функцией shape().
В новом выпуске «CSS Боли» — как мы дошли от border-radius до произвольных форм и почему маски оказались тупиком для рамок и теней.
🐭 Смотреть на YouTube
🐹 Смотреть в VK
Свойство border-shape работает по-другому. Как border-radius научил рамки скругляться, так border-shape + функция shape() учат их принимать произвольную форму. Рамки повторяют контур, box-shadow и outline тоже.
В спецификации CSS Borders Level 4 уже есть черновик, а в Chrome Canary — первые работающие прототипы. Пока ждём поддержку в браузерах, самое время разобраться с функцией shape().
В новом выпуске «CSS Боли» — как мы дошли от border-radius до произвольных форм и почему маски оказались тупиком для рамок и теней.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥3
mlut (читается как "млат") - это CSS-фреймворк для кастомных сайтов и креативов. Он помогает верстать проекты с индивидуальным и нешаблонным дизайном, где не подходят фреймворки старой школы и плохо справляются LLM. mlut похож на Tailwind, поскольку основан на подходе Atomic CSS, но по некоторым параметрам превосходит все популярные аналоги.
Atomic CSS - это методология верстки, в которой мы используем маленькие атомарные классы, каждый из которых делает одно действие. Эти классы называют *утилитами*. Обычно они применяет одно CSS-свойство (например, цвет текста), но не обязательно одно. Выглядят они примерно так:
Преимущества такого подхода
1. Тратим меньше мыслетоплива: не думаем о нейминге сущностей, структуре каталогов
2. Меньше CSS на клиенте: реиспользуем одни и те же утилиты, а новые стили почти перестают добавляться
3. Быстрее пишем стили: короткие классы, нет переключения файлов
4. Можно применять на любом стеке: JS SPA, PHP, Clojure, etc
Ключевые особенности mlut
1. Краткий и строгий нейминг. Сокращения основаны на популярности свойств CSS и составлены по единому алгоритму. Если вы знаете CSS, то вы почти знаете mlut
2. Богатый и нативный синтаксис. Это как Vim для CSS. Удобно создавать сложные стили с помощью мощного синтаксиса, концептуально близкого к CSS
3. Написан на Sass. Используйте всю мощь препроцессора для связи рукописного CSS и утилит
Что реализовано на сегодня
- генератор утилит почти любой сложности
- JIT-движок, который умеет генерировать утилиты из HTML/JSX/etc
- CLI с минификацией и автопрефиксером
- плагины для сборщиков фронтенда: Webpack, Vite и Rollup
- онлайн-песочница
Также есть обширная документация. Совместно с HTML Academy готовится интерактивный мини-курс по инструменту. Первый урок уже вышел. Это open source проект - результат глубокого ресерча и 1200+ часов труда. Больше технических деталей есть в расшифровке доклада с HolyJS.
Планы по развитию
- добавить еще возможностей CSS для сложной верстки: множественные градиенты, псевдоселекторы с аргументами, типа
- сделать интеграции для вайб-кодинга
- сделать плагины к IDE для автокомплита и подсказок
А недавно мы запустили проект на ProductRadar. Бодаемся там со стартапами за топ-3 продуктов этой недели. Будем благодарны за поддержку лайком на этой площадке и любой фидбек. Давайте покажем всем, что open source инструмент тоже может быть продуктом!
Atomic CSS - это методология верстки, в которой мы используем маленькие атомарные классы, каждый из которых делает одно действие. Эти классы называют *утилитами*. Обычно они применяет одно CSS-свойство (например, цвет текста), но не обязательно одно. Выглядят они примерно так:
D-ib, Bgc-blue_h.Преимущества такого подхода
1. Тратим меньше мыслетоплива: не думаем о нейминге сущностей, структуре каталогов
2. Меньше CSS на клиенте: реиспользуем одни и те же утилиты, а новые стили почти перестают добавляться
3. Быстрее пишем стили: короткие классы, нет переключения файлов
4. Можно применять на любом стеке: JS SPA, PHP, Clojure, etc
Ключевые особенности mlut
1. Краткий и строгий нейминг. Сокращения основаны на популярности свойств CSS и составлены по единому алгоритму. Если вы знаете CSS, то вы почти знаете mlut
2. Богатый и нативный синтаксис. Это как Vim для CSS. Удобно создавать сложные стили с помощью мощного синтаксиса, концептуально близкого к CSS
3. Написан на Sass. Используйте всю мощь препроцессора для связи рукописного CSS и утилит
Что реализовано на сегодня
- генератор утилит почти любой сложности
- JIT-движок, который умеет генерировать утилиты из HTML/JSX/etc
- CLI с минификацией и автопрефиксером
- плагины для сборщиков фронтенда: Webpack, Vite и Rollup
- онлайн-песочница
Также есть обширная документация. Совместно с HTML Academy готовится интерактивный мини-курс по инструменту. Первый урок уже вышел. Это open source проект - результат глубокого ресерча и 1200+ часов труда. Больше технических деталей есть в расшифровке доклада с HolyJS.
Планы по развитию
- добавить еще возможностей CSS для сложной верстки: множественные градиенты, псевдоселекторы с аргументами, типа
:has(), etc- сделать интеграции для вайб-кодинга
- сделать плагины к IDE для автокомплита и подсказок
А недавно мы запустили проект на ProductRadar. Бодаемся там со стартапами за топ-3 продуктов этой недели. Будем благодарны за поддержку лайком на этой площадке и любой фидбек. Давайте покажем всем, что open source инструмент тоже может быть продуктом!
👍4👎1🤡1💊1
Forwarded from CSS Боль
DUMP SPB 2026 × HTML Academy
Весь внешний вид компонента — в CSS-переменных. JavaScript только переключает состояния. Звучит непривычно, но это рабочий подход.
На DUMP SPB 13 февраля Александр Першин выступит с докладом «Реактивный CSS» — про перенос логики отображения из JavaScript в стили. В докладе — сравнение двух реализаций одного компонента: классической на JS и реактивной на CSS. Можно будет оценить разницу в объёме и сложности кода.
Промокод PERSHIN — скидка 10% на билет.
Конференция · О докладе
Весь внешний вид компонента — в CSS-переменных. JavaScript только переключает состояния. Звучит непривычно, но это рабочий подход.
На DUMP SPB 13 февраля Александр Першин выступит с докладом «Реактивный CSS» — про перенос логики отображения из JavaScript в стили. В докладе — сравнение двух реализаций одного компонента: классической на JS и реактивной на CSS. Можно будет оценить разницу в объёме и сложности кода.
Конференция · О докладе
👍3❤1
DUMP
Завтра на весь день иду на DUMP. Программа очень обширная. Ещё даже не решил, что конкретно хочу послушать.
Мало ли кто там окажется подходите знакомиться.
Завтра на весь день иду на DUMP. Программа очень обширная. Ещё даже не решил, что конкретно хочу послушать.
Мало ли кто там окажется подходите знакомиться.
❤4👍4💔1
Interop 2026
В 2026 у фронтенда уменьшается «браузерная магия» и становится больше инженерной платформой.
Короткий список того, что попало в Interop 2026
1. Anchor Positioning
2. Advanced `attr()`
3. Container Style Queries
4. contrast-color()
5. Custom Highlights
6. Dialog and popover additions
7. Fetch Uploads and Ranges
8. getAllRecords() for IndexedDB
9. JSPI for Wasm (JavaScript Promise Integration API)
10. Media pseudo-classes
11. Navigation API
12. Scoped Custom Element Registries
13. Scroll-driven Animations
14. Scroll Snap
15. shape()
16. View Transitions
17. Web Compat
18. WebRTC
19. WebTransport
20. CSS Zoom
Для тех кто пропустил и не знает, что такое Interop. Это когда Apple, Google, Microsoft, Mozilla и Igalia договариваются, чтобы в вебе было меньше полифиллов, меньше костылей, меньше “а в Safari работает?”, больше нативных API вместо JS-библиотек, больше предсказуемости.
Что чувствуется: CSS многое забирает у JS, влияние SPA уменьшается, веб ускоряется(http/3, стримы, wasm).
https://wpt.fyi/interop-2026
В 2026 у фронтенда уменьшается «браузерная магия» и становится больше инженерной платформой.
Короткий список того, что попало в Interop 2026
1. Anchor Positioning
2. Advanced `attr()`
3. Container Style Queries
4. contrast-color()
5. Custom Highlights
6. Dialog and popover additions
7. Fetch Uploads and Ranges
8. getAllRecords() for IndexedDB
9. JSPI for Wasm (JavaScript Promise Integration API)
10. Media pseudo-classes
11. Navigation API
12. Scoped Custom Element Registries
13. Scroll-driven Animations
14. Scroll Snap
15. shape()
16. View Transitions
17. Web Compat
18. WebRTC
19. WebTransport
20. CSS Zoom
Для тех кто пропустил и не знает, что такое Interop. Это когда Apple, Google, Microsoft, Mozilla и Igalia договариваются, чтобы в вебе было меньше полифиллов, меньше костылей, меньше “а в Safari работает?”, больше нативных API вместо JS-библиотек, больше предсказуемости.
Что чувствуется: CSS многое забирает у JS, влияние SPA уменьшается, веб ускоряется(http/3, стримы, wasm).
https://wpt.fyi/interop-2026
🔥8
🦊 Привет, это Фронти! Всех с прошедшим днём влюблённых!
Вы любите фронтенд как люблю его я?
Я подготовил дайджест #33 для влюблённых =)
Interop 2025 — браузеры наконец-то подружились, 💔 уронил Safari в 100 раз, TypeScript 6.0 beta включает strict по дефолту, ESLint 10 похоронил eslintrc, State of JS: 12к девов ответили, State of React 2025 — итоги года, React Native 0.84 с Hermes V1, webpack строит планы на 2026, CSS Selection — рентген 100к сайтов. Что ещё интересного на этой неделе?
♿ Доступность
- WCAG 3.0: что изменится в новом поколении стандартов (кандидат не раньше 2027).
- Клавиатурные шорткаты в веб-приложении: как не сломать навигацию.
- Новый meta-тег, чтобы уважать масштабирование текста на мобильных.
🧪 HTML и Платформа
- Interop 2025: итоги — Anchor Positioning, View Transitions, Navigation API теперь работают одинаково.
- Как 💔 сделал страницу в Safari в 100× медленнее — детективная история перф-бага.
- Как работают браузеры? Высокоуровневое объяснение «что внутри».
- Полифил для HTML Switch Element и Invoker Buttons Polyfill.
- Мультипоточный рендеринг в вебе: иллюстрированный гид.
🎨 CSS и дизайн
- CSS Selection 2026: как CSS живёт на 100 000+ сайтах — размеры, популярность фич, крайние кейсы.
- Как (и почему) запретить выделение текста: разбор user-select.
📦 JavaScript
- State of JS 2025: боли языка, фреймворки, сборщики, сколько кода пишут с ИИ.
- ESLint v10.0.0: eslintrc окончательно убран, новый алгоритм поиска конфигов.
- Symbol.dispose и using — декларативный cleanup ресурсов.
- Webpack roadmap 2026: универсальная сборка, TS без лоадеров, CSS Modules без плагинов.
🔷 TypeScript
- TypeScript 6.0 beta: strict по умолчанию, types стал [], типы для Temporal, subpath-импорты с #/.
⚛️ React и фреймворки
- State of React 2025: 4000 разработчиков про UI-библиотеки, визуализацию, боли core-API.
- «Пуленепробиваемые» React-компоненты: 10 приёмов для порталов, гидрации, SSR.
- Виртуальный скролл на миллиарды строк — как не уронить DOM.
- AI дебажит React: Nadia Makarevich подложила тонкие баги — AI помогает, но не заменяет.
- Gusto отказались от React.FC — разбор типизации и children.
- Inngest мигрировал с Next.js на TanStack Start — грабли и компромиссы.
- React Native 0.84: Hermes V1 по умолчанию — быстрее, экономнее по памяти.
⚙️ Node.js
- npmx: быстрый и красивый браузер npm-пакетов с функцией сравнения.
- Node.js 25.6.1: новый CJS-лексер merve на 25% быстрее.
- Node.js 24.13.1 LTS: URL с Unicode 17, стабильный crypto.hash.
- Matteo Collina пилит виртуальную файловую систему для Node.
🤖 ИИ
- Transformers.js v4 Preview: ML-модели прямо в браузере на WebGPU.
🛠 Инструменты
- Bun v1.3.9: параллельный запуск npm-скриптов, SIMD для регулярок.
- Shaka Player 5.0, Polypane v28, Ink 6.7, Prisma 7.4.0, Wasp 0.21.0, Ant Design 6.3.
🦊 Лисья шутка недели:
TypeScript 6.0 включил strict — и половина проектов узнала, что у них есть баги.
Эмодзи 💔 положил Safari — романтика убивает продакшен.
ESLint 10 удалил eslintrc — а кто-то только научился его настраивать.
А webpack опубликовал roadmap на 2026 — видимо, чтобы мы точно знали, что он ещё жив.
Полный выпуск уже на месте 👉 https://frontend-weekly.ru/weekly-digest-33/
Вы любите фронтенд как люблю его я?
Я подготовил дайджест #33 для влюблённых =)
Interop 2025 — браузеры наконец-то подружились, 💔 уронил Safari в 100 раз, TypeScript 6.0 beta включает strict по дефолту, ESLint 10 похоронил eslintrc, State of JS: 12к девов ответили, State of React 2025 — итоги года, React Native 0.84 с Hermes V1, webpack строит планы на 2026, CSS Selection — рентген 100к сайтов. Что ещё интересного на этой неделе?
♿ Доступность
- WCAG 3.0: что изменится в новом поколении стандартов (кандидат не раньше 2027).
- Клавиатурные шорткаты в веб-приложении: как не сломать навигацию.
- Новый meta-тег, чтобы уважать масштабирование текста на мобильных.
🧪 HTML и Платформа
- Interop 2025: итоги — Anchor Positioning, View Transitions, Navigation API теперь работают одинаково.
- Как 💔 сделал страницу в Safari в 100× медленнее — детективная история перф-бага.
- Как работают браузеры? Высокоуровневое объяснение «что внутри».
- Полифил для HTML Switch Element и Invoker Buttons Polyfill.
- Мультипоточный рендеринг в вебе: иллюстрированный гид.
🎨 CSS и дизайн
- CSS Selection 2026: как CSS живёт на 100 000+ сайтах — размеры, популярность фич, крайние кейсы.
- Как (и почему) запретить выделение текста: разбор user-select.
📦 JavaScript
- State of JS 2025: боли языка, фреймворки, сборщики, сколько кода пишут с ИИ.
- ESLint v10.0.0: eslintrc окончательно убран, новый алгоритм поиска конфигов.
- Symbol.dispose и using — декларативный cleanup ресурсов.
- Webpack roadmap 2026: универсальная сборка, TS без лоадеров, CSS Modules без плагинов.
🔷 TypeScript
- TypeScript 6.0 beta: strict по умолчанию, types стал [], типы для Temporal, subpath-импорты с #/.
⚛️ React и фреймворки
- State of React 2025: 4000 разработчиков про UI-библиотеки, визуализацию, боли core-API.
- «Пуленепробиваемые» React-компоненты: 10 приёмов для порталов, гидрации, SSR.
- Виртуальный скролл на миллиарды строк — как не уронить DOM.
- AI дебажит React: Nadia Makarevich подложила тонкие баги — AI помогает, но не заменяет.
- Gusto отказались от React.FC — разбор типизации и children.
- Inngest мигрировал с Next.js на TanStack Start — грабли и компромиссы.
- React Native 0.84: Hermes V1 по умолчанию — быстрее, экономнее по памяти.
⚙️ Node.js
- npmx: быстрый и красивый браузер npm-пакетов с функцией сравнения.
- Node.js 25.6.1: новый CJS-лексер merve на 25% быстрее.
- Node.js 24.13.1 LTS: URL с Unicode 17, стабильный crypto.hash.
- Matteo Collina пилит виртуальную файловую систему для Node.
🤖 ИИ
- Transformers.js v4 Preview: ML-модели прямо в браузере на WebGPU.
🛠 Инструменты
- Bun v1.3.9: параллельный запуск npm-скриптов, SIMD для регулярок.
- Shaka Player 5.0, Polypane v28, Ink 6.7, Prisma 7.4.0, Wasp 0.21.0, Ant Design 6.3.
🦊 Лисья шутка недели:
TypeScript 6.0 включил strict — и половина проектов узнала, что у них есть баги.
Эмодзи 💔 положил Safari — романтика убивает продакшен.
ESLint 10 удалил eslintrc — а кто-то только научился его настраивать.
А webpack опубликовал roadmap на 2026 — видимо, чтобы мы точно знали, что он ещё жив.
Полный выпуск уже на месте 👉 https://frontend-weekly.ru/weekly-digest-33/
26❤4👍1🔥1
Chrome 145
В 145 хром завезли возможность замедлить конкретный запрос, а не все сразу
Посмотрите гифку в статье https://developer.chrome.com/blog/throttle-individual-network-requests?hl=ru
В 145 хром завезли возможность замедлить конкретный запрос, а не все сразу
Посмотрите гифку в статье https://developer.chrome.com/blog/throttle-individual-network-requests?hl=ru
🔥3❤2