Please open Telegram to view this post
VIEW IN TELEGRAM
Автор делится продвинутыми приёмами TypeScript, включая использование infer, шаблонных литералов и других мощных фич.
Обзор изменений в управлении состоянием с приходом React Compiler и как это влияет на необходимость использования сторонних библиотек.
Zod предлагает декларативный подход к валидации схем с автоматическим выводом типов, упрощая разработку и повышая надёжность кода.
#свежак
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
Приглашаем на Frontend Mix — бесплатный митап ЮMoney для всех, кто интересуется фронтенд-разработкой 🔥
🕓 24 апреля, в четверг, в 19:00 (мск) приходите на митап в Санкт-Петербурге или подключайтесь онлайн.
Спикеры из ЮMoney и Сбера расскажут, как работают над задачами и улучшают процессы в команде.
Темы докладов:
🟣 Рефакторинг за 10 секунд. Как с помощью консольной утилиты производить автоматизированный рефакторинг крупных приложений за считанные секунды.
🟣 Подходы и практики тестирования во фронтенде. Зачем нужно тестирование во фронтенде, какие стандарты и подходы существуют и как мы применяем их в своей работе.
🟣 Уязвимости фронтенда в финтехе. Топ-3 атаки, или как построить защиту по всем фронтам — от планирования до релиза.
🟣 Анимация до кончиков пальцев. Поговорим про анимацию в целом и на вебе. Рассмотрим все способы сделать анимацию. Узнаем про композитные слои и как их посмотреть в Dev Tools — на примере одинаковых анимаций, но с использованием разных подходов.
Чтобы попасть на митап, нужна регистрация. Все подробности — на сайте Frontend Mix❤️
Спикеры из ЮMoney и Сбера расскажут, как работают над задачами и улучшают процессы в команде.
Темы докладов:
Чтобы попасть на митап, нужна регистрация. Все подробности — на сайте Frontend Mix
Please open Telegram to view this post
VIEW IN TELEGRAM
Frontend Developer — удаленка/Офис (Москва/Санкт-Петербург)
Frontend Developer (Vue.js) — от 250 000 ₽, удаленно (Москва)
Разработчик JS (Middle) — от 150 000 ₽ до 300 000 ₽, удаленно (Казань)
Frontend-разработчик — офис (Санкт-Петербург)
Frontend-разработчик — 180 000 - 190 000 ₽, удаленно (Москва)
#свежак
Please open Telegram to view this post
VIEW IN TELEGRAM
FOUC (Flash of Unstyled Content) — это кратковременное отображение неоформленного HTML перед применением CSS, что может негативно сказаться на пользовательском опыте.
Почему возникает:
Как устранить:
<link rel="preload" href="/styles/main.css" as="style">
<style>
body { margin: 0; font-family: system-ui; }
</style>Таким образом, мы обеспечиваем мгновенное появление базового оформления без скачков.
• Добавляем defer к скриптам
• Переносим второстепенные стили вниз
• Избавляемся от лишних <link> в <head>
Пересобираем графику в WebP или AVIF, уменьшаем вес — и пользователь видит контент быстрее.
Используем серверный рендеринг (Next.js, Astro и др.), чтобы отправлять уже отрендеренную страницу, а не заставлять браузер гадать, как это должно выглядеть.
#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
Когда сроки горят, а разработчиков не хватает
Нехватка квалифицированных разработчиков, срывы дедлайнов и перегруз команды — эти проблемы знакомы большинству IT-руководителей. В условиях растущей конкуренции найти баланс между качеством реализации, сроками и бюджетом становится всё сложнее, особенно когда проект требует редких компетенций или быстрого масштабирования.
Решение проблемы — задействовать дополнительные ресурсы на аутсорсе или аутстаффе. Например, обратиться в Proglib. Да-да, мы запустили свою студию веб-разработки!
Что мы предлагаем:
• Опытные специалисты для аутстаффа (frontend, backend, DevOps, UI/UX, PM, BA)
• Полноценная разработка проектов под ключ
• Гибкое масштабирование команды под потребности клиента
• Прозрачная коммуникация и регулярная отчетность
Для каждого проекта формируется индивидуальная команда, исходя из конкретных потребностей заказчика.
Заполните форму, чтобы ускорить свою разработку 👉 https://forms.yandex.ru/u/67e548a4eb614622efa0bcb2/
Нехватка квалифицированных разработчиков, срывы дедлайнов и перегруз команды — эти проблемы знакомы большинству IT-руководителей. В условиях растущей конкуренции найти баланс между качеством реализации, сроками и бюджетом становится всё сложнее, особенно когда проект требует редких компетенций или быстрого масштабирования.
Решение проблемы — задействовать дополнительные ресурсы на аутсорсе или аутстаффе. Например, обратиться в Proglib. Да-да, мы запустили свою студию веб-разработки!
Что мы предлагаем:
• Опытные специалисты для аутстаффа (frontend, backend, DevOps, UI/UX, PM, BA)
• Полноценная разработка проектов под ключ
• Гибкое масштабирование команды под потребности клиента
• Прозрачная коммуникация и регулярная отчетность
Для каждого проекта формируется индивидуальная команда, исходя из конкретных потребностей заказчика.
Заполните форму, чтобы ускорить свою разработку 👉 https://forms.yandex.ru/u/67e548a4eb614622efa0bcb2/
Сегодняшний интернет — это не только мемы и котики, но и автозапуск видео, всплывающие окна, перегруженный JavaScript, странные архитектурные решения прошлого.
В статье разбираем:
Мечты о «перезапуске» веба с чистого листа — это не фантастика, а повод задуматься: а не пора ли нам пересмотреть старые решения?
Please open Telegram to view this post
VIEW IN TELEGRAM
Если бы у сайтов был техосмотр — Lighthouse был бы тем самым инспектором с линейкой и скептическим выражением лица. Но вместо «у вас тормоза» он говорит «у вас LCP 4.5 сек».
Зачем нужен:
замеряет, насколько быстро твой сайт появляется, становится интерактивным и не убивает пользователя скелетонами на 10 секунд.
проверяет базовые требования поисковой оптимизации: наличие заголовков, мета-описания, канонических ссылок, индексации и пр.
для прогрессивных веб-приложений Lighthouse проводит полный аудит, включая работу оффлайн, наличие manifest.json и service worker.
проверяет безопасность, использование современных API, корректность HTTPS, ошибки в консоли и другие важные аспекты качества веб-приложения.
Как использовать:
А если хочется как профи:
• Устанавливаем Lighthouse CLI:
npm install -g lighthouse• И запускаем тест прямо из терминала:
lighthouse https://example.com --view• Можно даже засунуть это в CI и отгонять плохие коммиты до релиза.
— Lighthouse Docs от Google
— Сравнение Lighthouse и PageSpeed Insights
#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
Бен Холмс из Warp рассказывает о local-first веб-приложениях — идее, где база данных живёт прямо в браузере.
Создатель HashiCorp представляет Ghostty — новый терминал, переосмысляющий классический UX.
Эван Ю (создатель Vue и Vite) обсуждает эволюцию фронтенд-инструментов: от Vite к VitePlus — новой унифицированной сборочной системе.
#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
Собрали топовые материалы, которые наши подписчики сохраняют чаще всего.
Эту подборку мы будем регулярно пополнять, поэтому сохраняйте тонну пользы, чтобы не потерять!
1. Как оживить веб-страницу: находки от автора курса по анимации
2. Робин Лорд создал интерактивную браузерную игру для изучения HTML и CSS
3. Селекторы CSS на практике
4. Визуализация JavaScript: Event Loop, Task Queue и Microtask Queue
5. Одна React-задача, демонстрирующая ключевые навыки на собеседовании
6. CSS-селектор, о котором вы могли не знать
7. React пора сдать в музей: почему популярный фреймворк устарел и чем его заменить
Please open Telegram to view this post
VIEW IN TELEGRAM
Видели где-то упоминание WebGPU и думали: «Это вообще нужно?» Давайте разберёмся вместе — без скучных теорий, только самое важное и реальные кейсы.
Почему все говорят про WebGPU:
Основные понятия, которые пригодятся
С чего начать:
— wgpu для Rust-энтузиастов
— Babylon.js с экспериментальной поддержкой WebGPU
— Трио Three.js + WebGPU-рендерер
Реальные кейсы использования:
Что вы уже пробовали на WebGPU?
P.S. Если хотите задать вопрос, заполните нашу гугл-форму. Это займет 5 минут.
#междусобойчик
Please open Telegram to view this post
VIEW IN TELEGRAM
Когда твой код вроде работает, но только у тебя — пора вспомнить про browserslist. Эта команда показывает, на каких браузерах действительно должен работать твой проект. Зависит от настроек в package.json или .browserslistrc.
npx browserslistchrome 123
edge 120
firefox 124
safari 17.3
ios_saf 17.3
• Чтобы не поддерживать браузеры, которыми даже твоя бабушка уже не пользуется.
• Чтобы знать, под кого оптимизировать CSS и JS.
• Чтобы не гадать, почему :has() не работает.
Скомбинируй с
@babel/preset-env и autoprefixer, и твой билд будет настолько адаптивным, что захочется распечатать его и повесить на стену.#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
Мы не могли пройти мимо нашумевшего тренда и попросили ИИ перенести наш любимый язык программирования во вселенную Миядзаки.
Как вам образ? Расскажите в комментариях ↓
Please open Telegram to view this post
VIEW IN TELEGRAM
21 апреля 2025 года команда React представила релиз-кандидат (RC) React Compiler — инструмента, который автоматически внедряет мемоизацию в вашем коде, улучшая производительность без необходимости ручного использования useMemo, useCallback или React.memo .
Что нового:
⚠️ На что обратить внимание:
— Работает с React 17+, но для версий до 19 нужно подключить react-compiler-runtime и указать минимальную версию в настройках.
— Если код нарушает правила React (например, ref в рендере), компилятор просто пропускает такие места.
— Некоторые проверки (например, ref-in-render) временно отключены, чтобы избежать ложных срабатываний.
#свежак
Please open Telegram to view this post
VIEW IN TELEGRAM