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

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

Многие люди с интересом относятся к истории. Читают книги, рассматривают архитектуру городов, смотрят фильмы времени наших родителей. Мне кажется, веб достиг периода, когда мы можем с интересом поговорить о прошлом HTML и CSS.

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

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

Представьте: вы настроили CronJob, протестировали локально и выкатили в продакшн. Всё работает как часы. А потом решили добавить отказоустойчивости и развернули приложение во втором дата‑центре. И внезапно ваша задача начала выполняться дважды. Это не баг Kubernetes, а фундаментальная проблема синхронизации.

Меня зовут Тимофей Салтымаков, я бэкенд‑разработчик в Точка Банк. В статье расскажу, как мы решили проблему дублирующихся CronJob'ов в распределённой системе. Прошли путь от advisory locks до собственной библиотеки, и в итоге поняли, что нужно перестать синхронизировать процессы и начать синхронизировать... время. Поехали!

Вот и наступила золотая осень!

В сентябре я каждый день почему-то вспоминал поговорку “от работы дохнут кони, ну а я бесмертный пони”. Сделано было просто куча всего! Новые релизы, библиотеки, крутые фичи, доклад на конференции. А еще наше сообщество сделало кучу интересных проектов в опенсорсе.

С меня как всегда статья без нейрослопа и ИИ, с вас как всегда интересные комментарии и лайки! А вот тут ссылка на прошлый дайджест за август.

Погнали смотреть, что у нас в питоне происходило!

Привет, Хабр! В первой статье я разбирал внутреннее устройство real-time-конвейера на C++20: почему медленный YOLO не должен останавливать RTSP и зачем между этапами нужны ограниченные слоты последнего значения. Теперь посмотрим на ту же систему с другой стороны — глазами пользователя, который подключает камеру и должен получить не просто видео с рамками, а управляемый и проверяемый результат.

Я покажу практический порядок настройки своей платформы видеоаналитики через браузерный JavaScript Viewer: от стабильного потока и детектора движения до постоянных ID, двух контуров YOLO и истории событий в PostgreSQL. Главный вопрос статьи — не «где находится кнопка», а «какой участок конвейера меняет этот параметр и как проверить эффект».

После моей статьи о рабочем месте репетитора в Chatwoot в комментариях закономерно спросили не о календаре и не о Jitsi, а о детали, которую я тогда почти не показал: как именно сообщения из MAX и VK попадают в Chatwoot и как ответ возвращается обратно.

Короткий ответ: это не скрапинг веб-версий и не автоматизация личных аккаунтов. MAX у меня подключён через официального бота, VK — через сообщения сообщества. Между ними и двумя API inbox в Chatwoot работает небольшой сервис на Node.js.

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

Вы тоже стали чаще замечать движущиеся светящиеся точки на небе? Небо ожило даже для простых наблюдателей с земли. Я разработчик со стажем 7+ лет, а в космической отрасли работаю около 3-х, и скажу вам, цифры меня самого пугают - 8 лет назад вокруг Земли работало примерно 1950 спутников. Сейчас их порядка 16 тысяч. А в месте с [отслеживаемым] мусором 47 тысяч.

Однако с ростом оживленности космоса, я не наблюдаю роста популярности этой темы. Ну да, летают какие то спутники, что тут такого интересного. Однако я заметил, что настоящий интерес может проявиться, когда есть возможность все это "пощупать". Сам то я уже щупал, есть ряд заграничных сайтов отображающих все спутники в околоземном пространстве, но все эти ресурсы сделаны для тех "кто в теме". Они научно скучные. Я загорелся идеей сделать такую визуализацию более доступной для широких масс. И вот тут начинается самое интересное - как это все визуализировать на экран, и как сделать так, чтобы человеку стало интересно.

В салонах красоты администраторы вручную обрабатывают записи клиентов к специалистам. Если сотрудник занят или отлучился, пропущенный звонок превращается в упущенную выручку.

В статье соберём решение, которое автоматически записывает клиентов к мастерам по телефону без участия персонала.

Для главной страницы я сделал минутное видео с четырьмя главами: можно посмотреть всё демо или сразу перейти к интересующей функции. Плеер работает на обычном HTML <video> и небольшом JS-контроллере, без сторонних библиотек.

Сам ролик удалось сжать с 38 до 1,8 МБ. Но для быстрой загрузки страницы этого оказалось недостаточно: пришлось уменьшить картинку-заставку и отложить запуск видео. В итоге при открытии страница загружает около 400 КБ вместо 3,1 МБ, а видео - уже после первого действия посетителя.

