#Пульс_веб_платформы 27.06.2025

🖇️ Полностью в вебе

Новости
🔡 вышел Chrome 138:
🔵появились функции sibling-index() и sibling-count(), которые возвращают индекс элемента среди собратьев и общее число детей
🔵значение stretch (префиксная версия `-webkit-fill-available`)
🔵математические функции abs(), sign(), progress()
🔵группа встроенных AI-API: Translator API, Language Detector API, Summarizer API
🔵эскейп символов < и > в значениях атрибутов DOM-нод

🔡 выпущен Firefox 140:
🔵в браузере появились вертикальные табы на боковой панели (также можно вручную выгружать табы из памяти)
🔵поддержан CookieStore API и Custom Highlight API, теперь есть во всех браузерах!
🔵вслед за Chrome тоже теперь эскейпируют символы < и > в атрибутах и применяют сквозные стили по умолчанию к h1

🔡 в Astro 5.10:
🔵появились live-контентные коллекции, которые извлекаются в рантайме вместо билд-тайма
🔵стабилизированы встроенные респонсив-картинки

🔡 в Prettier 3.6:
🔵под флагом вышел новый CLI
🔵зарелижены плагины @prettier/plugin-oxc и @prettier/plugin-hermes

🔡 вышел Vite 7.0, в котором дропнута поддержка Node.js 18 и изменены дефолтные таргет-версии браузеров
🔡 выпустили SVGO v4.0.0:
🔵дропнули поддержку Node.js 14
🔵появились новые дефолтные плагины
🔵теперь поставляется в виде dual-пакета: ESM + CJS

Проекты
🔡 syntax-highlight-element — а вот подъехал и веб-компонент для подсветки синтаксиса на свежеподдержаном Custom Highlight API
🔡 sonda — универсальный визуализатор и анализатор JS и CSS-бандлов, совместимый с основными сборщиками и фреймворками
🔡 kelp — новый CSS-фреймворк в 2025 наверное звучит уже иронично, использовать его вы вряд ли будете, но покопать для нахождения интересных фишек никогда нелишне, например, селектор :where(:root) или слоистая структура отдельных модулей CSS

Статьи, мнения, туториалы

JS/TS
🔡 очередная история про уменьшение раздутого бандла; если вы сталкиваетесь с такой же проблемой:
🔵проверьте, хорошо ли работает тришейкинг: возможно придётся убрать barrel-импорты, где-то вручную добавить магический коммент /* #__PURE__ */ и настроить секцию sideEffects в package.json
🔵смените таргет-версию ES хотя бы до es2022
🔵обновите зависимости

🔡 наверняка вы сталкивались с ситуацией в TS, когда из-за ветки проверки ключей Map или индексов массивов в тип значения добавляется undefined, например, undefined | string, из-за этого приходится дополнительно явно проверять значение на undefined либо ещё вариант пропатчить тип метода has() у Map или же просто проставить ! там, где вы точно уверены в результате
🔡 комитет одобрил ES2025, что нового появилось в языке:
🔵Import attributes with { type: 'json' }
🔵Iterator helper methods (filter, map, find…)
🔵новые методы Set()
🔵RegExp.escape()
🔵Promise.try()

CSS
🔡 каскадные слои в CSS — хорошая тема, даже если вы используете подход с атомарными стилями; особенно может быть полезно на больших проектах со старой кодовой базой или внешними стилями, а также если планируется долго развивать комплексное приложение
🔡 скролл-анимации хоть ещё и поддерживаются только chromium-браузерах, но уже появились в превью-версиях Safari и за флагом в FF, так что для каких-то простеньких и не влияющих сильно на UX интерфейсных решений, вполне применимы (например, анимированный индикатор скролла страницы)

Платформа
🔡 если вы приступаете к разработке чего-то связанного с датой-временем (особенно в мировых масштабах) с мыслью «Что может быть проще времени?», то без использования спец либ вы наверняка столкнётесь с массой проблем (иногда даже их не заметив), вот список потенциальных проблем
🔡 чел вёл статистику столкновения с хитрыми багами с 2002 года и подвёл итоги; часто проблемы возникают:
🔵с обработкой пустых значений (забывается ставить проверку на пустоту)
🔵с днями (временем, в целом)
🔵с устаревшими форматами данных
🔵дубликатами словарей
🔵незапушенными локальными изменениями
🔵некорректными правами доступа
🔵некорректным использованием фич пользователями
🔵неполной тестовой средой по сравнению с продом

@web_platform | Поддержать платформу 💕