L'API Summarizer aiuta Bright Sites e Terra a creare riepiloghi degli articoli coinvolgenti

Mari Viana
Mari Viana
LinkedIn
Thierno Thiam

Data di pubblicazione: 15 maggio 2025

Il pubblico si affida agli editori di notizie per essere informato su eventi locali, nazionali e internazionali, nonché per condividere i loro punti di vista ponderati. Nell'ambiente frenetico di oggi, i riepiloghi degli articoli sono una strategia chiave per condensare informazioni complesse in snippet accessibili, incoraggiando i lettori a esplorare ulteriormente. Scopri in che modo Bright Sites e Terra approcciano questa strategia utilizzando l'API Summarizer.

SpiegazioneWebEstensioni Stato di ChromeIntenzione
MDN Chrome 138 Chrome 138 Visualizza Intenzione di spedizione

L'API Summarizer consente di generare diversi tipi di riassunti in varie lunghezze e formati, ad esempio frasi, paragrafi, elenchi puntati e altro ancora. Questa API, come molte delle API AI integrate, utilizza modelli linguistici di grandi dimensioni per eseguire l'inferenza.

Bright Sites aggiunge riepiloghi personalizzati degli articoli a The Standard

Bright Sites, la principale piattaforma di pubblicazione di notizie, Flow, alimenta oltre 150 pubblicazioni. Integrando l'API Summarizer nel suo CMS basato sull'AI, Bright Sites consente a The Standard, l'iconico brand di notizie di Londra, di offrire ai suoi lettori riassunti personalizzati degli articoli. In questo modo, gli utenti sono incoraggiati a interagire con gli articoli e a ricircolare ad altri articoli su The Standard.

"Lavorare con i modelli all'avanguardia di Gemini in Chrome unisce i 198 anni di storia di The Standard, che ha sempre tenuto informati i suoi lettori, alle nuove innovazioni tecniche per il nostro pubblico impegnato che apprezza la possibilità di avere a portata di mano il nostro giornalismo affidabile. Consentire ai lettori di controllare rapidamente le notizie utilizzando riepiloghi creati sui propri dispositivi è solo uno dei modi in cui stiamo reinventando The Standard e creando nuovi prodotti incentrati sui lettori in base alle loro abitudini digitali".

— Jack Riley, Chief Digital Officer, The Standard

L'offerta di riepiloghi basati sull'AI lato client ha consentito a The Standard di generare riepiloghi personalizzati senza costi aziendali aggiuntivi. In questo modo, l'elaborazione lato client, utilizzando punti dati come lo stile del riepilogo o la posizione, consentirebbe agli utenti di continuare a leggere anche quando perdono l'accesso a internet. Si tratta di un evento frequente per molti utenti che viaggiano sulla metropolitana di Londra con il proprio laptop.

Innanzitutto, controllano il supporto e la disponibilità del modello e dell'API.

// Check if the device supports built-in AI
// Trigger the model download if not yet available, on capable devices
export const deviceCheck = async () => {
  const availability = await Summarizer.availability();
  if (!availability || availability === 'unavailable') {
    return {
      summarizationAvailable: false,
      message:
        "AI summarization tools are not supported on this device" +
        "or the appropriate permissions are not set.",
    }
  }
  if (availability === 'downloadable') {
    const shouldDownload = window.confirm(
      `This page contains an AI summary, using an AI model provided by your
      browser. Downloading the model, which could be multiple gigabytes in size,
      is required to view the summary. Would you like to download the model?`);

    if (!shouldDownload) {
      return {
        summarizationAvailable: false,
        message: "User declined installation.",
      }
    }

    // Trigger an installation
    Summarizer.create();
    return {
      summarizationAvailable: false,
      message: "Installing in the background. This may take a few minutes...",
    }
  }

  if (availability === 'available') {
    return {
      summarizationAvailable: true,
      message: "Ready for use.",
    }
  }
}

La seguente funzione definisce un riepilogatore generico che, in futuro, potrebbe utilizzare un altro modello on-device o un modello lato server.

/**
* Define the summarizer.
**/
export const aiSummarize = async (textToSummarize, options) => {
  const availableSummarizationTools = getAvailableAiSummarizationTools()

  if (availableSummarizationTools.has('builtInAi') && options?.builtInAI) {
    // Generate the built-in AI summarizer and abort signal
    const summarizer = await createBuiltInAISummarizer(options.builtInAi.options)
    return await summarizer.summarize(textToSummarize, {
      signal: options.builtInAi.signal,
    })
  }
  throw new Error(
    'AI summarization tools are not supported on this device or browser.',
  )
}

