---
title: On-device generative AI with Gemini Nano (Part 2)
url: https://calvin.my/posts/on-device-generative-ai-with-gemini-nano-part-2
published: 2024-07-08
updated: 2026-09-17
category: AI
tags:
- Gemini Nano
- gemini
- Chrome
- webAI
summary: This follow-up demo improves an on-device Gemini Nano summarization feature with clearer response feedback and incremental output. It replaces the standard generation call with streaming so users see results as they arrive, while displaying a loading icon when generation begins. Because the use case requires accurate technical summaries rather than creative text, the session’s temperature is lowered to make responses more precise.
---

# On-device generative AI with Gemini Nano (Part 2)

In this demo, we want to enhance our previous On-device generative AI demo with 2 UX improvements.

- Add a loading icon, to let the user know we are working on getting the result.
- Use the streaming API to render the result via a text stream instead of waiting for the full response to be ready.

* * *

First, we change our code from the prompt() API to the promptStreaming() API.

```javascript
const stream = session.promptStreaming(prompt);
for await (const chunk of stream) {
    this.outputTarget.textContent = chunk;
}
```

Next, we reset the output DOM with a loading icon every time the user triggers a generate.

```javascript
const stream = session.promptStreaming(prompt);
this.outputTarget.classList.remove("hidden");
this.outputTarget.innerHTML = '<i class="fa-solid fa-pencil fa-fade"></i>';
for await (const chunk of stream) {
    this.outputTarget.textContent = chunk;
}
```

The outcome:

![](https://camy-pub.s3.ap-southeast-1.amazonaws.com/6e4c69fc-7f91-41c0-a549-b7e93255a224.gif)

* * *

Since this is a case of summarizing technical articles, we want the API to be "less creative" and "more precise". We can further improve our code to set the temperature to a lower value, e.g. 0.1

```javascript
    async createAiSession() {
        const defaults = await window.ai.defaultTextSessionOptions();
        return await window.ai.createTextSession(
            {
                temperature: 0.1,
                topK: defaults.topK
            }
        );
    }
```

* * *

Now we have a simple working AI feature.
