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

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

Новости
🔡 лучше поздно, чем никогда: опубликован CSS Snapshot 2024, внутри появился новый раздел Reliable Candidate Reccomendations, куда собраны устоявшиеся спеки со стабильной реализацией в браузерах, но ещё немного косячной, туда включили: Media Queries Level 4, CSS Scroll Snap Module Level 1, CSS Scrollbars Styling Module Level 1, CSS Grid Layout Module Level 1 и 2
🔡 обновился Deno до 2.2: главное, что стал поддерживаться node:sqlite
🔡 вышел Bun v1.2.3:
🔵 вернули то, с чего начинался Bun — дев-сервер, bun ./index.html поднимет локальный сервер для статики
🔵 Bun.serve() на сервере теперь умеет в роуты, то есть можно описать полноценный API с ощущением «на коленке»
🔡 в AI-поисковике Perplexity объявили, что разрабатывают свой браузер Comet (под капотом видимо всё равно будет chromium 😏); считаю, что, чем пихать AI-фичи в уже привычные браузеры, всё лучше выделить это всё в отдельную нишу любителей AI-приблуд
🔡 обновился React Scan до v0.2.0: интересный мув из разового использования инструмента для нахождения перфоманс-проблем в сторону постоянного использования и накопления «уведомлений» о собранных проблемах
🔡 в Next.js 15.2 появилась экспериментальная поддержка View Transitions API
🔡 анонсирован TS 5.8 RC: поддерживает require(esm) (а также флажок обратной совместимости --module node18`) и флаг `--erasableSyntaxOnly для искоренения enums, namespaces, параметрических свойств класса и import-алиасов

Проекты
🔡 up-fetch — обёртка над fetch, с поддержкой недавней Standard Schema Specification: в параметрах запроса передаётся валидационная схема в стандартизированном виде, например, с Zod
🔡 fuite — тула, запускающая Puppeteer и долго ходящая по ссылкам вашей SPA в поисках потерянного времени утечек памяти

Статьи и демки

JS
🔡 юзкейс, когда нужно в DOM переставить первый элемент в контейнере в конец (в слайдере, например, при показе последнего слайда), решается строчкой container.appendChild(container.firstElementChild)
🔡 JS часто бывает быстр за счёт JIT-компиляции: JS-код парсится в AST (Abstract Syntax Tree) → AST преобразуется в байт-код (промежуточная версия кода, выполняемая V8) и оптимизируется → если определённая функция/цикл становятся «горячими», то есть выполняются 10000 раз, то байт-код преобразуется в неоптимизированный машинный код (он быстрее, чем код для интерпретатора) → если код продолжает оставаться «горячим», то он преобразуется оптимизирующим JIT-компилятором в высокооптимизированный машинный код, работающий максимально быстро
🔡 пара мыслей про стейт во фронте:
🔵 появление API cache в React Query показало, что часто собственный «стейт» фронтового приложения — это не стейт вовсе, а иммутабельные данные с сервера (из API), и наличие API cache часто убирает необходимость использовать менеджер состояния на фронте
🔵 пропы — изначально, идея для «естественного» разделения зон ответственности модулей, но из-за их неправильного использования (проп-дриллинг), появились, наоборот, связывающие концепты типа глобального Redux-стора, которые во многих случаях не нужны

CSS
🔡 индивидуальные свойства трансформации translate, rotate и scale не переопределяют значение свойства transform, а дополняют его
🔡 если вы всё ещё считаете, что #ff0000 или rgb(255, 0, 0) — это самый красный цвет, какой только может быть, то вы ошибаетесь; значение color(display-p3 1 0 0) существенно «краснее», а точнее ярче (но при условии, что ваш девайс поддерживает цветовое пространство Display-P3)
🔡 как сделать строку или столбец с элементами одинаковой ширины, равной самому широкому из них (например, кнопки одинаковой ширины, равняющиеся по самой широкой кнопке):

.container {
  display: inline grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
}

Платформа
🔡 префетч ресурсов типа <link rel="prefetch" as="style" href="page-2.css" /> может, внезапно, откладывать загрузку основных ресурсов, так что лучше эту префетч-оптимизацию докидывать для некритичных ресурсов и уже из JS, после загрузки window

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