В статье покажу код плеера, команды FFmpeg и результаты замеров. Объясню, почему preload="metadata" не спасает при автоплее, зачем возвращать видео к началу главы при включении звука и как добавить разметку таймкодов для Google.

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

Поэтому у «Чатограммы» (это наш пет-проект) одно жёсткое правило: всё считается в браузере, и по умолчанию сервер не видит ни одного сообщения. Ниже — как это устроено технически, во что это обходится по скорости и где у правила есть исключения. Все цифры я замерил на днях, в том числе на своих настоящих переписках, а не только на синтетике.

Всем привет. На днях попалась информация интересная и захотелось разобраться в сервисе, которым пользуются миллионы людей – это Spotify.

На первый взгляд всё очень просто, нашли песню, нажали Play, музыка заиграла, но, если вспомнить, что за этим приложением стоят миллионы пользователей и миллионы треков, всё становится гораздо сложнее и интереснее.

Где физически лежит музыка? Почему один и тот же трек существует в нескольких версиях? Кто отправляет аудио пользователю? Почему Spotify не отдаёт весь файл через свой backend? Как музыка успевает загрузиться раньше, чем мы до неё дослушали? И откуда приложение знает, где мы остановились на другом устройстве?

Давайте разберёмся.

Привет, Хабр! Меня зовут Настя, я фронтенд-разработчик в OpenYard и занимаюсь веб-интерфейсом BMC (Baseboard Management Controller) — системы, через которую можно управлять сервером и следить за его состоянием.

Летом я сделал энциклопедию по истории искусства, artatlas.site. 184 картины, 107 художников, музеи, статьи, и все это на русском, английском, испанском и французском. Две с лишним тысячи HTML‑файлов. Код и тексты почти целиком писал ИИ (Claude Code), а я ставил задачи, ругался и проверял. Ругался, честно говоря, чаще чем проверял.

Lighthouse ставит доступности сотню, JSON‑LD валидный везде, где он есть. Google приводит 1,9 человека в день. Я посчитал, да.

Дальше — как так вышло. Местами смешно, местами не очень, местами до сих пор не очень.

В первой части я рассказывал, как мы дошли от обычного копирования кода между MODX и ChatGPT до нормального предметного интерфейса к CMS. Агент перестал видеть сайт как россыпь файлов и строк в базе и получил возможность работать с ресурсами, чанками, TV и зависимостями между ними. В какой-то момент этого стало достаточно, чтобы ставить задачу примерно так же, как я поставил бы её разработчику, без подробной инструкции, куда именно залезть и какую строку там поменять.

Следующий шаг напрашивался сам собой. Если агент уже разобрался в проблеме и нашёл решение, какого чёрта я должен брать его код, подключаться по SSH, делать резервную копию, заливать исправление, запускать проверки и потом ещё ходить по сайту смотреть, не отвалилось ли что-нибудь рядом. Хотелось просто написать «Посмотри, почему форма перестала отправляться, исправь и проверь» и получить в ответ не инструкцию из десяти пунктов, которые мне потом самому предстоит выполнить, а уже исправленный сайт.

Вот на этом месте и началась вторая часть нашего проекта. Сам доступ на запись дать оказалось совсем несложно. К MODX MCP добавились SSH, физические файлы, логи, браузер и несколько служебных инструментов. Гораздо больше времени ушло на то, чтобы после команды «исправляй» не сидеть у агента за спиной и не следить, что именно он там сейчас собирается натворить.

С искусственным интеллектом в веб-разработке мы работаем уже достаточно давно. На проектах с MODX 2 ChatGPT помогал искать ошибки, разбирать чужой код, писать сниппеты и компоненты, переделывать шаблоны. Польза была вполне практической, но сам процесс оставался традиционным. Нужно было найти нужный чанк, принести его в чат, объяснить, откуда берутся данные, показать TV-поля, получить исправленный код, вернуть его в MODX и проверить результат.

ИИ заметно ускорял написание кода, но разработчик при этом продолжал работать курьером между ИИ и сайтом. В какой-то момент мне захотелось убрать именно эту часть работы. Не дать ChatGPT полный SSH-доступ и посмотреть, что он там натворит, а сделать так, чтобы он сам видел структуру сайта примерно так же, как её видит разработчик MODX, ресурсы как ресурсы, чанки как чанки, TV как TV, а не просто как строки в таблицах базы данных.

Так из довольно простого желания перестать делать Ctrl+C, Ctrl+V между окнами родился эксперимент, который постепенно вырос в отдельный проект.

