From 2f056ff11772a8b6adf95b4eaab3d51bcb4e12ee Mon Sep 17 00:00:00 2001 From: Sebastian Benz Date: Tue, 12 Nov 2024 14:02:43 +0100 Subject: [PATCH] Update Geminin nano samples (#1347) * Link to latest articles * Add systemprompt to prompt sample to provide better guidance on simple prompts such as 'hello'. * Limit default topK to 3 (the default is currently set too high, this will change). * Fix setup instructions in the readmes. --- .../ai.gemini-on-device-summarization/README.md | 16 ++++++++++------ functional-samples/ai.gemini-on-device/README.md | 11 +++++------ .../ai.gemini-on-device/sidepanel/index.js | 13 ++++++++++--- 3 files changed, 25 insertions(+), 15 deletions(-) diff --git a/functional-samples/ai.gemini-on-device-summarization/README.md b/functional-samples/ai.gemini-on-device-summarization/README.md index 0d28de8590..0f8a79a88f 100644 --- a/functional-samples/ai.gemini-on-device-summarization/README.md +++ b/functional-samples/ai.gemini-on-device-summarization/README.md @@ -1,6 +1,6 @@ # On-device Summarization with Gemini Nano -This sample demonstrates how to use the experimental Summarization API in Chrome. To learn more about the API and how to sign-up for the preview, head over to [Built-in AI on developer.chrome.com](https://developer.chrome.com/docs/ai/built-in). +This sample demonstrates how to use the experimental Summarization API in Chrome. To learn more about the API and how to sign-up for the preview, head over to the [summarizer guide on developer.chrome.com](https://developer.chrome.com/docs/ai/summarizer-api). ## Overview @@ -9,8 +9,12 @@ The extension summarizes the content of the currently open tab. It uses Mozilla' ## Running this extension 1. Clone this repository -2. Run `npm install` in this folder to install all dependencies. -3. Run `npm run build` to bundle the content script . -4. Load the 'dist' directory in Chrome as an [unpacked extension](https://developer.chrome.com/docs/extensions/mv3/getstarted/development-basics/#load-unpacked). -5. Click the extension icon to open the summary side panel. -6. Open any web page, the page's content summary will automatically be displayed in the side panel. +1. Run `npm install` in this folder to install all dependencies. +1. Run `npm run build` to build the extension. +1. Load the newly created `dist` directory in Chrome as an [unpacked extension](https://developer.chrome.com/docs/extensions/get-started/tutorial/hello-world#load-unpacked). +1. Click the extension icon to open the summary side panel. +1. Open any web page, the page's content summary will automatically be displayed in the side panel. + +## Creating your own extension + +If you use this sample as the foundation for your own extension, be sure to update the `"trial_tokens"` field [with your own origin trial token](https://developer.chrome.com/docs/web-platform/origin-trials#extensions) and to remove the `"key"` field in `manifest.json`. diff --git a/functional-samples/ai.gemini-on-device/README.md b/functional-samples/ai.gemini-on-device/README.md index 94e840b4f2..a9707901a3 100644 --- a/functional-samples/ai.gemini-on-device/README.md +++ b/functional-samples/ai.gemini-on-device/README.md @@ -1,6 +1,6 @@ # On-device AI with Gemini Nano -This sample demonstrates how to use the experimental Gemini Nano API available in the context of an origin trial in Chrome with Chrome Extensions. To learn more about the API and how to sign-up for the origin trial, head over to [Built-in AI on developer.chrome.com](https://developer.chrome.com/docs/ai/built-in). +This sample demonstrates how to use the experimental Gemini Nano API available in the context of an origin trial in Chrome with Chrome Extensions. To learn more about the API and how to sign-up for the origin trial, head over to [Built-in AI on developer.chrome.com](https://developer.chrome.com/docs/extensions/ai/prompt-api). ## Overview @@ -9,13 +9,12 @@ The extension provides a chat interface using the Prompt API with Chrome's built ## Running this extension 1. Clone this repository. -1. Launch Chrome with the following flag, which makes sure the origin trial token in `manifest.json` is accepted by the browser. This won't be necessary once the origin trial is live. - - `--origin-trial-public-key=dRCs+TocuKkocNKa0AtZ4awrt9XKH2SQCI6o4FY6BNA=` -1. Load this directory in Chrome as an [unpacked extension](https://developer.chrome.com/docs/extensions/mv3/getstarted/development-basics/#load-unpacked). +1. Run `npm install` in the project directory. +1. Run `npm run build` in the project directory to build the extension. +1. Load the newly created `dist` directory in Chrome as an [unpacked extension](https://developer.chrome.com/docs/extensions/get-started/tutorial/hello-world#load-unpacked). 1. Click the extension icon. 1. Interact with the Prompt API in the sidebar. ## Creating your own extension -If you use this sample as the foundation for your own extension, be sure to update the `"trial_tokens"` field [with your own origin trial token](https://developer.chrome.com/docs/web-platform/origin-trials?hl=en#extensions) and to remove the `"key"` field in `manifest.json`. +If you use this sample as the foundation for your own extension, be sure to update the `"trial_tokens"` field [with your own origin trial token](https://developer.chrome.com/docs/web-platform/origin-trials#extensions) and to remove the `"key"` field in `manifest.json`. diff --git a/functional-samples/ai.gemini-on-device/sidepanel/index.js b/functional-samples/ai.gemini-on-device/sidepanel/index.js index f645d0c97d..f1e656fb80 100644 --- a/functional-samples/ai.gemini-on-device/sidepanel/index.js +++ b/functional-samples/ai.gemini-on-device/sidepanel/index.js @@ -51,11 +51,17 @@ async function initDefaults() { return; } sliderTemperature.value = defaults.defaultTemperature; - // sliderTemperature.max = defaults.maxTemperature; // Pending https://issues.chromium.org/issues/367771112. - sliderTopK.value = defaults.defaultTopK; + // sliderTemperature.max = defaults.maxTemperature; + if (defaults.defaultTopK > 3) { + // limit default topK to 3 + sliderTopK.value = 3; + labelTopK.textContent = 3; + } else { + sliderTopK.value = defaults.defaultTopK; + labelTopK.textContent = defaults.defaultTopK; + } sliderTopK.max = defaults.maxTopK; - labelTopK.textContent = defaults.defaultTopK; labelTemperature.textContent = defaults.defaultTemperature; } @@ -92,6 +98,7 @@ buttonPrompt.addEventListener('click', async () => { showLoading(); try { const params = { + systemPrompt: 'You are a helpful and friendly assistant.', temperature: sliderTemperature.value, topK: sliderTopK.value };