Chrome の組み込み AI の Summarization API を試してみる

(await ai.assistant.capabilities()).available;

(await ai.summarizer.capabilities()).available;
// "readily" が表示されれば利用可能
// "after-download" が表示されればダウンロードが完了するまで待機
// "no" が表示されれば利用不可

const summarizer = await ai.summarizer.create();
const text =
  "JavaScript (JS) is a lightweight interpreted (or just-in-time compiled) programming language with first-class functions. While it is most well-known as the scripting language for Web pages, many non-browser environments also use it, such as Node.js, Apache CouchDB and Adobe Acrobat. JavaScript is a prototype-based, multi-paradigm, single-threaded, dynamic language, supporting object-oriented, imperative, and declarative (e.g. functional programming) styles.";
 
const result = await summarizer.summarize(text);
console.log(result);

* JavaScript is a scripting language known for its lightweight nature and interpreter/just-in-time compiler capabilities.
* Widely used on websites, JavaScript is also employed in environments like Node.js, Apache CouchDB, and Adobe Acrobat.
* JavaScript is a prototype-based, multiparadigm, single-threaded, dynamic language supporting object-oriented, imperative, and declarative programming styles.

const summarizer = await ai.summarizer.create({
  sharedContext: "An article from Web front-end development blog",
  // "tl;dr", "key-points", "teaser", "headline"
  type: "headline",
  // "plain-text", "markdown"
  format: "plan-text",
  // "short", "medium", "long"
  length: "short",
});

const summarizer = await ai.summarizer.create({
  sharedContext: "An article from Web front-end development blog",
  type: "headline",
  length: "short",
});
const text =
  "JavaScript (JS) is a lightweight interpreted (or just-in-time compiled) programming language with first-class functions. While it is most well-known as the scripting language for Web pages, many non-browser environments also use it, such as Node.js, Apache CouchDB and Adobe Acrobat. JavaScript is a prototype-based, multi-paradigm, single-threaded, dynamic language, supporting object-oriented, imperative, and declarative (e.g. functional programming) styles.";
 
const result = await summarizer.summarize(text);
console.log(result);
// JavaScript is a versatile programming language used for web development and beyond.

const summarizer = await ai.summarizer.create({
  sharedContext: "An article from Web front-end development blog",
  type: "headline",
  length: "short",
});
 
const result = await summarizer.summarize(text, {
  context: "This article was written by a web developer.",
});

const canSummarize = await ai.summarizer.capabilities();
 
// "no" の場合は利用不可
if (canSummarize.available === "no") {
  console.log("Summarization API is not available.");
  return;
}
 
const summarizer = await ai.summarizer.create();
if (canSummarize.available === "after-download") {
  summarizer.addEventListener("downloadprogress", (event) => {
    console.log(`Downloaded ${e.loaded} of ${e.total} bytes.`);
    const progressbar = document.querySelector("progress");
    progressbar.value = e.loaded;
    progressbar.max = e.total;
  });
 
  await summarizer.ready;
}
 
const result = await summarizer.summarize(text);

const controller = new AbortController();
 
const button = document.querySelector(".cancel-button");
button.addEventListener("click", () => {
  controller.abort();
});
 
const summarizer = await ai.summarizer.create();
 
try {
  const result = await summarizer.summarize(text, {
    signal: controller.signal,
  });
  console.log(result);
} catch (error) {
  console.error("Summarization was aborted.");
}

const summarizer = await ai.summarizer.create();
const text =
  "JavaScript (JS) is a lightweight interpreted (or just-in-time compiled) programming language with first-class functions. While it is most well-known as the scripting language for Web pages, many non-browser environments also use it, such as Node.js, Apache CouchDB and Adobe Acrobat. JavaScript is a prototype-based, multi-paradigm, single-threaded, dynamic language, supporting object-oriented, imperative, and declarative (e.g. functional programming) styles.";
 
const textbox = document.querySelector("#textbox");
const stream = summarizer.summarizeStreaming(text);
for await (const chunk of stream) {
  textbox.value = chunk;
}