FrontEndDev
26.5K subscribers
2.54K photos
24 videos
7.76K links
🚀 Статьи, новости, туториалы по frontend разработке.

http://jem-space.ru

Admin: @jem_jem
Пишу в @five_a_m
AI и вайбкод @vibe_and_ai

Читать на парковке: https://max.ru/front_end_dev

Реклама: http://bit.ly/2NxmVDu
РКН: https://clck.ru/3GLw7G
Download Telegram
Почему нативная рандомизация в CSS это большой шаг вперед

CSS долго был детерминированным и не умел настоящую случайность, поэтому разработчики обходились паттернами, селекторами и генерацией на препроцессорах или на сервере. Новые нативные функции для random в CSS упрощают создание естественных вариаций и делают их частью самого стека, а не хаком.

https://css-tricks.com/the-importance-of-native-randomness-in-css/
5👍2
React Server Components в TanStack Start

React Server Components выполняются только на сервере, могут быть async и напрямую ходить в API и базу, при этом в браузер уходит только готовая разметка без кода компонентов. Это радикально уменьшает клиентские бандлы и подходит для больших деревьев с минимумом интерактива, а интерактивность подключается через client components.

https://frontendmasters.com/blog/react-server-components-in-tanstack/
7👍3🔥2😁1
Миграция vk.com на SPA и обновление frontend-архитектуры ВКонтакте

Команда ВКонтакте перевела ключевые разделы vk.com на SPA, включая ленту, профили, сообщества, мессенджер, клипы и маркет.

Интересный кейс миграции большого highload frontend-продукта: первая отрисовка страницы ускорилась на 25%, а переходы между разделами — в 3,5 раза. Интерфейс теперь сначала показывает каркас страницы, а затем догружает контент. Параллельно ускорились инженерные процессы: деплой фронтенда сократился до 20 секунд, а релизы происходят 6–8 раз в сутки.

Подробнее — в статье: https://habr.com/ru/companies/vk/news/1043220/
👎21👍10💩5🤡5👏2
Сюрпризы кроссдокументных view transitions: что ломается и как этого избежать

Разбор типичных проблем при кроссдокументных анимациях между страницами, включая отказ от устаревшего способа включения и неожиданный таймаут в 4 секунды. Полезно, чтобы сделать плавные переходы без дерганий и непредсказуемого поведения.

https://css-tricks.com/cross-document-view-transitions-part-1/
6👍5🔥1
FastMCP для быстрых MCP серверов на TypeScript

FastMCP помогает собирать MCP серверы с поддержкой клиентских сессий без возни с низкоуровневой реализацией, ускоряя разработку и упрощая поддержку. Отлично подходит для тех, кто делает фронтенд-инструменты и интеграции с AI через MCP.

https://github.com/punkpeye/fastmcp
7👍6👌2
Интерактивный trail из картинок с гравитацией на GSAP

Делаем эффект, где при движении мыши появляются изображения, затем они падают к низу вьюпорта, отскакивают и исчезают, сохраняя направление движения курсора. Под капотом сборка компонента на JS и анимация через GSAP с аккуратным трекингом дельт курсора и порогом для спавна.

Демо

https://tympanus.net/codrops/2026/05/20/made-with-gsap-building-a-fun-gravity-based-mouse-trail/
6👍4🔥2
pnpm 11.1: новые префиксы для GitHub Packages и улучшенная диагностика

В pnpm 11.1 добавили поддержку gh: prefix для GitHub Packages, а также обновили pnpm bugs и pnpm audit для более удобного открытия трекера ошибок и проверки ECDSA подписей реестра.

https://github.com/pnpm/pnpm/releases/tag/v11.1.0
👍82
React стек 2026: карта лучших библиотек по категориям

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

https://habr.com/ru/articles/1032830/
💩10👍81
Rolldown 1.0 стабилен и готов к продакшену

Rolldown это быстрый JavaScript бандлер на Rust, который совместим с Rollup плагинами. Обновление с последнего RC обычно проходит без правок кода, а Vite 8 уже использует Rolldown как основной бандлер.

https://voidzero.dev/posts/announcing-rolldown-1-0
👍11🔥7🤯4
Мастер класс по отладке Next.js: логи, трассировка и полный контекст

Разбираемся с Next.js багами без прыжков между инструментами: пишете логи, которые объясняют где, что и почему, и связывают браузер и Node. В итоге получаете сквозную картину проблем для ускорения диагностики и исправлений.

https://sentry.io/resources/nextjs-may-workshop/
5🔥5👍2
Затенение переменных в JavaScript и как не наступать на грабли

Variable shadowing ломает ожидания, когда имена переменных совпадают в разных областях видимости, и приводит к ошибкам или неожиданным значениям. Разбераемся, как это работает для let, var и глобальных переменных через window, чтобы писать предсказуемый код.

https://habr.com/ru/articles/1028948/
👎105👍1