L'automatisation des tâches web a franchi une nouvelle étape avec l'émergence des agents autonomes basés sur les modèles de langage (LLM). Nanobrowser se positionne comme une extension Chrome open-source permettant de piloter des workflows complexes directement depuis le navigateur. En utilisant vos propres clés API, cet outil transforme les interactions manuelles répétitives en processus intelligents et sécurisés.
Architecture du système multi-agent
Le fonctionnement de Nanobrowser repose sur une séparation des responsabilités entre deux types d'agents spécialisés, garantissant une meilleure précision dans l'exécution des tâches.
Le Planificateur (Planner)
- Rôle : Analyse l'intention de l'utilisateur et décompose la requête en étapes logiques.
- Modèles recommandés : GPT-4o ou Claude 3.5 Sonnet pour leur capacité de raisonnement abstrait.
- Fonction : Il définit la stratégie globale sans interagir directement avec le DOM.
Le Navigateur (Navigator)
- Rôle : Exécute les actions techniques sur la page web (clics, saisie de texte, défilement).
- Modèles recommandés : GPT-4o-mini ou Claude 3 Haiku pour leur rapidité et leur coût réduit.
- Fonction : Il traduit les instructions du planificateur en événements de navigation réels.
Installation et configuration technique
L'installation peut s'effectuer via le Chrome Web Store ou manuellement pour les développeurs souhaitant accéder aux dernières fonctionnalités expérimentales.
Déploiement via les sources
Pour compiler l'extension localement, utilisez les commandes suivantes dans votre terminal :
# Clonage du dépôt source
git clone https://github.com/GitHub_Trending/na/nanobrowser
cd nanobrowser
# Installation des dépendances et compilation
pnpm install
pnpm run build:production
Une fois la compilation terminée, chargez le dossier dist dans l'onglet des extensions de Chrome en activant le "Mode développeur".
Configuration des moteurs d'IA
L'extension supporte plusieurs fournisseurs de modèles. La configuration s'effectue dans le panneau des paramètres en renseignant les clés API respectives :
- OpenAI : Pour l'accès à la famille GPT.
- Anthropic : Pour les modèles Claude.
- Google Gemini : Pour l'intégration des modèles Pro et Flash.
- Endpoints personnalisés : Compatible avec les services respectant le format d'API OpenAI.
Cas pratique : Extraction automatisée de données
Prenons l'exemple d'une veille technologique automatisée sur GitHub pour extraire les dépôts en tendance.
Processus d'exécution
- L'utilisateur soumet la requête : "Récupère les 5 premiers dépôts en tendance aujourd'hui".
- Le Planificateur identifie l'URL cible et la structure des données à extraire.
- Le Navigateur se rend sur la page, identifie les sélecteurs CSS et capture les informations.
- Le système compile les données dans un format structuré.
Structure des données de sortie
{
"scraped_at": "2023-10-27T10:00:00Z",
"results": [
{
"repo_title": "Nom du projet",
"stargazers_count": "Nombre d'étoiles",
"summary": "Description du dépôt"
}
]
}
Comparatif : Manuel vs Automatisé
| Critère | Navigation Traditionnelle | Automatisation Nanobrowser |
|---|---|---|
| Exécution | Manuelle et séquentielle | Parallélisée et pilotée par IA |
| Gestion des erreurs | Dépend de l'attention humaine | Auto-correction via feedback LLM |
| Disponibilité | Limitée au temps de l'utilisateur | Opérationnelle 24/7 via scripts |
| Confidentialité | Variable selon les outils tiers | Locale (les clés restent dans l'extension) |
Optimisation des performances et sécurité
Pour maximiser l'efficacité de vos automatisations, il est conseillé de suivre ces directives techniques :
- Ingénierie de prompt : Soyez spécifique dans les instructions. Au lieu de "Cherche des infos", utilisez "Extrais le prix et la disponibilité du produit X sur la page active".
- Sécurité des API : Vos clés API sont stockées localement dans le stockage synchronisé de votre navigateur. Aucune donnée de navigation n'est transmise à des serveurs tiers, hormis les prompts envoyés au fournisseur de LLM choisi.
- Limitation des coûts : Pour les tâches de navigation simples, privilégiez des modèles plus légers (Haiku ou GPT-4o-mini) afin de réduire la consommation de jetons (tokens).
Fonctionnalités avancées pour les développeurs
Nanobrowser permet également de créer des workflows personnalisés enchaînant plusieurs domaines :
- Monitoring : Surveillance de changements de prix ou de mises à jour de contenu avec alertes.
- Intégration Webhook : Possibilité d'envoyer les résultats extraits vers des outils tiers comme Google Sheets ou une base de données SQL via des points de terminaison API.
- Scripts planifiés : Automatisation de la collecte de données à intervalles réguliers.