Zusammenfassungen in Chrome mit integrierter KI

Thomas Steiner

Veröffentlicht: 11. November 2024

Stellen Sie sich vor, Sie könnten Ihren Nutzern die Möglichkeit bieten, lange Artikel, komplexe Dokumente oder sogar lebhafte Chatunterhaltungen in prägnante und aussagekräftige Zusammenfassungen zu verdichten.

Mit der Summarizer API können Sie verschiedene Arten von Zusammenfassungen in unterschiedlichen Längen und Formaten generieren, z. B. Sätze, Absätze oder Aufzählungslisten. Wir sind der Meinung, dass diese API in folgenden Szenarien nützlich ist:

  • Die wichtigsten Punkte eines Artikels oder einer Chatunterhaltung zusammenfassen.
  • Titel und Überschriften für Artikel vorschlagen
  • Eine prägnante und informative Zusammenfassung eines langen Textes erstellen.
  • Einen Teaser für ein Buch basierend auf einer Buchrezension generieren

Verfügbarkeit

Einschränkungen während des Testzeitraums für den Ursprung

Während des Ursprungstests unterstützt die Summarizer API nur die Zusammenfassung englischer Texte, da die Modellqualität nur gründlich an englischen Inhalten getestet wurde. Wir möchten diese Einschränkung aufheben, sobald wir zusätzliche Sprachen auf Qualität und Sicherheit getestet haben und die API allgemein verfügbar ist.

Summarizer API verwenden

Führen Sie zuerst die Funktionserkennung aus, um zu prüfen, ob der Browser die Summarizer API unterstützt.

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

Modelldownload

Die Summarizer API verwendet ein leistungsstarkes KI-Modell, das speziell dafür trainiert wurde, qualitativ hochwertige Zusammenfassungen zu generieren. Die API ist zwar in Chrome integriert, das Modell wird jedoch separat heruntergeladen, wenn eine Website die API zum ersten Mal verwendet.

Wenn Sie feststellen möchten, ob das Modell einsatzbereit ist, rufen Sie die asynchrone ai.summarizer.capabilities()-Funktion auf. Es gibt ein AISummarizerCapabilities-Objekt mit einem available-Feld zurück, das drei mögliche Werte annehmen kann:

  • no: Der aktuelle Browser unterstützt die Summarizer API, sie kann aber derzeit nicht verwendet werden. Das kann verschiedene Gründe haben, z. B. nicht genügend Speicherplatz zum Herunterladen des Modells.
  • readily: Der aktuelle Browser unterstützt die Summarizer API und kann sofort verwendet werden.
  • after-download: Der aktuelle Browser unterstützt die Summarizer API, muss aber zuerst das Modell heruntergeladen werden.

Rufen Sie die asynchrone ai.summarizer.create()-Funktion auf, um den Modelldownload auszulösen und den Summarizer zu erstellen. Wenn die Antwort auf capabilities() after-download war, solltest du auf den Downloadfortschritt achten. So können Sie den Nutzer informieren, falls der Download etwas Zeit in Anspruch nimmt.

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

API-Funktionen

Mit der Funktion create() können Sie ein neues Summarizer-Objekt nach Ihren Anforderungen konfigurieren. Es nimmt ein optionales options-Objekt mit den folgenden Parametern an:

  • sharedContext: Zusätzlicher freigegebener Kontext, der dem Summarizer helfen kann.
  • type: Der Typ der Zusammenfassung mit den zulässigen Werten key-points (Standard), tl;dr, teaser und headline.
  • format: Das Format der Zusammenfassung mit den zulässigen Werten markdown (Standard) und plain-text.
  • length: Die Länge der Zusammenfassung. Zulässige Werte: short, medium (Standard) und long. Die Bedeutung dieser Längen variiert je nach angeforderter type. In Chrome besteht eine kurze Zusammenfassung der wichtigsten Punkte beispielsweise aus drei Aufzählungspunkten und eine kurze Zusammenfassung aus einem Satz. Eine lange Zusammenfassung der wichtigsten Punkte besteht aus sieben Aufzählungspunkten und eine lange Zusammenfassung aus einem Absatz.

Im folgenden Beispiel wird gezeigt, wie der Summer initialisiert wird.

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;
}

Summarizer ausführen

Es gibt zwei Möglichkeiten, den Summarizer auszuführen: Streaming und Nicht-Streaming.

Zusammenfassung ohne Streaming

Bei der nicht-streamingbasierten Zusammenfassung verarbeitet das Modell die Eingabe als Ganzes und generiert dann die Ausgabe.

Wenn Sie eine nicht gestreamte Zusammenfassung erhalten möchten, rufen Sie die asynchrone summarize()-Funktion des Summarizers auf. Das erste Argument für die Funktion ist der Text, den Sie zusammenfassen möchten. Das zweite, optionale Argument ist ein Objekt mit dem Feld context. In diesem Feld können Sie Hintergrunddetails hinzufügen, die die Zusammenfassung verbessern könnten.

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

Streaming-Zusammenfassung

Bei der Streaming-Zusammenfassung erhalten Sie Ergebnisse in Echtzeit. Die Ausgabe wird kontinuierlich aktualisiert, während die Eingabe hinzugefügt und angepasst wird.

Wenn Sie eine Streaming-Zusammenfassung abrufen möchten, rufen Sie die Funktion summarizeStreaming() des Summarizers auf. Gehen Sie dann die verfügbaren Textsegmente im Stream durch.

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() gibt eine ReadableStream zurück, bei der die Antwortsegmente aufeinander aufbauen. Das bedeutet, dass jede Antwort die gesamte bis zu diesem Zeitpunkt generierte Zusammenfassung enthält und nicht nur das nächste Segment, was nicht das beabsichtigte Verhalten ist.

Wir möchten uns an anderen Streaming-APIs auf der Plattform orientieren, bei denen die Segmente aufeinanderfolgende Teile eines einzigen langen Streams sind. Um das gewünschte Verhalten zu erzielen, können Sie vorerst Folgendes implementieren:

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);

Demo

Sie können die Summarizer API im Summarizer API Playground ausprobieren.

Standardisierungsaufwand

Wir arbeiten an der Standardisierung der Summarizer API, um die browserübergreifende Kompatibilität zu gewährleisten.

Unser API-Vorschlag hat Unterstützung von der Community erhalten und wird nun in der W3C Web Incubator Community Group weiter diskutiert. Das Chrome-Team hat Feedback von der W3C Technical Architecture Group angefordert und Mozilla und WebKit um ihre Positionierung zu den Standards gebeten.

Teilnehmen und Feedback geben

Sie können die Summarizer API jetzt testen, indem Sie am Ursprungstest teilnehmen und uns Feedback geben. Ihr Feedback kann sich direkt auf die Entwicklung und Implementierung zukünftiger Versionen dieser API und aller integrierten KI-APIs auswirken.