BS Decoder

Как это работает

• 📝 Получение субтитров: извлечение дорожек субтитров YouTube, включая текст и временные метки
• 🤖 Переписывание с помощью ИИ: субтитры отправляются в LLM через API Groq, совместимый с OpenAI, с инструкцией переписать их в юмористическом стиле
• 🎬 Синхронизация: переписанный текст отображается поверх видео и синхронизируется с исходными временными метками
• 🔊 Озвучка (опционально): переписанный текст можно воспроизвести вслух с помощью Web Speech API браузера

Осознанный архитектурный выбор: BYOK

Вместо того чтобы пропускать запросы к ИИ через сервер, расширение использует модель BYOK (Bring Your Own Key): каждый пользователь указывает собственный API-ключ Groq, который можно получить бесплатно.

Архитектура с приватным ключом на стороне сервера, аутентификацией, управлением квотами, тарификацией и платежами была бы необходима для работы с реальной пользовательской базой, если бы концепцию когда-нибудь пришлось масштабировать. Но для MVP личного проекта такая сложность была бы неоправданной: BYOK избавляет от необходимости управлять инфраструктурой, биллингом и рисками злоупотреблений и при этом полностью подходит для такого масштаба.

Сохранить структуру, не жертвуя смыслом

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

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

Решением стало создание собственного языка разметки, который был явно описан LLM в промпте, с требованием строго воспроизводить его в ответе. Такое ограничение формата оказалось для модели проще и предсказуемее, чем вложенная JSON-структура. В результате удалось получать надёжный ответ, разбитый точно так же, как исходный текст, при этом модель сохраняла возможность рассуждать об общем смысле текста, прежде чем распределить его по заданной структуре.

Использование ИИ: ускоритель под контролем

Помимо prompt engineering, ИИ, в частности Copilot, стал настоящим ускорителем этого проекта. Он помогал не только писать код, но и структурировать размышления на этапе подготовки.

Такой подход основывался на постоянном балансе между делегированием и проверкой:

• ✅ Широко делегировалось: UI/UX MVP, область, в которой ИИ предлагает надёжные решения, которые можно сразу проверить визуально
• 🔍 Проверялось или писалось вручную: всё, что зависело от поведения среды выполнения, которое сложно воспроизвести или протестировать силами одного ИИ: сохранение состояния между открытиями и закрытиями popup, получение субтитров в специфическом контексте страницы YouTube, зависимость от реального поведения стороннего API, а также жизненный цикл расширения при навигации внутри SPA YouTube

В этих случаях ИИ регулярно предлагал правдоподобные, но на практике неверные решения: у него нет доступа к реальному поведению динамически изменяющегося DOM YouTube или к особенностям жизненного цикла Chrome-расширений. Именно поэтому эмпирическое тестирование, то есть проверка в реальных условиях и наблюдение за неожиданным поведением, стало необходимым. В этих ситуациях оно оказалось важнее простой проверки кода.

Технические сложности

• 💬 Получение исходных субтитров: YouTube не предоставляет стабильного доступа к субтитрам через DOM. Субтитры извлекаются путём перехвата ответа API YouTube, отправленного страницей, с помощью переопределения метода window.fetch.
• 🔄 Жизненный цикл popup: popup Chrome-расширения полностью уничтожается сразу после потери фокуса, что молча прерывает любой выполняющийся процесс, например загрузку модели → логика была перенесена в background script, а состояния стали сохраняться в хранилище расширения.
• 🔒 Content Security Policy (Manifest V3): загрузка удалённых скриптов на странице расширения строго запрещена, что делает невозможной прямую интеграцию YouTube IFrame API в отдельное окно → это привело к архитектуре с content script, внедряемым непосредственно в уже открытую страницу YouTube
• 📄 SPA и асинхронный DOM: синхронизация состояния расширения с текущей страницей в контексте SPA

Итоги

BS Decoder позволил мне на практике исследовать прагматичный подход к использованию генеративного ИИ: не как автопилота, а как ускорителя, эффективность которого напрямую зависит от того, как мы разбиваем задачи и что именно решаем ему делегировать.

Этот проект также дал возможность столкнуться с реальными ограничениями расширений Manifest V3: CSP, жизненным циклом popup и поведением сторонней SPA. Это проблемы, которые один только ИИ не мог ни предвидеть, ни решить без эмпирической проверки.

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