Веб-разработка *

Из-за ограничений мессенджеров в России многим приходится возвращаться к SMS-рассылкам. При этом в привычной воронке можно убрать целый этап: номер получателя уже есть в базе, поэтому незачем ждать, пока юзер повторно оставит его в форме на сайте.

Каждому номеру можно назначить персональную ссылку, чтобы по переходу определять, кто заинтересовался предложением, и передавать данные в CRM. Юзер продолжит изучать страницу, а его интерес уже будет зафиксирован. Даже если он закроет сайт, не заполнив заявку, лид не потеряется.

WebSocket принято считать очевидным выбором, когда сервер должен постоянно отправлять клиенту свежие данные. Но что произойдёт, если вместо обычного веб-приложения у нас SCADA, а клиентов становится 1000?

Был собран тестовый стенд с OpenPLC, Modbus TCP и ASP.NET Core. Сравнивались Short Polling, Long Polling и WebSocket при 1, 10, 30, 50, 100, 500 и 1000 одновременных клиентах.

В результате данные не только про задержку, но и про CPU, память, объём полезного трафика и количество новых TCP-соединений.

Недавно мне пришлось объяснять племяннику простейшее 2x + 4 = 10. Я уже собирался произнести школьное «переносим четвёрку вправо с противоположным знаком», но внезапно поймал себя на вопросе: а почему она вообще должна менять знак?

Если ребёнок воспринимает = как портал, через который числа проходят и магически меняют свойства, возможно, проблема не в математике, а в способе её объяснения.

Из этого вопроса вырос MathRoots — мой эксперимент с математикой как dependency graph: от ответа можно проваливаться вниз до операций, свойств и совсем фундаментальных понятий, искать root cause ошибки, визуализировать формулы и спрашивать у каждого шага: «Почему я вообще могу это сделать?»

В статье покажу, во что превратилось обычное 2x + 4 = 10, зачем математике debugger, причём тут AST и как всё это в итоге доросло до React, AI и Docker.

Атрибуты width и height сэкономят ресурсы CPU затрачиваемые на отрисовку страницы. Также они избавят от эффекта «скачущих изображений», когда во время загрузки страница резко дёргается, раздвигается, чтобы освободить место под под появляющиеся изображения.

Эта статья — актуализация статьи англоязычного автора 2020 года и её расширение с учётом последних обновлений браузеров. Также материал структурирован от простого к сложному с более наглядными примерами, чтобы было увлекательней читать. Внутри есть интерактивные примеры, которые можно исследовать самостоятельно в браузере с помощью профайлера браузера.

Начну со спорного решения: я храню в базе готовый HTML с Tailwind-классами.

Не Markdown, не JSON-схему блоков, а буквально это:

Привет, Хабр.

Я переживаю, когда вижу плохие интерфейсы. Мне не нравится, когда пользователю сложно или неудобно. У меня очень сильно подгорает от этого.

Вместо обычного ворчания я делюсь мыслями о том, как исправить ситуацию. Больше всего мне нравится показывать, что HTML и CSS могут помочь в этой задаче.

Я сделал такой выбор, потому что решения на основе этих технологий легко начать использовать или добавить в существующий проект. Даже не имеет значения, какой фреймворк используется.

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

А теперь давайте посмотрим, что я вам подготовил.

В вашей дизайн-системе могут быть особые требования к внешнему виду скроллбаров. К сожалению, нативные возможности стилизации весьма ограничены, поэтому, если вы сталкивались с подобными требованиями, единственный вариант — делать собственный компонент.

Для этого нам нужно решить несколько задач: понять, когда надо показывать ползунок, какого он должен быть размера и где находиться, обновлять положение при прокрутке и тому подобное.

Что, если я скажу вам, что в 2026 году JavaScript для всего этого нам больше не нужен?

Знакомый попросил ChatGPT написать интервальную тренировку одним HTML-файлом. В браузере всё пикает, но стоит погаснуть экрану — тишина. Разбираюсь, почему веб-страница не умеет будильник, и что с этим делать, если код вам написал чат.

Перевод интерфейса меняет текст, но сам по себе не создаёт отдельную языковую страницу. Один адрес /search/music может показать английский или русский интерфейс в зависимости от client state, cookie или настроек браузера. URL при этом остаётся тем же.

Для поисковой индексации языковые версии удобнее разделить адресами:

Это моя вторая статья. После первой я посмотрел на статистику и понял простую вещь: начинать издалека и пытаться рассказать сразу обо всём — плохая идея. Поэтому сейчас будет одна задача, один странный баг и одна строка, которая его исправила.

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

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

Классическая ситуация: компания ищет мидла на бэкенд, находит хорошего человека в Казахстане, договаривается о вилке, зовет бухгалтера оформлять. Бухгалтер спрашивает: он ИП или физлицо? Вроде, вопрос формальный. На деле от ответа зависит, будет ли проект стоить на 22% дороже.

Разбираем, откуда берутся эти 22%, почему НДФЛ с казахстанца платить не надо, но налоговым агентом вы все равно остаетесь, и какая формулировка в договоре превращает экономию в доначисление.

