creator cover Expa
Expa

Expa 

Исследую галактику фронтенда 🚀

5subscribers

63posts

About

Разбираю CSS спецификации. Делаю дайджест фронтенд новостей. Собираю паттерны. Собираю CSS фичи.
Стараюсь делать полезное для интернета и для других фронтенд-разработчиков. Помогаю начинающим.
Проекты, которыми горжусь

План статей на ближайшее время

Сейчас передо мной стоит задача разобраться с CSS-спецификациями посвещённые работе скролов.

Такие дела

Пока был в двухнедельном отпуске и наслаждался количеством зелени в Сараево, а после — концертом Moby в Белграде, произошло несколько событий в моей жизни. Делюсь первым из них.
Я стал членом программного комитета Podlodka Frontend Crew. Моё счастливое лицо уже можно наблюдать на лэндинге. Решил попробовать себя по ту сторону процессов: не когда ты спикер, а когда помогаешь спикеру.

Дайджест #58

🦊 Привет, это Фронти!
Я принёс свежий выпуск #58 и собрал главное за неделю ✨
В этом выпуске: Chrome 151 делает доступ к камере и микрофону понятнее, CSS учится украшать gap и учитывать маршрут навигации, JSON снова оказывается не тем, кем кажется, Next.js ускоряет переходы, TanStack Table стала модульнее, а npm-экосистеме опять срочно нужен аудит зависимостей.
🧪 HTML и платформа
  • Chrome 151 добавляет более понятный пользовательский контроль доступа к камере и микрофону.
  • У img по умолчанию есть скрытое overflow: clip — важная деталь для теней, фильтров и элементов за границами картинки.
  • Разбираемся с базовой семантикой: ссылкой переходим, кнопкой совершаем действие.
  • Интерактивный проект Mow превращает стрижку виртуального газона в необычную веб-историю.
🎨 CSS и дизайн

Дайджест #57

🦊 Привет, это Фронти!
Я принёс свежий выпуск #57 и собрал главное за неделю ✨
В этом выпуске: веб-шрифтам WOFF исполнилось 16 лет, Chrome учится измерять производительность отдельных компонентов, CSS нашёл бесконечность, Rust продолжает ускорять JavaScript-инструменты, TanStack отказался от RSC на своём сайте, а npm начинает проверять пакеты на вредоносный код ещё при публикации.
🧪 HTML и веб-платформа

Дайджест #56

🦊 Привет, это Фронти!
Коля пока ещё в отпуске, а я принёс свежий выпуск #56 и собрал главное за неделю ✨
В этом выпуске: Firefox 153 расширяет Picture-in-Picture и экспериментирует с изолированными контейнерами, CSS учится анимировать masonry и разбрасывать конфетти, ReactBench проверяет код ИИ-агентов, Nuxt 4.5 готовит дорогу к Nuxt 5, Vue 3.6 завершает Vapor Mode, Figma рассказывает о доступности внутри Canvas, а Babylon Lite делает ставку исключительно на WebGPU.
🧪 HTML и платформа
  • Firefox 153 добавил Picture-in-Picture API на компьютерах и улучшил поведение popover="hint".
  • Native Containers разделяют сайты по изолированным окружениям, чтобы не смешивать cookies и авторизацию.
  • Web Locks API помогает вкладкам и воркерам координировать параллельные операции.
  • EPUB 3.4 приблизился к статусу веб-стандарта, а эксперимент с настоящим DOM внутри <canvas> соединяет HTML и графический рендеринг.
🎨 CSS и дизайн
  • Grid и Subgrid справились со сложной адаптивной турнирной таблицей FIFA без леса жёстких размеров.
  • Masonry-раскладки и <details> получают плавные анимации средствами CSS.
  • random() уже умеет разбрасывать CSS-конфетти, а Temporal вместе с color-mix() — менять тему по времени суток.
  • Для тех, кто всё ещё ищет идеальный способ центрирования, появилась коллекция сразу из 100 вариантов. Теперь отговорки официально закончились.
♿ Доступность и UX
  • Figma рассказала, как вручную реализовала семантику, клавиатурное управление и фокус в интерфейсе на Canvas.
  • outline возвращается туда, откуда его слишком часто удаляли дизайнерские ресеты, а :focus-visible помогает показывать рамку вовремя.
  • A11Y.md формулирует проверяемые правила доступности для ИИ-агентов, а AIMAC сравнивает модели по качеству созданных интерфейсов.
  • Тестировать производительность предлагают не только на флагманах, но и на реальных бюджетных смартфонах.
📦 JavaScript и WebAssembly

Дайджест #55

