visx — библиотека визуализации от Airbnb, которая объединяет мощь D3 для вычислений и React для работы с DOM. Главная особенность — это не готовые графики, а набор низкоуровневых компонентов-примитивов, из которых вы сами собираете нужные визуализации. В версии v4 наконец добавили поддержку React 19. Также обновили зависимости d3-shape и d3-path до третьей версии, полностью убрали prop-types и lodash.
#devnews #datavisualization #datavis #visx #airbnb #react #frontend #js #webdev
Использовать key={index} в React-списках — антипаттерн, который приводит к багам с состоянием, анимациями и перерисовкой. В этом шортсе объясняю, почему индексы — плохая идея и что использовать вместо них. Стабильный и уникальный идентификатор — вот правильный выбор. Сохраняй — пригодится!
#react #reactjs #keyindex frontend #webdev #coding #programming #js #jsx
React Hook Form — это библиотека для управления формами в React, которая минимизирует количество ререндеров. В версии v7.80 вышло три важных обновления. Главная фича — возможность отключать отдельные поля внутри useFieldArray через опцию disabled. Теперь можно управлять состоянием каждого поля. Разработчики улучшили производительность: ускорили onChange, setValid, dirty checking и setValue. Также исправили баг, из-за которого пустой массив и пустой объект ошибочно считались равными. Важно: в версиях 7.54–7.80 обнаружена уязвимость prototype pollution, которая исправлена в 7.81.
#react #reacthookform #devnews #forntend #webdev #useform #reactjs #js
Flexbox и Grid — два основных подхода к вёрстке в CSS, которые часто путают. В этом шортсе коротко и наглядно показываю, в чём разница и когда что использовать. Flexbox — для одноразмерных раскладок (ряд или колонка). Grid — для двухразмерных раскладок (сетка). Частый вопрос на собеседованиях. Сохраняй — пригодится!
#flexbox #grid #css #webdev #coding #programming #frontend #shorts #html #csstutorial
PolyCSS — это CSS 3D-движок, который рендерит 3D-модели через DOM, используя CSS-трансформации, без WebGL и canvas. Каждый полигон становится обычным HTML-элементом, который можно инспектировать в DevTools. Поддерживает OBJ, STL, glTF, GLB и VOX, работает с React, Vue и ванильным JS. Проект уже используют для создания игр — например, шутер в стиле Quake, полностью на CSS 3D. Но главный вопрос — производительность: каждый полигон — это DOM-узел, поэтому чем сложнее сцена, тем сильнее нагрузка на браузер.
#devnews #polycss #css #3d #css3d #html #frontend #js
Git Stash — команда, которая временно прячет изменения, чтобы переключиться на другую задачу, не коммитя недоделанный код. В этом шортсе показываю, как это работает. git stash — спрятать изменения. git stash list — посмотреть все сохранённые стэши. git stash pop — применить последний стэш и удалить его из списка. Частый вопрос на собеседованиях. Сохраняй — пригодится!
#git #gitstash #programming #coding #developer #learngit #devops
Fontpair — это сервис с более чем 500 готовыми сочетаниями шрифтов для дизайнеров и разработчиков. Бесплатные шрифты из Google Fonts уже встроены в систему — остаётся только выбрать и использовать. В сервисе есть режим Playground, где можно проверить, как выбранное сочетание выглядит на визитках, сайтах, слайдах и в соцсетях. Расширение для Chrome позволяет навести на любой текст на сайте и узнать название шрифта, размер, интерлиньяж и цвет. За пару кликов можно сгенерировать DESIGN.md с готовыми переменными для CSS, Tailwind или SCSS.
#fontpair #typography #fonts #webdesign #design #ui #ux #frontend #шрифты
Debounce и Throttle — два подхода, которые часто путают даже опытные разработчики. В этом шортсе коротко и наглядно показываю, в чём разница и когда что использовать. Debounce — откладывает выполнение, пока поток событий не успокоится. Идеально для поисковых строк и автодополнения. Throttle — пропускает выполнение не чаще одного раза в заданный интервал. Идеально для скролла и ресайза. Это частый вопрос на собеседованиях, на котором многие ошибаются. Сохраняй — пригодится в работе!
#debounce #throttle #coding #programming #webdev #codinginterview #frontend
TypeScript 7.0 RC — это не просто очередное обновление, а полная смена фундамента. Компилятор переписан с JavaScript на Go — проект занял больше года и получил кодовое имя "Corsa". В итоге типизация и сборка ускорились в среднем в 10 раз: например, на кодовой базе VS Code (1.5 млн строк) время проверки типов сократилось с 77 до 7 секунд. Ускорение — это сочетание нативного кода Go и параллельной обработки. При этом логика проверки типов осталась той же, что в TS 6.0 — поведение компилятора не поменялось. Новая версия уже доступна для тестирования.
#typescript #ts #go #golang #frontend #webdevelopment #programming #coding #typescript7
Случайно затер коммиты? git reset --hard поставил крест на работе?
В этом шортсе коротко о том, как git reflog помогает восстановить потерянные коммиты.
Сохраняй шпаргалку — пригодится!
#git #gitreflog #gitreset #gitresethard #gitcommands #coding #programming
Fragment ref — это новая возможность в React, которая появилась в canary-релизе. Раньше Fragment использовался только для группировки элементов без лишних DOM-узлов. Теперь вы можете добавить к фрагменту ref и получить FragmentInstance, который даёт доступ к дочерним DOM-элементам. Это позволяет управлять фокусом, обрабатывать события и отслеживать видимость группы элементов без лишних обёрток. Новая фича призвана заменить устаревший findDOMNode и упростить работу с компонентами.
#devnews #react #reactjs #frontend #webdev #programming #javascript #js #reactfragment #fragmentref
Показываю пример реализации Outbox Pattern на практике. Сначала схема таблицы outbox_events: id, aggregate_id, event_type, payload, status, created_at. Внутри сервиса OrderService при создании заказа мы сохраняем бизнес-данные в таблицу orders и событие в outbox_events в одной транзакции — это гарантирует атомарность. После коммита транзакции запускается relay-процесс, который читает события со статусом pending, отправляет их в брокер сообщений (Kafka/RabbitMQ), и после успешной отправки меняет статус на processed или удаляет запись. Весь код показан в шортсе. Про другие паттерны смотрите в полном видео — ссылка под шортсом.
#outboxpattern #microservices #backend #backendinterview #designpatterns #codinginterview #techinterview #softwarearchitecture
В этом шортсе показываю интерфейс и возможности ZCode при создании задачи. Можно выбрать папку проекта, указать ветку и сразу увидеть Git Graph для отслеживания изменений. Доступны модели GLM-5.2 и GLM-5-Turbo, а также три варианта Reasoning Thinking для настройки глубины рассуждений. Всё как в привычных IDE — через / вызываются команды, есть вкладка с настройками, где можно гибко конфигурировать окружение под свою задачу. Интерфейс знакомый и удобный, разобраться можно за пару минут.
#zcode #glm #glm52 #zai #ide #aimodel #aitools #aicoding #gitgraph
Разбираю типичные ошибки при реализации Event Sourcing — про них вас тоже могут спросить на бэкенд-собеседовании. 1. Изменяемые события. События должны быть неизменяемыми — нельзя менять уже сохранённое событие. Если нужно что-то исправить, создавайте новое событие-компенсацию. 2. Бизнес-логика в apply(). Метод apply должен только восстанавливать состояние, а не содержать бизнес-правила или сайд-эффекты. Логика — в командах и обработчиках. 3. Event Sourcing для всего. Event Sourcing подходит только для бизнес-фактов (заказы, транзакции), а не для логов или временных данных. Применяйте выборочно. 4. Нет версионирования событий. Без версии нельзя менять структуру события и писать апкастеры. Старые события становятся нечитаемыми. 5. Долгий replay без снапшотов. Восстановление из тысяч событий занимает слишком много времени. Решение — периодически создавать снапшоты.
#eventsourcing #backend #backendinterview #designpatterns #codinginterview #softwarearchitecture #ошибки
В этом шортсе объясняю, почему план — это самое важное при работе с ИИ для кодинга. Показываю, как GLM-5.2 в ZCode составила план для сложной задачи — и он получился на уровне Opus, с той же глубиной проработки и логикой. При этом Opus потратил даже больше токенов. Но главное не это. Главное — когда у вас есть качественный план, вы можете переключиться на более дешёвую и быструю модель: с GLM-5.2 на GLM-5-Turbo или с Opus на Sonnet. Потому что после готового плана остаётся только написать код, а для этого не нужна самая мощная модель. Именно качественный план экономит токены, время и деньги.
#zcode #glm #glm52 #zai #claudeopus #claudecode #aimodel #aiagent #aitools #aicoding #planmode
Разбираю ключевые параметры настройки Circuit Breaker — про это вас точно спросят на бэкенд-собеседовании. failure threshold — количество ошибок, при котором Circuit Breaker переключается из Closed в Open. failureRate threshold — процент ошибок за определённый интервал времени. resetTimeout — время, сколько Circuit Breaker ждёт в состоянии Open перед переходом в Half-Open. slowCallDuration — время, после которого вызов считается медленным и помечается как ошибка. halfOpenMaxCalls — количество запросов, которое пропускается в полуоткрытом состоянии для проверки восстановления сервиса. Подбор этих параметров зависит от вашего внешнего сервиса, его надёжности и SLA. Про другие паттерны смотрите в полном видео — ссылка под шортсом.
#circuitbreaker #faulttolerance #backend #backendinterview #designpatterns #codinginterview #techinterview #softwarearchitecture #microservices
В этом шортсе разбираю свежие данные Artificial Analysis Intelligence Index, где GLM-5.2 показала отличные результаты по бенчмаркам. Модель занимает четвёртую строку в общем рейтинге, уступая только Fable 5, Opus и GPT-5.5 — серьёзные конкуренты, которые считаются лидерами рынка. Но самое интересное даже не в позиции, а в соотношении эффективности и затрат. У GLM-5.2 показатель cost per Intelligence Index task составляет всего 0.52 доллара, тогда как у Opus — 1.80 доллара. При этом Sonnet, который показывает более низкую производительность, всё равно имеет более высокий показатель cost per task. Получается, GLM-5.2 обходит Sonnet по бенчмаркам, но при этом дешевле в расчёте на задачу, а до топовых моделей уступает незначительно, хотя стоимость за задачу ниже в разы. Если ищете мощную модель с отличным соотношением цены и производительности — GLM-5.2 выглядит очень убедительно. Смотрите графики, сравнение и мои выводы в этом шортсе.
#ainews #aiindex #artificialanalysis #glm #glm52 #zai #aimodel #aiagent #aitools #aicoding
Разбираю частые вопросы с собеседования про Outbox Pattern. 1. Почему нельзя просто писать в БД и брокер? Потому что это две отдельные операции без атомарности — событие может уйти, а данные не сохраниться, или наоборот. 2. Чем Outbox отличается от Saga? Saga управляет распределёнными транзакциями через компенсирующие операции, а Outbox гарантирует надёжную отправку событий. 3. Что такое CDC? Change Data Capture — технология, которая читает лог транзакций БД и моментально реагирует на новые события. 4. Как обработать дубликаты? Нужна идемпотентность на стороне получателя: проверять, обрабатывалось ли уже это событие по уникальному идентификатору. 5. Когда очищать outbox? После успешной отправки события в брокер, но лучше удалять с задержкой или архивировать, чтобы в случае сбоя можно было восстановить. Ответы на все вопросы — в шортсе.
#backend #backendinterview #designpatterns #codinginterview #techinterview #softwarearchitecture #outboxpattern #microservices
В этом шортсе рассказываю про свежий релиз ZCode v3 — обновление, которое полностью переосмыслило работу с GLM-5.2. Новая версия заточена под мультиагентность и под выполнение длительных и сложных задач, которые требуют много шагов и контекста. ZCode v3 теперь основной и самый удобный инструмент для работы с GLM-5.2, но сам GLM-5.2 при этом не ограничивается только ZCode — через Z.ai/coding-helper модель легко подключается к Claude Code, OpenClaw, OpenCode и любым другим инструментам, которые вы уже используете. Поэтому если работаете с разными ИИ-решениями, переключаться не придётся — GLM-5.2 подстроится под ваш рабочий процесс. Ну и про тарифы: есть полноценная бесплатная версия для старта и три платных плана, которые расширяют лимиты, количество агентов и доступ к продвинутым функциям. А полный обзор GLM-5.2 и ZCode — смотри по ссылке под шортсом!
#ainews #glm #glm52 #zcode #zai #aiagent #aitools #codingassistant #aicoding
Разбираю, зачем в Event Sourcing нужны снэпшоты — про это вас точно спросят на бэкенд-собеседовании. В Event Sourcing мы храним все события агрегата. Чтобы восстановить текущее состояние, нужно переиграть все события с самого начала. Чем больше событий, тем дольше восстановление. Со временем это становится проблемой. Снэпшот решает эту боль: это сохранённое состояние агрегата на определённый момент времени. Вместо того чтобы переигрывать все события, вы берёте последний снэпшот и применяете только события, которые произошли после него. Это ускоряет восстановление в разы. Снэпшоты обычно создаются периодически — например, каждые 100 или 1000 событий. Хранить их можно в отдельной таблице или в том же Event Store. Минусы: нужно хранить сами снэпшоты и решать, как часто их создавать. Без снэпшотов система на больших объёмах данных становится нежизнеспособной.
#snapshot #eventsourcing #eventstore #backend #backendinterview #designpatterns #codinginterview #techinterview #softwarearchitecture