Дисклеймер: это не универсальный рецепт. Ситуации бывают разные, и решение под конкретный проект стоит согласовать с юристом. Дальше по тексту описан типовой случай: разработчик живет в Казахстане, физически там же и работает, в Россию не приезжает.

В нашем сервисе появились обращения, которые не складывались в картину: человек запрашивает сброс пароля, получает письмо, нажимает на ссылку и видит «ссылка недействительна или устарела». Запрашивает второй раз - то же самое. Пятый раз - то же самое.

Первое, что я проверил, - срок жизни токена. Срок - час, время на серверах синхронизировано, при генерации токен пишется в базу с отметкой времени, при переходе она сверяется. Всё сходилось. Потом я посмотрел не на создание токена, а на его использование, и увидел, что токен уже израсходован. Израсходован за несколько секунд до того, как пользователь вообще открыл письмо.

Что изменится, если плагин станет не дополнением, а основной единицей архитектуры приложения? На примере Cordis и DeepSeek Harness разберём, как среда композиции управляет зависимостями, эффектами и жизненным циклом компонентов.

Сравним три способа доставки клиентских плагинов: виртуальные модули в общем графе сборки, Module Federation и собственную модульную систему DSH. Сопоставим Cordis с микросервисами и Kubernetes, обсудим его ограничения и роль в разработке, которую ведут независимые команды и AI-агенты. Затронем также метатеорию, лежащую в основе Cordis, и спекулятивную архитектуру, в которой сама композиция приложения становится предметом эксперимента.

Статья будет полезна архитекторам, техлидам и JS/TS-разработчикам, которые проектируют модульные продукты, плагинные платформы или системы с динамически подключаемыми AI-компонентами.

В Angular проектах часто можно увидеть использование routed-компонентов, выполняющих оркестрирующую роль для своего роута. Они инжектят ActivatedRoute, достают из него параметры и по ним выполняют инициализацию с помощью доменных сервисов. Это кажется естественным и такой компонент принято считать smart container, «умным».

Но действительно ли ему необходимо знать про ActivatedRoute и про конкретный сервис?

В статье рассказываю, как с помощью фичи withComponentInputBinding и резолверов можно инвертировать зависимости для routed-компонентов и уменьшить их связанность.

Как получить бесплатный HTTPS сертификат от Минцифры для своего сайта на 365 дней. Смотрим, с какими сложностями предстоит столкнуться.

В конце марта 2026 года Figma открыла канвас для AI-агентов. Claude Code, Codex и подобные инструменты получили возможность создавать и редактировать макеты через MCP-сервер Figma.

Я решил проверить, насколько хорошо Claude Code сможет перенести дизайн сайтов в макет и сколько это будет стоить. Для этого я выбрал несколько лендингов и попросил агента перенести их на канвас - пробовал давать ему либо скриншот, либо ссылку на сайт. Каждый раз я смотрел, какие шаги выполняет агент, сколько раз обращается к инструментам и сколько токенов (то есть денег) тратит.

Практический разбор шести лет работы с автоматизированным трафиком: от первых поведенческих ботов и ручных правил Cloudflare до собственной многоуровневой системы фильтрации и кластерной аналитики.

Коллеги жаловались на дубли в базе пользователей: людей меньше, чем учётных записей, а откуда берётся расхождение - непонятно. Объяснилось оно одной строкой в коде, которая сравнивает адреса посимвольно.

В базе четыре учётные записи: Ivan.Petrov@gmail.com, ivanpetrov@gmail.com, ivan.petrov+shop@gmail.com, IVAN.PETROV@gmail.com. С точки зрения кода это четыре разных строки. С точки зрения почты - один и тот же ящик, все письма придут в одно место.

Дальше начинается интересное: акции «только для новых пользователей», лимиты на бесплатный период, «одна заявка на человека» - всё это обходится без единой уловки, просто точкой в адресе.

Какие обычно бывают анимации в вебе? Появление, исчезновение, небольшой сдвиг, масштабирование. Они не обязательно плохие: чаще всего интерфейсу действительно не нужно ничего сложнее. Иногда лучшее решение — вообще не добавлять анимацию. Так интерфейс остаётся быстрым, понятным и не отвлекает от основной задачи. Но иногда хочется сделать один небольшой момент запоминающимся. Не длинную заставку и не тяжёлый спецэффект на весь экран, а короткую реакцию на действие пользователя. Меньше секунды — и удаление карточки, появление элемента или отмена действия уже ощущаются совсем иначе.

Привет! Я Незар, фронтенд-разработчик в Т-Банке. Наш Angular-проект достаточно крупный, и со временем в нем накопился неиспользуемый код. Это замедляет разработку, усложняет рефакторинг и вводит в заблуждение новых членов команды. А ручная очистка такого «мертвого» кода требует огромных трудозатрат и быстро перестает быть эффективной.

Поэтому мы решили автоматизировать этот процесс с помощью Knip — статического анализатора для TypeScript. В статье я расскажу, как мы его настроили, интегрировали в pre‑commit и CI/CD и какие результаты получили.