Решил сделать на Twitch шоу, где нельзя смеяться, с ИИ-распознованием эмоций. Рассказываю, как оно устроено внутри и с какими проблемами столкнулся.

Одновременный просмотр видео с друзьями без делея. Интеграция чтения эмоций в прямом эфире. Парсинг видео и топа комментариев, которые присылают в личку. Оверлеи и влияние зрителей на игру.

Первые цифры. Буду рад фидбеку.

Несколько лет назад мы решили заменить legacy e‑commerce‑платформу, которая продолжала работать и принимать заказы. Новый frontend построили на Next.js, backend — на Symfony, перед ними поставили Nginx. Но после запуска выяснилось, что самое интересное только начинается.

В статье разберу реальную production‑архитектуру: SSR, восемь процессов Next.js, несколько уровней кэширования, интеграции с внешними системами и проблемы актуальности данных. А главное — какие решения спустя несколько лет эксплуатации я бы спроектировал иначе.

Вы пишете приложение на Flutter. Модели уже описаны, бизнес-правила продуманы. Осталась небольшая деталь: сервер, который будет принимать запросы и работать с данными.

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

Dart позволяет написать обе стороны приложения. А Fletch предлагает довольно понятный способ сделать серверную: знакомые по Express маршруты, middleware, обработчики запросов и немного инфраструктуры, которую не хочется каждый раз собирать вручную.

Разберёмся, как это выглядит в коде, откуда берётся скорость и какие мелочи стоит заметить до первого деплоя.

Пентест WebAuthn быстро упирается в трафик, который Burp показывает почти как непрозрачный набор байтов: нужные поля скрыты за CBOR и несколькими слоями кодирования. Passkey Editor снимает эти обёртки, позволяет менять данные прямо в запросе и собирать их обратно так, чтобы сервер продолжал обрабатывать процедуру.

В статье речь пойдет о том, как устроен этот инструмент, какие проверки он автоматизирует и где на практике остаётся поверхность для атак на passkey-аутентификацию.

Привет, Хабр! На связи Егор Сапун, руководитель направления сертификации инфраструктуры Рег.облака.

Кибератаки касаются не только крупного бизнеса. За последний год с киберинцидентами столкнулись 82% российских компаний малого и среднего бизнеса. По данным Positive Technologies, в 2025 году 75% успешных атак на веб-приложения российских организаций приводили к нарушению их деятельности.

От части атак на сайты, веб-приложения и API защищает WAF. Но для многих компаний это все еще enterprise-решение: классический WAF необходимо развернуть в своей или арендованной инфраструктуре, встроить в путь трафика. Для этого нужны вычислительные ресурсы а также компетенции по настройке и сопровождению. У небольших компаний таких ресурсов может и не быть.

Один из способов снизить порог входа и упростить эксплуатацию — использовать облачный WAF, инфраструктурой которого занимается провайдер. 

Рассказываю, нужен ли для облачного WAF отдельный специалист, можно ли настроить защиту один раз и больше к ней не возвращаться и как выглядит весь путь подключения. А еще покажу, как бесплатно протестировать облачный WAF и объясню, почему это не панацея.

Всем привет!
Меня зовут Шатохин Дмитрий, я работаю в компании SM Lab старшим программистом 1С.

Выносим полнотекстовый поиск за пределы кластера 1С. Нечеткое соответствие, учет опечаток и регистра без нагрузки на сервер и СУБД основной базы.

Sku-search: кроссплатформенный сервис полнотекстового поиска для 1С — находит все по наименованию, артикулу, штрихкоду и любым реквизитам
Когда стандартный поиск 1С сдается, а Elasticsearch кажется пушкой по воробьям.

Знакомая боль?

Оператор в вашей 1С создает новую номенклатуру и вбивает «Болт М16 оцинк.». Система молчит. Он сохраняет — и в базе появляется дубль, потому что «Болт М16х60 оцинкованный ГОСТ 7798-70» уже существовал три года.

Или другой случай. Приходит прайс поставщика. В нем артикул ART-000002, в вашей 1С — тот же, но записан как Art-000002. На первый взгляд безобидно: строки в 1С по умолчанию сравниваются без учета регистра, и «в лоб» эти значения не отличить друг от друга. А для акцизных марок, марок Честного ЗНАКА, серийных номеров и артикулов, где регистр различает модификации, это ловушка: 1С выдает кучу ложных совпадений, а поиск «с учетом регистра» из стандартного запроса не настроить.