fa
Feedback
Фронтендер от бога

Фронтендер от бога

رفتن به کانال در Telegram

Божественные дайджесты по фронтенду и немного юмора. По всем вопросам: @godinmedia

نمایش بیشتر
3 406
مشترکین
-224 ساعت
-87 روز
-3130 روز
جذب مشترکین
سپتامبر '26
سپتامبر '26
+3
در 0 کانال‌ها
اوت '26
+9
در 0 کانال‌ها
Get PRO
ژوئیه '26
+6
در 0 کانال‌ها
Get PRO
ژوئن '26
+4
در 0 کانال‌ها
Get PRO
مه '26
+6
در 0 کانال‌ها
Get PRO
آوریل '26
+2
در 0 کانال‌ها
Get PRO
مارس '26
+3
در 0 کانال‌ها
Get PRO
فوریه '26
+1
در 0 کانال‌ها
Get PRO
ژانویه '26
+4
در 0 کانال‌ها
Get PRO
دسامبر '25
+21
در 0 کانال‌ها
Get PRO
نوامبر '25
+7
در 0 کانال‌ها
Get PRO
اکتبر '250
در 0 کانال‌ها
Get PRO
سپتامبر '25
+2
در 0 کانال‌ها
Get PRO
اوت '25
+3
در 0 کانال‌ها
Get PRO
ژوئیه '25
+2
در 0 کانال‌ها
Get PRO
ژوئن '25
+2
در 0 کانال‌ها
Get PRO
مه '25
+7
در 0 کانال‌ها
Get PRO
آوریل '25
+6
در 0 کانال‌ها
Get PRO
مارس '25
+192
در 0 کانال‌ها
Get PRO
فوریه '25
+190
در 0 کانال‌ها
Get PRO
ژانویه '25
+36
در 0 کانال‌ها
Get PRO
دسامبر '24
+101
در 0 کانال‌ها
Get PRO
نوامبر '24
+593
در 0 کانال‌ها
Get PRO
اکتبر '24
+610
در 0 کانال‌ها
Get PRO
سپتامبر '24
+475
در 0 کانال‌ها
Get PRO
اوت '24
+589
در 0 کانال‌ها
Get PRO
ژوئیه '24
+642
در 0 کانال‌ها
Get PRO
ژوئن '24
+55
در 0 کانال‌ها
Get PRO
مه '24
+16
در 0 کانال‌ها
Get PRO
آوریل '24
+14
در 0 کانال‌ها
Get PRO
مارس '24
+30
در 0 کانال‌ها
Get PRO
فوریه '24
+78
در 1 کانال‌ها
Get PRO
ژانویه '24
+43
در 0 کانال‌ها
Get PRO
دسامبر '23
+39
در 0 کانال‌ها
Get PRO
نوامبر '23
+9
در 0 کانال‌ها
Get PRO
اکتبر '23
+17
در 0 کانال‌ها
Get PRO
سپتامبر '23
+73
در 0 کانال‌ها
Get PRO
اوت '23
+164
در 0 کانال‌ها
Get PRO
ژوئیه '23
+487
در 0 کانال‌ها
Get PRO
ژوئن '23
+412
در 0 کانال‌ها
Get PRO
مه '23
+12
در 0 کانال‌ها
Get PRO
آوریل '23
+7
در 0 کانال‌ها
Get PRO
مارس '23
+5
در 0 کانال‌ها
Get PRO
فوریه '23
+12
در 0 کانال‌ها
Get PRO
ژانویه '23
+15
در 0 کانال‌ها
Get PRO
دسامبر '22
+82
در 0 کانال‌ها
Get PRO
نوامبر '22
+10
در 0 کانال‌ها
Get PRO
اکتبر '22
+8
در 0 کانال‌ها
Get PRO
سپتامبر '22
+10
در 0 کانال‌ها
Get PRO
اوت '22
+13
در 0 کانال‌ها
Get PRO
ژوئیه '22
+111
در 0 کانال‌ها
Get PRO
ژوئن '22
+13
در 0 کانال‌ها
Get PRO
مه '22
+106
در 0 کانال‌ها
Get PRO
آوریل '22
+127
در 0 کانال‌ها
Get PRO
مارس '22
+9
در 0 کانال‌ها
Get PRO
فوریه '22
+10
در 0 کانال‌ها
Get PRO
ژانویه '22
+15
در 0 کانال‌ها
Get PRO
دسامبر '21
+72
در 0 کانال‌ها
Get PRO
نوامبر '21
+347
در 0 کانال‌ها
Get PRO
اکتبر '21
+836
در 0 کانال‌ها
Get PRO
سپتامبر '21
+350
در 0 کانال‌ها
Get PRO
اوت '21
+83
در 0 کانال‌ها
Get PRO
ژوئیه '21
+140
در 0 کانال‌ها
Get PRO
ژوئن '21
+339
در 0 کانال‌ها
Get PRO
مه '21
+1 365
در 0 کانال‌ها
Get PRO
آوریل '21
+439
در 0 کانال‌ها
Get PRO
مارس '21
+4 710
در 0 کانال‌ها
تاریخ
رشد مشترکین
اشارات
کانال‌ها
16 سپتامبر0
15 سپتامبر0
14 سپتامبر0
13 سپتامبر0
12 سپتامبر0
11 سپتامبر0
10 سپتامبر+1
09 سپتامبر0
08 سپتامبر0
07 سپتامبر0
06 سپتامبر0
05 سپتامبر+1
04 سپتامبر+1
03 سپتامبر0
02 سپتامبر0
01 سپتامبر0
پست‌های کانال
Не спешите выкидывать Webpack: разбор альтернатив и реальных сценариев миграции #почитать Вокруг сборщиков последние годы кип
Не спешите выкидывать Webpack: разбор альтернатив и реальных сценариев миграции #почитать Вокруг сборщиков последние годы кипят страсти: большинство боготворит Vite, кто-то экспериментирует с esbuild, а энтузиасты активно продвигают инструменты на базе Rust — прежде всего Rspack и SWC. На фоне этого Webpack нередко называют пережитком, который якобы тормозит развитие команд. Но жизнь реальных продуктов куда сложнее, чем пишут в соцсетях. Иногда Webpack остается единственным зрелым вариантом. А иногда — мешает и действительно требует замены. В этой статье я попробую разобраться, откуда вообще взялись сборщики и что именно происходит внутри Webpack, насколько современные альтернативы действительно готовы его заменить, почему в Рунити мы осознанно продолжаем использовать Webpack в основных продуктах и в каких случаях смена сборщика действительно имеет смысл, а в каких может обернуться лишней тратой времени и сил без ощутимой выгоды. Читать статью