🦊 Привет, это Фронти!
Я принёс свежий выпуск #55 и собрал главное за неделю ✨
В этом выпуске: фронтенд размышляет о жизни без сборщиков, CSS укрощает специфичность и современные цвета, Bun переезжает с Zig на Rust, npm 12 делает установку зависимостей безопаснее, TypeScript 7 ускоряется благодаря Go, Node.js разбирает жизнь HTTP-запроса по миллисекундам, а LiteRT.js
запускает ИИ прямо в браузере.
🧪 HTML и веб-платформа
  • Современным браузерам всё реже нужна сложная сборка: небольшие сайты уже могут обойтись без транспиляции, Sass и километров конфигурации.
  • Полифилы остаются важным способом раньше пробовать новые API и помогать развитию веб-стандартов.
  • CSS Linked Parameters позволят передавать значения темы во внешние SVG и другие ресурсы.
  • Firefox планирует перейти на двухнедельный цикл релизов, а Cloudflare Drop публикует статические сайты простым перетаскиванием папки.
  • HYPERBLAM тем временем собирает синтезаторы декларативно — буквально музыка в HTML.
🎨 CSS и дизайн
  • @layer помогает отделять дизайн-токены от основных стилей и переопределять тему без войн специфичности и армии !important.
  • Color.js 0.7 улучшил работу с современными цветовыми пространствами и отображением цветов на разных экранах.
  • Объёмные кнопки, каскадные анимации, бесконечный скролл и готовые эффекты для Tailwind показывают, что CSS продолжает взрослеть.
  • AVIF не всегда компактнее WebP, поэтому даже самые современные форматы всё ещё просят не верить им на слово, а измерять.
Доступность и UX
  • Надёжные правила контраста, выравнивания и отступов часто полезнее очередного визуального тренда.
  • Баг, затронувший только левшей, напоминает: привычный сценарий использования никогда не бывает единственным.
📦 JavaScript и рантаймы
  • Bun переписали с Zig на Rust, а большую часть механической миграции помогали выполнять параллельные экземпляры Claude Code. Основой новой реализации станет Bun 1.4.
  • npm 12 больше не запускает install-скрипты пакетов по умолчанию. Безопасность выигрывает, но некоторым зависимостям понадобится ручная настройка.
  • TC39 обсуждает Await Dictionary, точные десятичные вычисления и Map.take.
  • Разбор Proxy и Reflect постепенно собирает маленькую реактивную систему, похожую на механизм Vue 3.
  • Атака на jscrambler снова напомнила, что установка зависимости фактически означает запуск чужого кода.
⚛️ React и фреймворки
  • SolidJS 2 показывает React-разработчикам сигналы и точечные обновления DOM без повторного рендера всего компонента.
  • Next.js запускает формальную программу ежемесячных security-релизов.
  • Vinext повторяет API Next.js поверх Vite, Mantine Vue переносит знакомые React-компоненты во Vue, а Ilha развивает островную архитектуру.
⚙️ Node.js
  • Интерактивный разбор проводит HTTP-запрос от клика через DNS, event loop и сервер до базы данных — всё путешествие примерно за 200 миллисекунд.
  • fetch() предлагают дополнить нормальными кодами ошибок, чтобы вместо загадочного TypeError приложение понимало настоящую причину сбоя.
  • Node.js 26.5 научился импортировать текстовые файлы как модули и читать содержимое Blob потоково.
🤖 ИИ и агентная разработка
  • LiteRT.js запускает модели локально в браузере: данные можно не отправлять на сервер, а приложение способно работать без сети.
  • Flue, eve и Agent Field предлагают новые способы создавать и размещать долговечных AI-агентов.
  • Conductor, Emdash и Open GSD помогают управлять параллельной работой coding agents, проверять изменения и доводить их до релиза.
🧰 Инструменты и безопасность
  • Playwright в GitHub Actions можно заметно ускорить кэшированием браузеров и правильной настройкой параллельных workers.
  • DepsGuard проверяет конфигурацию пакетных менеджеров, Aube изолирует lifecycle-скрипты, а Dependabot вводит трёхдневную паузу перед обычными обновлениями.
  • Обновились ESLint, Storybook, Vite DevTools, Fuse.js, Nano ID, c8, Helmet и другие инструменты.
🦊 Лисья шутка недели:
Bun переехал с Zig на Rust, TypeScript — на Go, а Perry написал TypeScript-компилятор на Rust. JavaScript-экосистема снова доказала: на JavaScript в ней можно написать всё — кроме самой JavaScript-экосистемы.

Дайджест #54

🦊 Привет, это Фронти!
Я принёс свежий выпуск #54 и собрал главное за неделю ✨
В этом выпуске: Safari учит AI-агентов смотреть в настоящий браузер, Chrome аккуратнее работает с буфером обмена, CSS получает якоря, миксины и фигурные рамки, ECMAScript 2026 уже почти весь живёт в рантаймах, Bun переписывают на Rust, TypeScript 7 выходит с Go-компилятором, npm 12 отключает install scripts по умолчанию, а Google проверяет сайты на готовность к AI-агентам.
🧪 HTML и платформа
  • Большой разбор эволюции фронтенда напоминает, как мы дошли от FTP и jQuery до edge, SSR, SPA и нового HTML-first маятника.
  • Safari Technology Preview 247 добавил Safari MCP Server: AI-агенты теперь могут смотреть на реальную страницу, DOM и поведение интерфейса в браузере.
  • Chrome улучшает Async Clipboard API: данные из буфера обмена будут загружаться ленивее и аккуратнее по MIME-типам.
  • Edge DevTools получил подсветку layout gaps, улучшения клавиатурной доступности и помощь при миграции PWA.
  • VS Code 1.127 добавил agentic browser tools, чтобы ассистенты могли работать с браузером прямо во время разработки.
