Resumos no Chrome com IA integrada

Thomas Steiner

Publicado em 11 de novembro de 2024

Imagine que você pudesse oferecer aos seus usuários a capacidade de resumir artigos longos, documentos complexos ou até mesmo conversas de chat animadas em resumos concisos e inteligentes.

A API Resumer pode ser usada para gerar diferentes tipos de resumos em tamanhos e formatos variados, como frases, parágrafos, listas de tópicos e muito mais. Acreditamos que essa API é útil nos seguintes cenários:

  • Resumir os pontos principais de um artigo ou de uma conversa no chat.
  • Sugerir títulos e cabeçalhos para artigos.
  • Criar um resumo conciso e informativo de um texto longo.
  • Gerar um teaser para um livro com base em uma resenha.

Disponibilidade

Limitações durante o teste de origem

Durante o teste de origem, a API Summarizer só oferece suporte à síntese de textos em inglês, porque a qualidade do modelo foi testada apenas em conteúdo em inglês. Pretendemos remover essa limitação depois de testarmos a qualidade e a segurança de outros idiomas e a API estiver amplamente disponível.

Usar a API Summarizer

Primeiro, execute a detecção de recursos para saber se o navegador oferece suporte à API Summarizer.

if ('ai' in self && 'summarizer' in self.ai) {
  // The Summarizer API is supported.
}

Download do modelo

A API Summarizer usa um modelo de IA poderoso treinado para gerar resumos de alta qualidade. Embora a API esteja integrada ao Chrome, o modelo é transferido por download separadamente na primeira vez que um site usa a API.

Para determinar se o modelo está pronto para uso, chame a função ai.summarizer.capabilities() assíncrona. Ele retorna um objeto AISummarizerCapabilities com um campo available que pode ter três valores possíveis:

  • no: o navegador atual oferece suporte à API Summarizer, mas ela não pode ser usada no momento. Isso pode acontecer por vários motivos, como espaço em disco insuficiente para fazer o download do modelo.
  • readily: o navegador atual oferece suporte à API Summarizer e pode ser usado imediatamente.
  • after-download: o navegador atual oferece suporte à API Summarizer, mas precisa fazer o download do modelo primeiro.

Para acionar o download do modelo e criar o resumidor, chame a função assíncrona ai.summarizer.create(). Se a resposta para capabilities() foi after-download, a prática recomendada é detectar o progresso do download. Dessa forma, é possível informar o usuário caso o download demore.

const summarizer = await ai.summarizer.create({
  monitor(m) {
    m.addEventListener('downloadprogress', (e) => {
      console.log(`Downloaded ${e.loaded} of ${e.total} bytes.`);
    });
  }
});

Funções da API

A função create() permite configurar um novo objeto de resumo de acordo com suas necessidades. Ele usa um objeto options opcional com os seguintes parâmetros:

  • sharedContext: contexto compartilhado adicional que pode ajudar o resumidor.
  • type: o tipo de resumo, com os valores permitidos key-points (padrão), tl;dr, teaser e headline.
  • format: o formato da síntese, com os valores permitidos markdown (padrão) e plain-text.
  • length: o comprimento da síntese, com os valores permitidos short, medium (padrão) e long. O significado desses comprimentos varia de acordo com o type solicitado. Por exemplo, na implementação do Chrome, um resumo curto de pontos-chave consiste em três marcadores, e um resumo curto é uma frase. Um resumo longo de pontos-chave tem sete marcadores, e um resumo longo é um parágrafo.

O exemplo a seguir demonstra como inicializar o resumidor.

const options = {
  sharedContext: 'This is a scientific article',
  type: 'key-points',
  format: 'markdown',
  length: 'medium',
};

const available = (await self.ai.summarizer.capabilities()).available;
let summarizer;
if (available === 'no') {
  // The Summarizer API isn't usable.
  return;
}
if (available === 'readily') {
  // The Summarizer API can be used immediately .
  summarizer = await self.ai.summarizer.create(options);
} else {
  // The Summarizer API can be used after the model is downloaded.
  summarizer = await self.ai.summarizer.create(options);
  summarizer.addEventListener('downloadprogress', (e) => {
    console.log(e.loaded, e.total);
  });
  await summarizer.ready;
}

Executar o resumo

Há duas maneiras de executar o resumidor: com ou sem streaming.

Resumo sem streaming

Com a síntese sem streaming, o modelo processa a entrada como um todo e produz a saída.

Para receber um resumo sem streaming, chame a função summarize() assíncrona do resumidor. O primeiro argumento da função é o texto que você quer resumir. O segundo argumento opcional é um objeto com um campo context. Esse campo permite adicionar detalhes de contexto que podem melhorar a síntese.

const longText = document.querySelector('article').innerHTML;
const summary = await summarizer.summarize(longText, {
  context: 'This article is intended for a tech-savvy audience.',
});

Resumo de streaming

O resumo de streaming oferece resultados em tempo real. A saída é atualizada continuamente à medida que a entrada é adicionada e ajustada.

Para conferir um resumo do streaming, chame a função summarizeStreaming() do resumidor. Em seguida, itere os segmentos de texto disponíveis no fluxo.

let result = '';
let previousChunk = '';
for await (const chunk of stream) {
  const newChunk = chunk.startsWith(previousChunk)
      ? chunk.slice(previousChunk.length) : chunk;
  console.log(newChunk);
  result += newChunk;
  previousChunk = chunk;
}
console.log(result);

summarizeStreaming() retorna um ReadableStream, em que os segmentos de resposta são criados sucessivamente uns sobre os outros. Isso significa que cada resposta contém o resumo completo gerado até aquele ponto, não apenas o próximo segmento, que não é o comportamento pretendido.

Pretendemos nos alinhar a outras APIs de streaming na plataforma, em que os segmentos são partes sucessivas de um único stream longo. Por enquanto, para alcançar o comportamento desejado, implemente o seguinte:

let result = '';
let previousLength = 0;
for await (const segment of stream) {
  const newContent = segment.slice(previousLength);
  console.log(newContent);
  previousLength = segment.length;  
  result += newContent;
}
console.log(result);

Demonstração

Teste a API Resumer no Playground da API Resumer.

Esforço de padronização

Estamos trabalhando para padronizar a API Summarizer e garantir a compatibilidade entre navegadores.

Nossa proposta de API recebeu apoio da comunidade e foi transferida para o Grupo da comunidade do Incubator da Web do W3C para mais discussões. A equipe do Chrome solicitou feedback do W3C Technical Architecture Group e pediu a Mozilla e ao WebKit as posições dos padrões.

Participar e compartilhar feedback

Comece a testar a API Summarizer agora mesmo participando do teste de origem e compartilhe seu feedback. Sua contribuição pode afetar diretamente a forma como criamos e implementamos versões futuras dessa API e de todas as APIs de IA integradas.