2
Анимированный UI: как улучшить взаимодействие с пользователем #почитать Анимация пользовательского интерфейса прошла долгий п
Анимированный UI: как улучшить взаимодействие с пользователем #почитать Анимация пользовательского интерфейса прошла долгий путь за последнее десятилетие, они превратились в универсальный цифровой язык, который люди узнают и понимают. Эти микровзаимодействия позволяют дизайнерам общаться с пользователями посредством движения и анимации, предоставляя им рекомендации, контекст и создавая захватывающий пользовательский опыт. В продакшене анимация всегда балансирует между выразительностью и производительностью. Чем сложнее сцена, тем выше нагрузка на процессор, особенно на мобильных устройствах. Поэтому важно оптимизировать: использовать GPU-дружественные свойства (transform, opacity), избегать тяжёлых reflow, а для сложных эффектов — применять библиотеку, которая работает с отложенным рендерингом, например Framer Motion или GSAP. Это не только повышает плавность, но и снижает энергопотребление, что прямо влияет на опыт пользователя. ⏱Читать статью
358
3
Как функциональное программирование изменило фронтенд и почему отрасль возвращается к платформе #почитать Недавно я наткнулас
Как функциональное программирование изменило фронтенд и почему отрасль возвращается к платформе #почитать Недавно я наткнулась на статью «How Functional Programming Shaped Modern Frontend» и неожиданно поймала себя на мысли: мы уже настолько привыкли к функциональному программированию (ФП) в JavaScript, что забыли, как всё начиналось и почему многие идеи казались почти спасением. Чтобы лучше понять эволюцию, я решила посмотреть, что писали разработчики о ФП во фронтенде 10 лет назад, примерно в 2013-2016 годах. Контраст получился довольно яркий: от искреннего восторга до постепенного прозрения. Я решила поделиться своим анализом, основанным на современных наблюдениях и на тех статьях прошлого, где ФП воспринималось как путь к «правильному» фронтенду. ⏱Читать статью
418
4
JavaScript Distributed Assets — это просто #почитать Идея вот в чем: берем стандартные JavaScript модули (ESM) и делаем их пр
JavaScript Distributed Assets — это просто #почитать Идея вот в чем: берем стандартные JavaScript модули (ESM) и делаем их прямыми эндпоинтами для генерации любых текстовых веб-ассетов, таких как HTML-файлы, CSS, SVG или даже JSON или Markdown, используя простое соглашение о именовании исходных файлов и дефолтный экспорт результата в виде строки (JavaScript Template Literal). Проще некуда и чем-то похоже на PHP, верно? Но, что это нам дает? Давайте разберемся, почему JSDA (JavaScript Distributed Assets) - это то, что может сделать веб-разработку "грейт эгейн", после тысячи поворотов "не туда". ⏱Читать статью
506
5
Даём возможность пользователям сайта самим менять размер блоков, потянув указателем мыши за край или угол #почитать В статье
Даём возможность пользователям сайта самим менять размер блоков, потянув указателем мыши за край или угол #почитать В статье представлено всё необходимое, чтобы осуществить вынесенное в заголовок (плюс поддержка сенсорного ввода), а так же готовое open source решение, которое можно просто подключить и пользоваться. ⏱Читать статью
500
6
🔴 Тестовое собеседование на Frontend-разработчика со старшим разработчиком ex. Сбер 3 сентября(в четверг!) в 19:00 по мск пр
🔴 Тестовое собеседование на Frontend-разработчика со старшим разработчиком ex. Сбер 3 сентября(в четверг!) в 19:00 по мск приходи онлайн на открытое собеседование, чтобы посмотреть на настоящее интервью на Middle Frontend-разработчика. Как это будет: 📂 Даниил Дмитриев, старший разработчик в R-Vision, ex. Сбер, будет задавать реальные вопросы и задачи разработчику-добровольцу 📂 Даниил будет комментировать каждый ответ респондента, чтобы дать понять, чего от вас ожидает собеседующий на интервью 📂 В конце можно будет задать любой вопрос Даниилу Это бесплатно. Эфир проходит в рамках менторской программы от ШОРТКАТ для Frontend-разработчиков, которые хотят повысить свой грейд, ЗП и прокачать скиллы. Переходи в нашего бота, чтобы получить ссылку на эфир → @shortcut_front_bot Реклама. О рекламодателе.
506
7
Webflow → Next.js без фронтендеров: как мы перенесли 500+ страниц сайта через Cursor #почитать Нам нужно было оперативно увез
Webflow → Next.js без фронтендеров: как мы перенесли 500+ страниц сайта через Cursor #почитать Нам нужно было оперативно увезти наш сайт с Webflow: 500+ страниц, блог и база знаний. При этом возвращать фронтенд-разработку в режим постоянной поддержки сайта мы не хотели. Поэтому рассматривали конструкторы и CMS, но быстро поняли, что это будет работа в минус. Все усилия на переезд лишь вернули бы сайт в рабочее состояние, не дав новых возможностей. В итоге мы решили вести разработку и поддержку сайта в Cursor. То есть переписать его на NextJS с помощью AI агентов. Такая связка дала понятную модель страниц, быструю доставку статики и ISR для контента, а также возможность отказаться от отдельной CMS за счёт MDX. В спокойном режиме за два месяца удалось полностью переписать сайт и запустить его в прод. ⏱Читать статью
529
8
hq-cropper: Image Cropper без зависимостей для JavaScript #почитать Хочу рассказать о своей библиотеке hq-cropper — инструмен
hq-cropper: Image Cropper без зависимостей для JavaScript #почитать Хочу рассказать о своей библиотеке hq-cropper — инструменте для обрезки изображений на чистом TypeScript без единой зависимости. Когда искал cropper для своего проекта, столкнулся с двумя проблемами. Во-первых, большинство популярных решений тянут за собой кучу зависимостей и весят 100+ KB. Во-вторых, мало кто работает с большими изображениями. ⏱Читать статью
603
9
Ленивые итераторы в JavaScript: руководство с примерами #почитать Полное руководство по хелперам итераторов в JavaScript: как
Ленивые итераторы в JavaScript: руководство с примерами #почитать Полное руководство по хелперам итераторов в JavaScript: как ленивые вычисления заменяют цепочки .map().filter() и экономят память. Примеры, сравнение с массивами, подводные камни. ⏱Читать статью
674
10
Symbol.iterator: управление spread-синтаксисом JavaScript #почитать Symbol.iterator — это не просто «ещё один символ» в JavaS
Symbol.iterator: управление spread-синтаксисом JavaScript #почитать Symbol.iterator — это не просто «ещё один символ» в JavaScript. Это ключ, который позволяет вам сказать языку, как именно ваш объект должен вести себя в таких фундаментальных операциях, как цикл for...of или синтаксис spread (...). На практике это даёт удивительную возможность: создавать объекты, которые могут быть одновременно и структурированными хранилищами данных с именованными свойствами, и коллекциями, готовыми к «разворачиванию» в аргументы функции. В статье мы разберём, как с помощью Symbol.iterator решить классическую дилемму «объект или массив» на конкретном примере из реальной задачи. ⏱Читать статью
739
11
Мой справочник по Feature-Sliced Design #почитать Так как при использовании Feature-Sliced Design (FSD) возникает много вопро
Мой справочник по Feature-Sliced Design #почитать Так как при использовании Feature-Sliced Design (FSD) возникает много вопросов и разные люди понимают её по-разному, я решил написать статью-справочник, раскрывающий некоторые подробности методологии. В этой статье я продолжаю использовать те же принципы и часть терминологии, что и в предыдущей. Здесь я, в основном, описываю структурирование по правилам методологии. А в следующей статье, напротив, рассмотрю, как можно улучшить структуру проекта, намеренно нарушая правила FSD. Заранее предупрежу, что правила методологии носят рекомендательный, а не обязательный характер. Их назначение — задать направление структурирования, а дальше принимать решения нужно в зависимости от конкретного проекта и ситуации в нём. Строгое же следование правилам может привести к бо̒льшим проблем, чем их нарушение. ⏱Читать статью
696
12
Бесплатные и платные хостинги для сайтов на Next, React и JAMStack #почитать Сегодня я рассмотрю несколько специализированных
Бесплатные и платные хостинги для сайтов на Next, React и JAMStack #почитать Сегодня я рассмотрю несколько специализированных сервисов для хостинга фронта, среди которых не будет однотипных VPS. Только узкоспециализированные решения для хостинга сайтов. Мне хотелось ответить на вопрос, какой сервис будет лучшим для конкретного, узкого сценария и стека, а не просто перебрать очевидные сервисы, которые популярны, но не имеют своей специализации. ⏱Читать статью
533
13
Intlayer: альтернатива @nuxt/i18n с фокусом на оптимизации бандла #почитать После интеграции nuxt/i18n в несколько моих проек
Intlayer: альтернатива @nuxt/i18n с фокусом на оптимизации бандла #почитать После интеграции nuxt/i18n в несколько моих проектов я пришел к однозначному выводу: это, безусловно, лучшее i18n-решение для JS-фреймворков. Его «plug&play» настройка, загрузка пространств имен (namespaces) и встроенная маршрутизация, настоящее удовольствие в работе. Однако у этого решения есть серьезная проблема: загруженные пространства имен не подвергаются «тришейкингу» (tree-shaking). Несмотря на то, что JSON-файлы могут загружаться динамически для каждой локали, Nuxt в итоге объединяет их, что означает, что файл locale/zh/about.json загружается на всех страницах. ⏱Читать статью
628
14
Рендер-функции и Teleport в Vue.js #почитать Декларативные шаблоны Vue решают 90% задач фронтенда. Но периодически возникают
Рендер-функции и Teleport в Vue.js #почитать Декларативные шаблоны Vue решают 90% задач фронтенда. Но периодически возникают ситуации, где шаблонного синтаксиса оказывается мало. Нужен более тонкий контроль над рендерингом или возможность вынести часть компонента за пределы его естественной позиции в DOM-дереве. Для таких случаев Vue 3 послал нам render-функции и встроенный компонент Teleport. ⏱Читать статью
618
15
Практическая оптимизация React: ререндеры, Context, списки, INP и code splitting #почитать Оптимизация в React почти всегда с
Практическая оптимизация React: ререндеры, Context, списки, INP и code splitting #почитать Оптимизация в React почти всегда сводится к двум факторам: объёму работы, которую выполняет JavaScript, и частоте (а также «стоимости») перерисовок компонентов. Сам React работает достаточно быстро, но в крупных интерфейсах даже небольшие архитектурные промахи и на первый взгляд безобидные ререндеры начинают заметно бить по производительности. В данной статье мы расскажем про ключевые подходы к оптимизации React-приложений: как уменьшить количество лишних ререндеров, сократить объём вычислений при вводе и скролле и снизить нагрузку стартового JavaScript. ⏱Читать статью
687
16
JSDocs в VSCode #почитать В этой публикации я очень кратко раскрываю, почему переход с IntelliJ IDEA (PhpStorm) на VSCode лом
JSDocs в VSCode #почитать В этой публикации я очень кратко раскрываю, почему переход с IntelliJ IDEA (PhpStorm) на VSCode ломает привычную работу с JSDoc в JavaScript-проектах. ⏱Читать статью
566
17
Заменяем JS обычным HTML #почитать Уже многие годы JavaScript остаётся «рабочей лошадкой» веба. Если вам нужно сделать то, чт
Заменяем JS обычным HTML #почитать Уже многие годы JavaScript остаётся «рабочей лошадкой» веба. Если вам нужно сделать то, что невозможно реализовать средствами HTML и CSS, то обычно найти решение помогает JS. И это замечательно! JS помог расширить возможности пользователей, а также стимулировал прогресс HTML и CSS! Но время идёт, функции HTML и CSS расширяются, поэтому мы должны начать заменять старые и привычные решения на JS новыми, требующими меньше JS. Я ничего не имею против JS, но у него есть иные задачи, кроме как управление аккордеонами и внеэкранными меню навигации... Кроме того, JS нужно скачивать, распаковывать, обрабатывать, после чего он ещё часто тратит память на мониторинг и поддержку фич. Если мы сможем перенести какую-то функциональность JS в нативный HTML или CSS, тогда пользователям придётся скачивать меньше данных, а оставшийся JS сможет уделить внимание более важным задачам, с которыми (пока) не справляются HTML и CSS. ⏱Читать статью
651
18
Atomic CSS: верстка и легкость бытия #почитать Обсудим имеющиеся проблемы в верстке и посмотрим, как атомарный подход их реша
Atomic CSS: верстка и легкость бытия #почитать Обсудим имеющиеся проблемы в верстке и посмотрим, как атомарный подход их решает (или не решает). Разберем основные мифы, посмотрим на лучшие практики этого подхода и сделаем выводы. ⏱Читать статью
568
19
Реактивность без React или как обойтись без id в html элементах #почитать А зачем вообще обходиться без id? Даже не знаю, но
Реактивность без React или как обойтись без id в html элементах #почитать А зачем вообще обходиться без id? Даже не знаю, но это вполне возможно, и приложение будет живым и вполне себе «реактивным». А всю «магию» при этом творит функция, которую я назвал tokenize. Конечно же я, ни в коем случае, не настаиваю на отказе от id. "Элементарные" id никому не мешают и tokenize`у тоже. Но если обходиться без id, то как же получать ссылки на DOM элементы, для обращения к ним? Вот для этого и нужна функция tokenize, которая собирает референсы в удобную структуру с ветками, подветками и листьями (ссылками на DOM элементы). А вот как она это делает, мы с Вами сейчас и разберём. ⏱Читать статью
673
20
Типизация JavaScript через JSDoc #почитать Используете JSDoc для типизации JavaScript? Узнайте, как настроить TypeScript Comp
Типизация JavaScript через JSDoc #почитать Используете JSDoc для типизации JavaScript? Узнайте, как настроить TypeScript Compiler для профессиональной проверки типов, генерации деклараций и интеграции в процесс разработки. ⏱Читать статью
653