Библиотека фронтендера | Frontend, JS, JavaScript, React.js, Angular.js, Vue.js
22.4K subscribers
2.47K photos
155 videos
38 files
4.86K links
Все самое полезное для фронтенда в одном канале.

По рекламе: @proglib_adv

Учиться у нас: https://proglib.io/w/77178ed4

Для обратной связи: @proglibrary_feeedback_bot

РКН: https://gosuslugi.ru/snet/67a5b6884689c2151c820bb4
Download Telegram
😀 Как экономить трафик на API-запросах

Частая проблема — пользователь меняет фильтр или вводит новый запрос, а старые fetch всё ещё летят на сервер.

В итоге:

— Лишняя нагрузка на бэкенд
— Дублирующийся трафик
— Мешанина в результатах

💡 Решение: отменяйте старые запросы через AbortController.


const c = new AbortController();
fetch('/search?q=cat', { signal: c.signal });

// отмена
c.abort();


Минимум кода, максимум пользы — особенно в поиске и live-фильтрах. Работает и в axios (v1.2+), и во всех современных браузерах.

🐸 Библиотека фронтендера

#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
👍113🔥1
🔥 Как мы мигрировали на Vue 3

В статье команда «М.Видео – Эльдорадо» делится опытом миграции с Vue 2 на Vue 3, перехода на Vite и TypeScript, а также оптимизацией зависимостей.

Все это позволило ускорить сборку и уменьшить вес проекта без приостановки разработки новых фич 😵‍💫

Что вы узнаете:

➡️ Как провести аудит и приоритизацию техдолга.

➡️ Плавная миграция на Vue 3 и Vite.

➡️ Как автоматизация ускоряет разработку.

🔗 Читать по ссылке на Habr

🐸 Библиотека фронтендера
Please open Telegram to view this post
VIEW IN TELEGRAM
6🥱3👍1
👍 AI-браузеры, 100X скорость билда и апдейт Svelte

Свежий выпуск Syntax— Wes Bos и Scott Tolinski обсуждают горячие новости веб-разработки.

В выпуске:

Node 22.18 теперь поддерживает TypeScript без компилятора

Vite обогнал Webpack и получил движок Rolldown

Новый Async и Remote API в Svelte

AI-браузер Perplexity Comet и форк VS Code с ИИ от Amazon

Четко, свежо и с прогнозами на будущее фронтенда.

🔗 Слушать подкаст

🐸 Библиотека фронтендера

#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
5👍2🔥2
🔥 Успей поднять квалификацию по выгодной цене!

Только до 17 августа у вас есть последняя возможность купить наши курсы по старым ценам.

🔹 Математика для Data Science:

— Базовый: (сейчас) 26 399₽(будет) 33 900₽
— Ультра: 35 199₽44 900₽
— VIP: 59 829₽75 900₽ (выгода больше 16 000₽!)

🔹 Программирование на Python: 24 990₽32 900₽
🔹 Алгоритмы и структуры данных: 31 669₽39 900₽
🔹 Архитектуры и шаблоны проектирования: 24 890₽32 900₽
🔹 AI-агенты для DS специалистов: 54 000₽59 000₽
🔹 Основы IT для непрограммистов: 14 994₽19 900₽
🔹 Базовые модели ML: 6 990₽9 900₽

Важно: Курсы из линейки Frontend Basic полностью снимаются с продажи. 17 августа — буквально последний день, когда их можно будет приобрести.

Успей купить до повышения — осталось 4 дня!

👉 Зафиксировать цену и начать учиться
4🥱4
📌 Инструмент недели: Storybook

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

Что умеет:

Запускать компоненты отдельно от основного проекта

Тестировать различные состояния и вариации интерфейсов

Создавать интерактивную документацию для команды

Работать с React, Vue, Angular, Svelte и другими фреймворками

Интегрироваться с тестовыми и CI/CD инструментами

Как начать:

1. Установка (автоматически определит фреймворк проекта):


npx storybook@latest init


2. Запуск локально:


npm run storybook


3. Открывайте компоненты, меняйте параметры и сразу смотрите результат в браузере

💡 Упрощает ревью и тестирование UI-компонентов.

🔗 Ссылка на GitHub

🐸 Библиотека фронтендера

#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥52👍1
📱 JavaScript получает апдейт

Стандарт ECMAScript 2025 официально утвержден. Обновление не революционное, но добавляет много приятных фич:

Iterator Helpersmap, filter, reduce прямо для итераторов.

Set методы — пересечение, объединение, разность, симметрическая разность.

Import Attributes — безопасный импорт JSON, CSS и др.

Regex апгрейд — переиспользуемые группы, экранирование, inline-флаги.

Promise.try — единый вызов sync/async функций.

Float16 — для WebGPU, ML и графики.

📌 Удобнее коллекции, регулярки и модули → чище код, меньше костылей.

🔗 Источник

🐸 Библиотека фронтендера

#свежак
Please open Telegram to view this post
VIEW IN TELEGRAM
👍123🤔2
😶 Редкие баги из продакшена

