FrontEndDev
25.5K subscribers
2.73K photos
30 videos
7.97K 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
Deno уходит в Cloudflare ради новой платформы

Команда Deno переходит в Cloudflare, потому что хочет развивать не отдельный runtime, а общую платформу для серверов, где compute, storage и communication работают вместе. Авторы прямо говорят, что Deno Deploy показал: удобный DX есть, но под ним всё ещё слишком много инфраструктурной сложности.

Сильный аргумент за этот шаг — celld и Durable Objects обещают распределённые приложения с масштабированием, встроенным в модель программирования, а не собранным вручную. Сильный аргумент против — Deno как runtime получит только год поддержки, Deno Deploy закроется через шесть месяцев, а тем, кто строил на экосистеме, придётся мигрировать.

А вы бы поставили на такую платформу вместо отдельного runtime?

https://deno.com/blog/cloudflare
🤔5❤1
TypeScript перегрузки стали понятнее

Перегрузки в TypeScript позволяют одной функции поддерживать несколько сценариев вызова и точнее выводить типы аргументов и результата. Для старого API можно добавить новую сигнатуру, не ломая существующие вызовы, если реализация принимает объединённые типы.

https://habr.com/ru/articles/1096858/
❤‍🔥5⚡2👎2🔥2
iOS PWA унаследовали старые ограничения

Первая часть цикла о том, как PWA работают на iPhone, объясняет, откуда берутся привычные странности iOS и почему они до сих пор влияют на запуск веб-приложений. В <head> почти любого PWA в 2026 году рядом с manifest по-прежнему встречается apple-mobile-web-app-capable.

https://feeds.dzone.com/link/23564/17501497/pwa-ios-history
👍3⚡1
TanStack AI начал стримить структурированный JSON

TanStack AI теперь умеет ограничивать ответ модели Zod-схемой и отдавать структурированный JSON по мере генерации. Для стриминга на сервере нужно включить stream: true, а на клиенте читать данные через fetchServerSentEvents.

https://blog.master.dev/structured-output-with-tanstack-ai/
👍6🔥2
Браузеры по-разному грузят lazy-медиа

Вышел разбор того, как Chrome, Firefox и Safari заранее подгружают lazy images и media, и почему loading="lazy" на hero-изображении замедляет страницу. Для LCP-картинки оставляйте eager по умолчанию, а loading="lazy" ставьте только ниже первого экрана, иначе браузер начнёт запрос позже.

https://calibreapp.com/blog/native-lazy-loading
👍4❤3
CSS научил анимации стартовать по скроллу

В CSS Animation Triggers появился animation-trigger, который запускает обычную анимацию, когда элемент входит в нужный диапазон прокрутки. Chromium уже поддерживает это в версии 146 и новее, а для старых браузеров нужен запасной вариант с JavaScript или IntersectionObserver.

https://utilitybend.com/blog/scroll-triggered-animation-as-the-missing-piece-for-scrollytelling-on-the-web
👍10❤2
Как проверить обработчик postMessage в iframe

postMessage в iframe позволяет виджету и родительской странице обмениваться данными, но без проверок любое окно может отправить сообщение. Для resize-обработчика нужно сверять event.origin и event.source, а затем ограничивать формат и диапазон данных.

https://blog.master.dev/testing-an-iframes-postmessage-handler/
❤3👍3
Tamagui 3 добавил Tailwind-подобные пропсы

Tamagui 3 — система стилей и набор компонентов для React и React Native. В ее новой версии появились Tailwind-подобные пропсы и поддержка React Strict DOM.

Поддержка React Strict DOM пока важна для тех, кто собирает общий интерфейс для веба и нативных приложений, потому что она помогает держать один код без лишних обходных решений.

https://tamagui.dev/blog/version-three
👍3❤2
Конвертер кривых CSS и Spine 4.2

Riggy переводит CSS cubic-bezier и пресеты ease в массив curve для таймлайна Spine 4.2 и обратно. Кривая привязывается к первой из двух ключевых точек, а на последнем ключе она игнорируется.

https://riggyapp.com/tools/spine-bezier-curve
👍3❤1
Визуализатор design tokens показывает связи с компонентами

Интерактивный визуализатор design tokens помогает смотреть, как токены связаны с компонентами и друг с другом в дизайн системе. В нём уже загружены Carbon, SLDS и Stellar, а свои системы можно добавить отдельно.

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

https://design-tokens-visualizer.vercel.app/
👍4
Угадайте HTTP-статус по бытовой ситуации

Квиз по HTTP-статусам переводит 12 кодов в бытовые сцены и помогает не путать 401, 403, 429, 503 и 504. Для 429 клиенту стоит читать Retry-After, а при 413 и 304 проверьте лимиты загрузки и версионирование больших ответов.

https://habr.com/ru/articles/1097542/
👍4