Новости
- вышел Jpegli — новая либа для кодирования jpeg, обещают на 35% лучшее
- PartyKit, библиотека для создания мультиплеер-приложений, куплена Cloudflare: обещают холить и лелеять (но это в пресс-релизах они все так обещают)
- V8 Sandbox — более не эксперимент: уже в Chrome 123 память для V8 будет отделяться в отдельную «резервацию», чтобы предотвратить несанкционированный доступ к ней
- вышел новый учебник по JS от гугловцев: как обычно, считаю, что только читать материал — мало, квизы в конце статей — тоже мало, надо отрабатывать на практике, вот буквально набивать руку, печатая код
- вышел ESLint v9.0.0, в нём много нововведений и breaking changes: не поддерживается нода < v18.18.0, v19; eslint.config.js — теперь дефолт, .eslintrc —депрекейт; удалены форматтеры, кроме stylish, html, json и json-with-meta; обновлен eslint:recommended; добавлены и изменены многие правила
- вышел ESLint Config Inspector — инструмент для визуального изучения вашего конфига, к чему он применяется, почему, зачем, за что (работает только с eslint.config.js) — это приятная пилюля для тех, кто страдает, что надо снова всё перелопачивать
Проекты
- ts-pattern — либа реализующая pattern matching подход в TS: если у вас есть развесистые условия, то возможно стоит присмотреться к либе
- vinejs — если вдруг вы использовали Zod в Node для валидации полей формы с клиента, то вас стоит взглянуть на спец либу для валидации именно HTTP request body
- dioma — либа для реализации dependency injection в JS и TS
- cally — веб-компонент календаря: фичастый, маленький, доступный, твой
- previewjs — таб с превью отрендеренного компонента из текущего файла прямо в редакторе для React, Vue, Svelte, Solid
Статьи и демки
JS
- очередное напоминание о существовании Shadow DOM без разглагольствований: бери и копируй базовый веб-компонент кнопки, который сразу заработает
- шоукейс библиотеки Effect, которая берёт на себя задачу помочь декларативностью и наглядностью побороть неоптимальную конкуренцию в асинхронных приложениях
- оптимизация бандла, в общем-то, неважно какого приложения: основная мысль — бандл — не бинарник, это высокоуровневый JS, который можно растрепать и посмотреть, что там есть лишнего (webpack-bundle-analyzer в помощь)
- yarn для тех, кому нужно не только запускать команды из package.json, а: хранить кэш всех пакетов проекта в репозитории; использовать workspaces в монорепе; интерактивно обновлять зависимости проекта; гибко управлять версиями пакетов; использовать «протоколы» для подключения к проекту внешних файлов и папок; патчить пакеты и другое
CSS
- крутые текстовые эффекты (ведь всю эту мощь в CSS же принесли для стилей, а не программирования, так?)
- что будет, если соединить :has(:hover) и сетку на 100500 элементов — позиционирование курсора без использования JS
- а что будет, если соединить :has(input:focus) input:invalid и пачку инпутов с maxlength="1" и pattern="[tT]" — wordle без использования JS
- «складывающиеся» элементы на transform-ах: особо приятен эффект затенения при более остром угле складывания
- использование CSS как инструмента для причинения умышленного визуального регресса для антипаттернов в HTML (например, для выявления забытых пустых ссылок a:not([href]), a[href=""], a[href$="#"], a[href^="javascript"])
HTML
- ещё один гайд по <img>, srcset, sizes и <picture> с фокусом на последовательное понимание, а зачем оно вообще нужно
Платформа
- если что WebP уже не самый топ-формат и повсеместно распространён более лучший AVIF, правда руками настраивать всю машинерию имаджинерии сложно, поэтому можно воспользоваться инструментами для пребилда картинок в нужном формате или доставкой из CDN
@web_platform | Поддержать канал 🤝