🎨 CSS и интерфейсы
  • CSS Anchor Positioning всё ближе к нормальной жизни: tooltips, popovers и меню можно будет привязывать к элементам без ручного пересчёта координат.
  • В Chromium начали реализацию CSS Mixins — браузеры снова тихо забирают работу, ради которой мы годами держали препроцессоры.
  • border-shape показывает будущее декоративных рамок, сложных углов и форм без пачки SVG и лишних обёрток.
  • progress() помогает делать fluid typography так, чтобы она уважала пользовательский масштаб текста.
  • Full-bleed layout снова получил полезный разбор: 100vw всё ещё умеет подарить горизонтальный скролл там, где его никто не звал.
Доступность и UX
  • Grace Snow написала о дизайне для людей с трудностями чтения: понятный язык, структура, контраст и отсутствие перегруза важнее декоративной магии.
  • OverflowGuard предлагает строить компоненты вокруг реального контента, а не только вокруг брейкпоинтов.
  • Driver.js 1.6 помогает делать туры по интерфейсу, подсветки и контекстные подсказки прямо внутри продукта.
📦 JavaScript, Deno, Bun и WebAssembly

Дайджест #53

🦊 Привет, это Фронти!
Я принёс свежий выпуск #53 и собрал главное за неделю ✨
В этом выпуске: Chrome готовит нативный <usermedia> для камеры и микрофона, CSS снова отбирает работу у JavaScript, Deno 2.9 делает шаг к desktop-приложениям, TypeScript 7 ускоряет VS Code, Meta открыла Astryx, npm усиливает защиту пакетов, а AI-инструменты всё глубже встраиваются в разработку.
🧪 HTML и платформа
  • Chrome готовит элемент <usermedia>, чтобы сценарии с камерой и микрофоном стали понятнее и безопаснее.
  • Chrome 150 добавляет text-fit и более удобные градиентные рамки.
  • Pointer Events Level 3 стали рекомендацией W3C.
  • WebGL можно рендерить даже на сервере без GPU, если очень захотеть и правильно настроить CPU-эмуляцию.
🎨 CSS и интерфейсы

gap

gap
Как обычно, открыв страницу со спецификациями, я решил побродить и поискать что-нибудь новенькое для себя, например про text-fit, про который я скоро напишу, но, к моему удивлению, я наткнулся на, почему-то новенькую и свеженькую спецификацию про гэпы. Чтобы вы понимали, бедный gap кочует из спецификации в спецификацию, и я надеюсь, что он нашёл свой настоящий дом =)
Вот вам короткая история гэпов =)
Первое упоминание гэпов происходит 6 августа 2015 года в спецификации CSS Grid Layout Module Level 1 в статусе Working Draft (WD). В этой спецификации используются, обращаю ваше внимание, column-gap, row-gap и grid-gap. Пока эта спецификация дорабатывается и доходит до статуса Candidate Recommendation, через год, 29 сентября 2016 года, свойства меняют свои имена на grid-column-gap, grid-row-gap и grid-gap.
Со временем работы с гэпами стало понятно, что их будут использовать куда чаще, чем margin или padding, и было принято дать возможность использовать гэп в других контекстах, например во флексовом. Поэтому 6 сентября 2017 года гэпы переехали в новый для себя дом — в спецификацию

Дайджест #52

🦊 Привет, это Фронти!
Я принёс свежий выпуск #52 и собрал главное за неделю ✨
В этом выпуске: Mozilla предлагает бороться с ботами без слежки, HTML обсуждает локализованное время прямо в , браузерные приложения всё увереннее работают с локальными директориями, CSS собирает темы из одного цвета и запускает Quake в DOM, Next.js 16.3 ускоряет навигацию, Astro 7 и Vite 8.1 разгоняют сборку, TypeScript 7 RC уже близко, Node.js 26.4 пробует package maps.
🧪 HTML и платформа  
- Mozilla рассказала про PACT: способ ограничивать ботов через anonymous credentials без превращения каждого пользователя в трекинговый идентификатор.  
Subscription levels4

<div>

$1.26 per month
Ты как <div> — без тебя не собрать ни один интерфейс.
Этот уровень — отличный способ сказать «спасибо» за статьи, переводы и новости.

<section>

$6.3 per month
Как <section> задаёт структуру странице, так и ты помогаешь проекту расти и становиться системнее.
- У тебя будет возможность участия в голосованиях за будущие темы и статьи.
- Ты получаешь доступ к еженедельному дайджесту фронтенд-новостей раньше остальных.

<main>

$12.6 per month
Главный контент — здесь.
На этом уровне ты получаешь максимальную ценность и прямое влияние на развитие канала.
- Возможность задать свой вопрос и получить персональный ответ/разбор.
Subscription Spots Are Limited

h1

$1 889 per month
На этой странице ты одинок.
Это просто шутка 😊
Go up