Пульс веб-платформы 21.03.2025

Новости

  • в Bun v1.2.5 стала достпна поддержка Svelte и CSS modules в бандлере и дев-сервере
  • как и в случае Node.js vs Bun/Deno, в мире линтеров образуется похожая ситуация: к противостоянию ESLint vs Biome присоединяется вышедший в бету Oxlint, который написан на Rust, поэтому оч быстрый, >500 правил работает из коробки, есть автофиксы + планируют запилить поддержку кастомных ESLint-плагинов
  • у Vercel есть Next.js, а у Netlify теперь есть TanStack Start и это хорошо и для TanStack, так как будет деньги, и для нас, так как будет альтернатива пропушиваемой парадигме RSC, то есть появляется неиллюзорная возможность появления полноценного React-фреймворка «здорового человека»:
    • в TanStack типобезопасные роуты благодаря дому, что роуты основаны не на файлах, а на функциях, которые создают роуты
    • серверные функции тоже более явные и гибкие, в отличие от директивы “use server”
    • нативная интеграция с TanStack Query
  • в Safari Technology Preview 215 появились Scroll Driven Animations (итого в Chrome уже есть, в FF есть за флагом), CSS Anchor Positioning (в FF нет) и на десерт text-wrap-style: pretty
  • проект styled-components переведён в режим поддержки, так как Context API не поддерживается в серверных компонентах, экосистема в целом ушла в сторону другого подхода к написанию стилей (атомизация стилей, jit-сборка), мейнтейнер сам перестал использовать styled-components в больших приложениях. Это, в целом, ничего страшного, если нравится такой подход к написанию стилей (мне нравится, так позволяют часть UI логики пробрасывать внутрь стилевых компонентов) есть build-time решения со styled-like API (linaria, panda css)
  • Parcel v2.14.0 стал поддерживать рендер React Server Components в CSR, SSR или в build-time просто в HTML, заодно стали глубоко поддерживать MDX, и кроме того, появился инструмент миграции проекта с CRA npx cra-to-parcel

Проекты

  • eslint-plugin-eslint-plugin — ESLint-плагин для линтинга ESLint-плагинов, если желаете разработать свой, то может подсобить
  • vite-bundle-analyzer — визуальная и CLI-утилита для инспекции содержимого вашего Vite-бандла

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

JS

const pipWindow = await documentPictureInPicture.requestWindow({
  width: window.innerWidth,
  height: window.innerHeight,
});


pipWindow.document.documentElement.innerHTML = htmlCode;
  • ещё один наброс на Next.js vs Vite + TanStack от человека, который устал скрестись о комплексность API и хочет, чтобы оно просто работало и на клиенте, и на сервере
  • если вы не поддались искушению мигрировать на Biome или Oxlint, а хотите сквозь тернии мигрировать таки ваш проект на 9 версию ESLint, то тут предлагают чеклист миграции; я пытался в миграцию полгода назад, но не осилил, так как не были готовы основные сторонние плагины, может быть пора попробовать снова
  • практические юзкейсы утилитарных типов в TS:
    • Partial в случае, если не хочется при добавлении новых полей в тип, ходить по всем местам и править это; правда встроенный Partial распространяется только на один уровень вложенности, но «deep partial» из стороннего ts-toolbet
    • Omit для типизации объекта, ещё не сохранённого в БД, то есть у него есть все поля, кроме id
    • ReturnType для вытаскивания типа, который возвращает функция
    • Readonly для типизации копии объекта, которую нельзя модифицировать

CSS

Платформа

  • чем больше уровней абстракций люди строят в технологиях (энергия → чип → сервер → веб-платформа → препроцессоры → библиотеки → фреймворки…), тем больше софта требуется, чтобы это всё обслуживать; поэтому AI не лишит нас работы (ведь даже сейчас есть работа для программистов Ассемблера), а просто кратно увеличит количество разработчиков, которые будут делать ещё больше софта ещё более разнообразными способами (возможно менее оплачиваемыми), и этим разработчикам так или иначе всё равно придётся осваивать основы просто другим путём
  • а вот это просто красиво смотреть: интерфейсы — как человеческая сущность: тёплые, вязаные, твои