Lo standard memorizza la preferenza di riepilogo dei lettori in IndexedDB per offrire un riepilogo personalizzato.

/**
* Log preferences in IndexDB for personalization
**/
abortController.current = new AbortController()
const preferencesDB = new PreferencesDB()
const summarization = await aiSummarize(articleContent, {
 clientSideAI: {
   options: await preferencesDB.getCreatesummarizerPreferences(),
   signal: abortController.current.signal,
 },
})

Terra fornisce ai giornalisti un riepilogo modificabile degli articoli in portoghese

Terra è uno dei più grandi portali di contenuti del Brasile, che offre intrattenimento, notizie e sport con oltre 50 milioni di visitatori unici al mese. Terra ha aggiunto l'API Summarizer e l'API Translator al proprio sistema di gestione dei contenuti (CMS) per aiutare i giornalisti a riassumere istantaneamente le notizie in portoghese. I giornalisti possono quindi apportare alcune modifiche per motivi stilistici o di accuratezza e pubblicare il riepilogo creato in collaborazione, rendendolo facilmente disponibile a tutti i lettori.

Sebbene il CMS di Terra utilizzi già un LLM lato server, il team ha esplorato l'IA lato client come approccio distinto con potenziali nuovi vantaggi. Hanno scoperto che l'API Summarizer in Chrome offre una qualità paragonabile alla loro implementazione lato server. La soluzione lato client ha dato risultati positivi se utilizzata in combinazione con l'API Translator.

Terra ha adottato l'implementazione dell'AI integrata di Chrome per i suoi vantaggi chiave. L'AI lato client ha offerto risparmi sui costi e una governance dei dati semplificata. Il team ha riscontrato alcune difficoltà, in particolare per quanto riguarda la gestione delle limitazioni della finestra dei contenuti con l'API Summarizer, ma è riuscito a superarle grazie a pratiche di implementazione attente.

Inizialmente, Terra ha avuto difficoltà a determinare quali tipi di riepilogo e contesto condiviso fossero più adatti a soddisfare le sue esigenze. Grazie alla sperimentazione, hanno scoperto che riassunti chiari e utili in inglese erano fondamentali per produrre un output di qualità simile in portoghese con l'API Translator. Il playground AI integrato è stato fondamentale per superare queste sfide, in quanto Terra poteva testare rapidamente le proprie idee senza dover eseguire il refactoring del codice ogni volta.

L'esempio seguente mostra come Terra richiama l'API Summarizer e avvisa gli utenti quando non è disponibile.

async function summarizerByBuiltInAI(text) {
  if (!(Summarizer)) {
    //Alert users in Portuguese that "Summarizer API is not available"
    cms_alert(ALERT_TYPE_ERROR, "Summarizer API não está disponível.")
    return null
  }

  try {
    const availability = await Summarizer.availability();
    if (availability !== 'available') {
      cms_alert(ALERT_TYPE_ERROR, "Summarizer API não está disponível.")
      return null 
    }

    const summaryContext = "Avoid jargon, use correct grammar, focus on clarity," +
    "and ensure the user can grasp the articles purpose," +
    "without needing to open the original content.";

    const options = {
      sharedContext: summaryContext,
      type: 'teaser',
      format: 'plain-text',
      length: 'long',
    }

    if (availability === 'available') {
      const summarizer = await Summarizer.create(options);
      return await summarizer.summarize(text, {
        context: summaryContext
      })
    }
    // return the download of the Summarizer Model
    if(availability === 'downloadable'){
      return await Summarizer.create();
    }
  } catch (error) {
    //EN: "Error using the Summarizer API"
    cms_alert(ALERT_TYPE_ERROR, "Erro ao usar o Summarizer API.");
    console.error("Erro ao usar o Summarizer API:", error);
    return null
  }
}

Inoltre, Terra ha utilizzato il riepilogatore insieme all'API Translator per tradurre in inglese il titolo, il sottotitolo e il corpo del testo dell'articolo originale in portoghese. Questa versione tradotta viene elaborata dall'API Summarizer per generare il riepilogo, che viene poi tradotto di nuovo in portoghese. In questo modo, l'utente riceve i contenuti riepilogati nella lingua dell'applicazione.

