BS Decoder

Fonctionnement

• 📝 Récupération des sous-titres : extraction des pistes de sous-titres YouTube (texte + timing)
• 🤖 Réécriture par IA : les sous-titres sont envoyés à un LLM (via l'API Groq, compatible OpenAI) avec une consigne de réécriture humoristique
• 🎬 Synchronisation : le texte réécrit est réaffiché en overlay sur la vidéo, calé sur le timing d'origine
• 🔊 Lecture vocale (optionnelle) : le texte réécrit peut être lu à voix haute via l'API Web Speech du navigateur

Un choix d'architecture assumé : BYOK

Plutôt que de faire transiter les appels IA par un serveur, l'extension repose sur un modèle BYOK (Bring Your Own Key) : chaque utilisateur renseigne sa propre clé API Groq, gratuite à obtenir.

Une architecture avec clé privée côté serveur (avec authentification, gestion des quotas, tarification et paiements) serait nécessaire pour absorber une vraie base d'utilisateurs si le concept devait un jour être industrialisé. Mais pour un MVP de projet personnel, cette complexité n'avait pas lieu d'être : le BYOK évite toute gestion d'infrastructure, de facturation et de risque d'abus, tout en restant largement suffisant à cette échelle.

Préserver la structure sans sacrifier le sens

Le défi n'était pas d'obtenir une réécriture cohérente (le LLM comprenait déjà bien le sens global du discours) mais de conserver la structure exacte des segments de sous-titres dans la réponse, timing compris.

Un format JSON classique (liste de segments avec leur texte) s'est révélé peu fiable : le modèle avait tendance à s'écarter légèrement de la structure attendue, rendant le résultat difficile à reparser de façon robuste.

La solution a été de définir un langage de balisage personnalisé, expliqué explicitement au LLM dans le prompt, et de le forcer à le reproduire strictement en sortie. Cette contrainte de format, plus simple et plus prévisible à respecter pour le modèle qu'une structure JSON imbriquée, a permis d'obtenir une sortie fiable, découpée exactement comme l'entrée, tout en laissant au modèle la liberté de raisonner sur le sens global du texte avant de le redistribuer dans cette structure.

Utilisation de l'IA : accélérateur, sous contrôle

Au-delà du prompt engineering, l'IA (notamment via Copilot) a été un véritable accélérateur pour ce projet, pas seulement pour écrire du code, mais aussi pour structurer la réflexion en amont.

Cet usage s'est appuyé sur un arbitrage constant entre déléguer et vérifier :

• ✅ Délégué largement : l'UI/UX du MVP, un terrain où l'IA propose des solutions fiables, immédiatement vérifiables visuellement
• 🔍 Vérifié ou écrit à la main : tout ce qui touchait à des comportements d'environnement d'exécution difficilement reproductibles ou testables par l'IA seule (la persistance des états entre ouvertures/fermetures du popup, le comportement de récupération des sous-titres dans le contexte spécifique d'une page YouTube, la dépendance au comportement réel d'une API tierce, ou encore le cycle de vie de l'extension lors de la navigation au sein de la SPA YouTube)

Sur ces derniers points, l'IA proposait régulièrement des solutions plausibles mais fausses en pratique : elle n'a pas accès au comportement réel du DOM changeant de YouTube, ni au cycle de vie propre aux extensions Chrome. C'est là que l'expérimentation empirique (tester en conditions réelles, observer les comportements inattendus) est devenue indispensable, davantage que la simple relecture de code.

Obstacles techniques rencontrés

• 💬 Obtention des sous-titres originaux : YouTube ne permet pas un accès stable aux sous-titres via le DOM. Les sous-titres sont récupérés en interceptant la réponse de l'API youtube envoyée par la page, à l'aide d'une décoration sur la méthode window.fetch.
• 🔄 Cycle de vie du popup : un popup d'extension Chrome se détruit intégralement dès qu'il perd le focus, interrompant silencieusement tout traitement en cours (comme le chargement d'un modèle) → déplacement de la logique vers le background script et persistance des états dans le stockage de l'extension.
• 🔒 Content Security Policy (Manifest V3) : le chargement de scripts distants dans une page d'extension est strictement bloqué, rendant impossible l'intégration directe de l'API YouTube IFrame dans une fenêtre dédiée → a orienté l'architecture vers un content script injecté directement sur la page YouTube existante
• 📄 SPA et DOM asynchrone : synchronisation de l'état de l'extension avec la page actuelle dans le contexte d'une SPA

Bilan

BS Decoder m'a permis d'expérimenter concrètement un usage pragmatique de l'IA générative : non pas comme un pilote automatique, mais comme un accélérateur dont l'efficacité dépend directement de la façon dont on découpe les tâches et dont on choisit ce qu'on lui délègue.

Le projet a aussi été l'occasion de me confronter aux contraintes réelles des extensions Manifest V3 : CSP, cycle de vie du popup, comportement d'une SPA tierce. Des problèmes que l'IA seule ne pouvait ni anticiper ni résoudre sans une vérification empirique.

Au final, la vraie compétence développée ici n'est pas d'avoir utilisé un LLM, mais d'avoir su arbitrer entre ce qui pouvait lui être confié en confiance et ce qui exigeait un contrôle manuel rigoureux.