Выпуск №511. Алексей Симоненко и Никита Дубко про юбилей, когда уже можно grid lanes, сколько весит веб по Альманаху и зачем jQuery 4.0.

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

00:01:48 Напишите нам на юбилей
00:04:20 Когда уже можно grid lanes
00:37:43 Сколько весит веб по Альманаху
01:26:27 Зачем jQuery 4.0

Хватит превращать всё в массивы. Мэтт Смит показывает, как iterator helpers в JavaScript дают ленивые цепочки map, filter и take без промежуточных массивов и прекращают работу, когда UI получил нужные элементы. Это удобно для больших списков, потоков и пагинации, поддержка есть в современных браузерах и Node 22+. #js #performance

https://allthingssmitty.com/2026/01/12/stop-turning-everything-into-arrays-and-do-less-work-instead/

Субъективный CSS-ресет для современных браузеров. Деклан Чидлоу предлагает не просто ещё один ресет, а подробный разбор правил: зачем он добавляет анонимный @layer, выбирает border-box, убирает дефолтные отступы, отключает text-size-adjust, и нормализует медиа, формы, таблицы, типографику, disabled-состояния и обводку :focus-visible. #css #reset

https://vale.rocks/posts/css-reset

Попробуйте масштабирование текста в Chrome Canary. Джош Тумат объясняет, что на десктопе уже есть настройка базового размера текста, но мобильные браузеры обычно игнорируют системный размер шрифта. Элемент <meta name="text-scale"> позволяет готовым сайтам следовать настройкам пользователя на мобильных ОС. Уже под флагом Experimental Web Platform features в Canary. #chrome #a11y

https://www.joshtumath.uk/posts/2026-01-27-try-text-scaling-support-in-chrome-canary/

Пять тестов доступности для каждого компонента. Хидде де Врис предлагает необходимые проверки для компонентов дизайн-системы: клавиатура, доступные токены цвета и отступов, понятные имена элементов управления, устойчивость при 400% масштабе и пользовательских настройках, а также роли, состояния и свойства для скринридеров. #a11y #testing

https://zeroheight.com/blog/5-accessibility-checks-to-run-on-every-component/

1 февраля нам 10 лет 🥳 Заходите на юбилейный лайв накануне в субботу 31 января в 12:00 (UTC+3), чтобы посмотреть как мы это делаем. Будут новости, поздравления и всякие истории. В этот раз лайв открыт для всех!

https://youtube.com/live/-PVAU6wdx9k

Выпуск №512. Вадим Макеев, Полина Гуртовая, Алексей Симоненко, Никита Дубко про 10 лет подкасту, тротлинг запросов в DevTools, масштабирование текста, автозаполнение форм, Rolldown RC и пиксель-пёрфект.

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

00:02:02 10 лет
00:09:51 Тротлинг запросов в DevTools
00:16:16 10 лет
00:19:41 Масштабирование текста
00:40:50 10 лет
00:49:22 Автозаполнение форм
01:05:08 10 лет
01:13:02 Rolldown RC
01:28:13 10 лет
01:33:35 Спорный пиксель-пёрфект
02:08:40 10 лет

Как динамически устанавливать кастомные элементы. Хейдон Пикеринг предлагает соглашение об именах, хелперы define() и скрипт install(), который ищет :not(:defined), убирает дубликаты и импортирует только реально используемые элементы. Для зависимых компонентов есть событие ready, а для добавлений после загрузки подходит MutationObserver. #js #webcomponents

https://heydonworks.com/article/dynamically-loading-custom-elements/

Результаты опроса State of JavaScript 2025. TypeScript фактически победил как язык, отстреливание типов позволяет запускать его нативно в стабильных версиях Node.js, а Vite по загрузкам обогнал Webpack. При этом AI все сильнее влияет на разработку, к концу 2025 года чуть меньше 30% кода было сгенерировано AI, и быстро растут Cursor, Zed, Claude, Gemini и Copilot. #stateof #js

https://2025.stateofjs.com/

Выражения scroll-state от контейнера в CSS теперь определяют прокрутку. Брехт де Рёйте рассказывает о новом состоянии scrolled для @container в Chrome 144 и о stuck, snapped и scrollable из Chrome 133, чтобы делать прячущиеся шапки, подсказки и стрелки прокрутки на чистом CSS. #css #scroll

https://utilitybend.com/blog/is-it-scrolled-is-it-not-lets-find-out-with-css-container-scroll-state-queries/

CSS grid lanes уже ближе, чем кажется. Джен Симмонс пишет, что финальный синтаксис доступен в Safari Technology Preview, а Chrome и Firefox быстро догоняют. А пока можно использовать прогрессивное улучшение через @supports, JS-полифил или фолбек на CSS-гридах. #css #safari

https://webkit.org/blog/17758/when-will-css-grid-lanes-arrive-how-long-until-we-can-use-it/

Явное управление ресурсами в JavaScript. Мэтт Смит объясняет using и await using, а также Symbol.dispose и Symbol.asyncDispose, чтобы очистка всегда выполнялась при выходе из области видимости и в обратном порядке для нескольких ресурсов. Для большей гибкости есть DisposableStack и AsyncDisposableStack. #js #ecmascript

https://allthingssmitty.com/2026/02/02/explicit-resource-management-in-javascript/

Выпуск №513. Вадим Макеев, Алексей Симоненко про ESLint 10, нативный HTML-патчинг, результаты State of JS 2025, CSS @scope и Temporal в Safari.

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

00:01:23 ESLint 10
00:09:19 Нативный HTML-патчинг
00:31:53 Результаты State of JS 2025
01:11:32 CSS @scope вместо BEM
01:29:24 Temporal в Safari

Полифил для HTML-элемента switch. Томас Штайнер предлагает полифил, который даёт почти нативный <input type="checkbox" switch> в браузерах помимо Safari: с доступностью, поддержкой высокой контрастности и загрузкой без FOUC-прыжков. #html #polyfill

https://blog.tomayac.com/2026/01/12/a-polyfill-for-the-html-switch-element/

Reference Target: и волки сыты, и инкапсуляция цела. Элис Боксхолл представляет новое предложение, которое позволяет элементам в shadow DOM становиться целями, когда ссылаются на хоста, при этом сохраняя инкапсуляцию. В спецификациях есть пул-реквесты, а в браузерах реализации: в Chromium самая полная за флагом, а в WebKit и Firefox ранние прототипы. #webcomponents #a11y

https://blogs.igalia.com/alice/reference-target-having-your-encapsulation-and-eating-it-too/

Отладка с AI: может ли он заменить опытного разработчика? Надя Макаревич показывает, что LLM быстро чинит симптомы, но плохо справляется с поиском первопричин. На трёх багах React и Next.js она сравнивает правки LLM с ручной проверкой: сбой Zod-валидации, двойные лоадеры и редирект с server action, который вызывает ошибку «rendered more hooks». #ai #react

https://www.developerway.com/posts/debugging-with-ai

Новинки WebKit в Safari 26.3. Поддержка Zstandard для быстрой и эффективной компрессии текстовых ресурсов на лету, а также AbortSignal в Navigation API, чтобы fetch-запросы SPA и другие задачи корректно отменялись при прерванной навигации. Релиз также улучшает anchor positioning, мультиколонки, медиа, HDR-рендеринг и работу Safe Browsing. #safari #browser

https://webkit.org/blog/17798/webkit-features-for-safari-26-3/