Créer des fonctionnalités à l'aide de l'IA intégrée à Chrome

Thomas Steiner

Publié le : 26 mai 2026

Cet article est un résumé de la conférence donnée par Thomas Steiner lors de Google I/O 2026.

Imaginez que vous créez un blog de voyage où l'éditeur d'articles ne se contente pas de stocker le texte, mais vous aide activement à écrire. Découvrez Maya et Ashok, les créateurs de trAIlblazers. Ils utilisent l'IA intégrée à Chrome. En exécutant des modèles directement sur l'appareil de l'utilisateur, les développeurs évitent les coûts et la latence élevés du cloud tout en conservant les données sensibles en local.

Nous avons collaboré avec Build Awesome (anciennement Eleventy) pour publier un modèle de blog avec toutes les fonctionnalités d'IA listées dans la conférence.

Pourquoi l'IA intégrée ?

  • Rentabilité : aucun coût d'inférence cloud, tous les calculs sont effectués sur les appareils compatibles des utilisateurs.
  • Confidentialité avant tout : les données sensibles ne quittent jamais le navigateur.
  • Disponibilité hors connexion : une fois le modèle téléchargé, les fonctionnalités d'IA fonctionnent sans connexion Internet.
  • Performances : l'accélération matérielle permet aux modèles sur l'appareil de rivaliser (et parfois de dépasser) avec les vitesses du cloud.
  • Inférence hybride : à l'aide de polyfills et d'outils tels que Firebase AI Logic, vous pouvez revenir au cloud sur les appareils non compatibles (comme les appareils mobiles) tout en restant natif sur les ordinateurs.

Fonctionnalités d'IA pour les applications Web modernes

API Summarizer

L'éditeur trAIlblazers utilise l'API Summarizer pour générer automatiquement des titres et des méta-descriptions adaptées au SEO.

Exemple : Générer un titre

const blogPost = document.querySelector('.article-body').innerText;
const summarizer = await Summarizer.create({
  type: 'headline',
  sharedContext: 'Write headlines that make people want to read the blog post',
});

for await (const chunk of summarizer.summarizeStreaming(blogPost)) {
  headline.append(chunk);
}

API Prompt (avec sortie structurée)

Vous avez besoin de données spécifiques ? En utilisant JSON Schema avec l'API Prompt, vous pouvez faire en sorte que l'IA renvoie des formats prévisibles. L'équipe trAIlblazers l'utilise pour les éléments suivants :

  • Génération de tags : suggère des catégories telles que "Aventure" ou "Plage" à partir d'une liste prédéfinie.
  • Modération des commentaires : classez les commentaires comme "Acceptables" ou "Nuisibles" avant leur publication.

Accessibilité des contenus multimédias

L'éditeur automatise les "parties difficiles" de Markdown. Lorsque vous déposez une image, l'API Prompt (avec entrée multimodale) analyse les pixels pour générer un texte alternatif accessible et des légendes informatives.

Écrire et réécrire

Grâce aux API Writer et Rewriter, les utilisateurs peuvent développer des puces en paragraphes complets et modifier le ton d'un paragraphe pour le rendre "plus décontracté" ou "plus court" en un seul clic.

Traduction fluide

L'API Translator permet aux créateurs de rédiger du contenu en anglais et de le traduire instantanément pour les lecteurs hispanophones ou japonais, que les locuteurs natifs peuvent ensuite affiner.

Exemple de fonctionnement de l'API Translator.
Rédigez du contenu avec l'API Translator en anglais, puis traduisez-le instantanément en espagnol et en japonais.

Témoignages de réussite

De nombreux partenaires ont déjà déployé ces API en production. Voici quelques exemples notables :

  • Drupal : utilise l'API Summarizer pour générer des balises de référencement dans CKEditor.
  • Yahoo! Japon : utilise l'API Prompt pour la modération des commentaires de la communauté.
  • Trip.com: : aide les acheteurs à s'y retrouver dans les options de réservation de vols complexes grâce à des résumés générés par l'IA.

Ressources de la conférence

Prêt à créer votre propre expérience "trAIlblazers" ? Consultez les ressources suivantes :