Бывает, что локально и на тестовом стенде всё идеально, а вот в продакшене — баг, который воспроизводится у одного процента пользователей. И, конечно, ни логов, ни воспроизводимости.

Вопрос от подписчика:

«Недавно словили кейс: приложение периодически зависало у пользователей в Южной Америке. Логи — пустые, трейсей нет, на стендах всё стабильно. Подозрения на сеть и какой-то специфичный браузер. Но проверить напрямую — никак. Как вы в таких случаях находите причину и воспроизводите баги?»


Какие техники, инструменты или хитрости помогают вам вылавливать такие баги? Пишите в комментах 👇

P.S. Если хотите задать вопрос, заполните нашу гугл-форму. Это займет 5 минут.

🐸 Библиотека фронтендера

#междусобойчик
Please open Telegram to view this post
VIEW IN TELEGRAM
3🤔1
🚀 Главная ошибка новичка в ML — строить звездолёт вместо велосипеда

Многие сразу хотят свою Midjourney, но в итоге получают только выгорание.

Успех начинается с «велосипеда»: научитесь предсказывать цены или классифицировать отзывы. Освойте базу, а уже потом стройте «звездолёты».

Наш курс «ML для старта в Data Science» — это и есть тот самый правильный старт от простого к сложному.

👉 Начните правильно

Берёте курс «ML для старта» до конца недели — Python в подарок.

А 21 августа пройдет бесплатный вебинар с Марией Жаровой: узнаете, какие проекты качают скилл, а какие качают ваши нервы.

А какой самый сложный проект вы брались делать в самом начале? 🫢
3
📌 useCallback: мемоизация функций в React

useCallback(fn, deps) сохраняет одну и ту же ссылку на функцию между рендерами, пока не изменились зависимости.

Почему важно:

В React функции создаются заново при каждом рендере. Если их передавать в React.iss.onemo-компоненты или использовать в useEffect зависимостями — это вызовет лишние рендеры/эффекты.


const handleClick = useCallback(() => {
doSomething();
}, []);


💡 Антипример:

Без useCallback дочерний React.iss.onemo-компонент будет рендериться каждый раз, потому что функция — новый объект.

🐸 Библиотека фронтендера

#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥42👍1
🚀 🧑🏻‍💻 Пора пушнуть свою IT-карьеру: стартовала регистрация на самый крупный онлайн-хакатон для спецов со всей России и мира!

40 млн призового фонда уже ждут:
⚡️1 место — 1 млн рублей
⚡️2 место — 600 тысяч рублей
⚡️3 место — 400 тысяч рублей

💼 Разрабатывайте решения для топовых компаний и столичных сервисов

Среди задач:
👉🏻 Система автопилота городского робота уборщика
👉🏻 ИИ-модель для автоматизации приёма и выдачи инструментов
👉🏻 Сервис для выявления компьютерных томографий органов грудной клетки без патологий
👉🏻 Система рекомендаций по оптимизации производительности Data Lakehouse
и еще много других

Среди постановщиков задач Правительство Москвы и ведущие компании: Газпромбанк.Тех, VK Tech, Kaspersky, АФЛТ-Системс (Группа «Аэрофлот»), Союзмультфильм, Avito, Итэлма.

📅Регистрация открыта до 18 сентября!

👥Принять участие могут IT-специалисты из России и зарубежа от 18 лет.

Регистрация и подробности — по ссылке ➡️ https://i.moscow/lct?utm_source=sp&utm_medium=social&utm_campaign=frontendproglib/?erid=2VtzqwRkizm

📲 А за актуальными новостями по хакатону — ждём на нашем канале
🧠 Выбор первого ML-проекта: чеклист против выгорания

Классика плохих решений в ML — выбрать слишком сложный проект: неделя ковыряния в коде, десятки крашей и никакого результата. Хотите дойти до финиша — начните с простого проекта, который реально можно довести до конца.

Мини-чеклист первого проекта:

1. Понятные данные — без «я нашёл датасет в даркнете, но он на суахили».

2. Измеримая метрика — «точность 92%», а не «ну вроде работает».

3. Объяснимый результат — чтобы не-техлид понял, почему модель ругается на спам.

Наш курс «ML для старта в Data Science» — старт от простого к сложному: теория → практика → проверка → проект в портфолио.

👉 Начать свой путь в Data Science

Оплатите курс по ML до 17 августа — курс по Python в подарок.

📅 Бесплатный вебинар с Марией Жаровой — 21 августа: как выбирать проекты, которые доводят до оффера, а не до психотерапевта.

💾 Сохрани, чтобы не потерять, когда будешь готов(а) начать
1
🔥 IT-зарплаты 2025: почему рост оказался фантомным

На рынке — новые тренды: компании экономят, вакансии становятся «гибридными», а зарплаты вроде растут, но ощущение, что денег больше, так и не появилось.

Что в статье:

➡️ Почему рост зарплат — иллюзия

➡️ Как изменились требования к IT-специалистам

➡️ Тренд на гибридные вакансии и экономию компаний

🔗 Читать подробнее

🐸 Библиотека фронтендера
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4🌚1