async function translateTextByBuiltInAI(text, sourceLanguage, targetLanguage) {
  if (!('translation' in self && 'createTranslator' in self.translation)) {
    return null
  }

  try {
    const translator = await Translator.create({
      sourceLanguage,
      targetLanguage,
    })
    return await translator.translate(text)
  } catch (error) {
    throw error
  }
}
const text = `Title: ${contentTitle};\n\n Sub-title: ${contentSubtitle};\n\n Article content: ${plainText}.`;

const canTranslate = await Translator.availability({
  sourceLanguage: 'pt',
  targetLanguage: 'en',
})

if (canTranslate !== 'available') {
  if (canTranslate === 'downloadable') {
    try {
      await Translator.create({
        sourceLanguage: 'pt',
        targetLanguage: 'en',
      })
      //EN: "Language download completed successfully."
      cms_alert(ALERT_TYPE_OK, "Download do idioma concluído com sucesso.");
    } catch (downloadError) {
      //EN: "Error downloading the language required for translation."
      cms_alert(ALERT_TYPE_ERROR, "Erro ao realizar download do idioma necessário para tradução.");
      return
    }
  } else {
    //EN: "Translation is not available or not ready."
    cms_alert(ALERT_TYPE_ERROR, "A tradução não está disponível ou não está pronta.");
    return
  }
}

const translatedText = await translateTextByBuiltInAI(text, 'pt', 'en') 
const summarizedText = await summarizerByBuiltInAI(translatedText) 
const translatedBackText = await translateTextByBuiltInAI(summarizedText, 'en', 'pt')

L'integrazione riuscita delle API AI integrate in Terra dimostra il potenziale significativo dell'AI lato client per migliorare i flussi di lavoro di gestione dei contenuti. Con le API Summarizer e Translator, Terra ha potenziato i suoi giornalisti, migliorato l'efficienza ed è ben posizionata per offrire esperienze utente migliorate su tutte le piattaforme.

Best practice

Se l'input della recensione supera il limite di token, segui queste mitigazioni:

  • Utilizza un campione più piccolo (ad esempio le 4 recensioni più recenti) per l'API. In questo modo i risultati vengono generati più rapidamente. Consulta le nostre indicazioni su come scalare il riepilogo lato client.
  • QuotaExceededError fornisce maggiori informazioni sui token richiesti nell'input. L'oggetto summarizer ha una proprietà inputQuota che indica il limite di token dell'API. Ciò consente di fornire feedback in tempo reale e di disattivare la funzionalità se l'input supera il limite.

Ti consigliamo di prendere in considerazione un approccio ibrido per garantire un'esperienza fluida per tutti gli utenti. La prima volta che viene chiamata un'API AI integrata, il browser deve scaricare il modello.

  • Miravia ha utilizzato un modello lato server per fornire un riepilogo iniziale durante il download del modello. Una volta pronto il modello integrato, il sito è passato all'esecuzione dell'inferenza lato client.

Dovresti sempre impegnarti a creare un'interfaccia amichevole e comunicativa:

  • Implementa una barra di avanzamento per i download dei modelli e riduci i ritardi nelle risposte.
  • Valuta la trasparenza del download del modello. Bright Sites ha inviato una notifica agli utenti in merito al download del modello per consentire la trasparenza e il consenso all'utilizzo delle risorse. In questo modo, gli utenti possono accettare o rifiutare prima di procedere.

Conclusioni e suggerimenti

Gli esempi di Bright Sites e Terra dimostrano il valore dell'API Summarizer nel migliorare l'accessibilità dei contenuti e il coinvolgimento dei lettori. Utilizzando questa API lato client, queste piattaforme hanno migliorato l'esperienza di lettura e la personalizzazione, senza costi aziendali aggiuntivi e con una governance dei dati semplificata. Come l'API Summarizer, tutte le API AI integrate consentono l'AI pratica lato client.

Ti stai chiedendo in che modo l'API Summarizer può essere utile in altri casi d'uso? Abbiamo anche spiegato come l'API Summarizer aiuta redBus e Miravia a creare utili riepiloghi delle recensioni degli utenti.

Stai creando qualcosa di nuovo con queste API? Condividilo con noi su @ChromiumDev su X o Chromium for Developers su LinkedIn.

Risorse

Ringraziamenti

Grazie a Guilherme Moser e Fernando Fischer di Terra, Aline Souza di CWI, Brian Alford, Keval Patel, Jack Riley e al team di ingegneria di Brightsites, Swetha Gopalakrishnan, Alexandra Klepper, Thomas Steiner e Kenji Baheux per aver contribuito alla stesura e alla revisione di questo documento.