Skip to content

Remove remaining chunk terminology from built-in-ai metrics and streaming UI #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
sohchatt merged 3 commits into from
May 19, 2026
Merged

Remove remaining chunk terminology from built-in-ai metrics and streaming UI #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
320b1e9
Replace Chunk with Tokens in built-in-ai
Copilot May 19, 2026
0f4a758
Fix Tokenss typo after Chunk replacement
Copilot May 19, 2026
051425e
Remove remaining chunk references from built-in-ai
Copilot May 19, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions built-in-ai/playgrounds/languagedetector-api/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -177,9 +177,9 @@ <h1>LanguageDetector API</h1>

<div class="metrics card-with-shadow">
<span class="metric">Initial latency: <span class="value" id="init-latency-metric"></span> ms</span>
<span class="metric">First chunk latency: <span class="value" id="first-chunk-latency-metric"></span> ms</span>
<span class="metric">Chunks: <span class="value" id="chunks-metric"></span></span>
<span class="metric">Rate: <span class="value" id="chunk-rate-metric"></span> chunk/sec</span>
<span class="metric">First token latency: <span class="value" id="first-token-latency-metric"></span> ms</span>
<span class="metric">Tokens: <span class="value" id="tokens-metric"></span></span>
<span class="metric">Rate: <span class="value" id="token-rate-metric"></span> token/sec</span>
<span class="metric">Total time: <span class="value" id="total-time-metric"></span> ms</span>
</div>
</main>
Expand Down
6 changes: 3 additions & 3 deletions built-in-ai/playgrounds/prompt-api/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -266,9 +266,9 @@ <h1>Prompt API</h1>

<div class="metrics card-with-shadow">
<span class="metric">Initial latency: <span class="value" id="init-latency-metric"></span> ms</span>
<span class="metric">First chunk latency: <span class="value" id="first-chunk-latency-metric"></span> ms</span>
<span class="metric">Chunks: <span class="value" id="chunks-metric"></span></span>
<span class="metric">Rate: <span class="value" id="chunk-rate-metric"></span> chunk/sec</span>
<span class="metric">First token latency: <span class="value" id="first-token-latency-metric"></span> ms</span>
<span class="metric">Tokens: <span class="value" id="tokens-metric"></span></span>
<span class="metric">Rate: <span class="value" id="token-rate-metric"></span> token/sec</span>
<span class="metric">Total time: <span class="value" id="total-time-metric"></span> ms</span>
</div>
</main>
Expand Down
6 changes: 3 additions & 3 deletions built-in-ai/playgrounds/proofreader-api/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -204,9 +204,9 @@ <h1>Proofreader API</h1>

<div class="metrics card-with-shadow">
<span class="metric">Initial latency: <span class="value" id="init-latency-metric"></span> ms</span>
<span class="metric">First chunk latency: <span class="value" id="first-chunk-latency-metric"></span> ms</span>
<span class="metric">Chunks: <span class="value" id="chunks-metric"></span></span>
<span class="metric">Rate: <span class="value" id="chunk-rate-metric"></span> chunk/sec</span>
<span class="metric">First token latency: <span class="value" id="first-token-latency-metric"></span> ms</span>
<span class="metric">Tokens: <span class="value" id="tokens-metric"></span></span>
<span class="metric">Rate: <span class="value" id="token-rate-metric"></span> token/sec</span>
<span class="metric">Total time: <span class="value" id="total-time-metric"></span> ms</span>
</div>
</main>
Expand Down
6 changes: 3 additions & 3 deletions built-in-ai/playgrounds/rewriter-api/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -239,9 +239,9 @@ <h1>Rewriter API</h1>

<div class="metrics card-with-shadow">
<span class="metric">Initial latency: <span class="value" id="init-latency-metric"></span> ms</span>
<span class="metric">First chunk latency: <span class="value" id="first-chunk-latency-metric"></span> ms</span>
<span class="metric">Chunks: <span class="value" id="chunks-metric"></span></span>
<span class="metric">Rate: <span class="value" id="chunk-rate-metric"></span> chunk/sec</span>
<span class="metric">First token latency: <span class="value" id="first-token-latency-metric"></span> ms</span>
<span class="metric">Tokens: <span class="value" id="tokens-metric"></span></span>
<span class="metric">Rate: <span class="value" id="token-rate-metric"></span> token/sec</span>
<span class="metric">Total time: <span class="value" id="total-time-metric"></span> ms</span>
</div>
</main>
Expand Down
6 changes: 3 additions & 3 deletions built-in-ai/playgrounds/summarizer-api/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -222,9 +222,9 @@ <h1>Summarizer API</h1>

<div class="metrics card-with-shadow">
<span class="metric">Initial latency: <span class="value" id="init-latency-metric"></span> ms</span>
<span class="metric">First chunk latency: <span class="value" id="first-chunk-latency-metric"></span> ms</span>
<span class="metric">Chunks: <span class="value" id="chunks-metric"></span></span>
<span class="metric">Rate: <span class="value" id="chunk-rate-metric"></span> chunk/sec</span>
<span class="metric">First token latency: <span class="value" id="first-token-latency-metric"></span> ms</span>
<span class="metric">Tokens: <span class="value" id="tokens-metric"></span></span>
<span class="metric">Rate: <span class="value" id="token-rate-metric"></span> token/sec</span>
<span class="metric">Total time: <span class="value" id="total-time-metric"></span> ms</span>
</div>
</main>
Expand Down
6 changes: 3 additions & 3 deletions built-in-ai/playgrounds/translator-api/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -182,9 +182,9 @@ <h1>Translator API</h1>

<div class="metrics card-with-shadow">
<span class="metric">Initial latency: <span class="value" id="init-latency-metric"></span> ms</span>
<span class="metric">First chunk latency: <span class="value" id="first-chunk-latency-metric"></span> ms</span>
<span class="metric">Chunks: <span class="value" id="chunks-metric"></span></span>
<span class="metric">Rate: <span class="value" id="chunk-rate-metric"></span> chunk/sec</span>
<span class="metric">First token latency: <span class="value" id="first-token-latency-metric"></span> ms</span>
<span class="metric">Tokens: <span class="value" id="tokens-metric"></span></span>
<span class="metric">Rate: <span class="value" id="token-rate-metric"></span> token/sec</span>
<span class="metric">Total time: <span class="value" id="total-time-metric"></span> ms</span>
</div>
</main>
Expand Down
6 changes: 3 additions & 3 deletions built-in-ai/playgrounds/writer-api/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -206,9 +206,9 @@ <h1>Writer API</h1>

<div class="metrics card-with-shadow">
<span class="metric">Initial latency: <span class="value" id="init-latency-metric"></span> ms</span>
<span class="metric">First chunk latency: <span class="value" id="first-chunk-latency-metric"></span> ms</span>
<span class="metric">Chunks: <span class="value" id="chunks-metric"></span></span>
<span class="metric">Rate: <span class="value" id="chunk-rate-metric"></span> chunk/sec</span>
<span class="metric">First token latency: <span class="value" id="first-token-latency-metric"></span> ms</span>
<span class="metric">Tokens: <span class="value" id="tokens-metric"></span></span>
<span class="metric">Rate: <span class="value" id="token-rate-metric"></span> token/sec</span>
<span class="metric">Total time: <span class="value" id="total-time-metric"></span> ms</span>
</div>
</main>
Expand Down
6 changes: 3 additions & 3 deletions built-in-ai/static/e-commerce.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -159,9 +159,9 @@ addEventListener("DOMContentLoaded", async () => {
console.log("Reviews to summarize:", reviews);
const stream = summarizerSession.summarizeStreaming(reviews);

for await (const chunk of stream) {
console.log(`Received chunk: "${chunk}"`);
summaryOutputEl.textContent += chunk;
for await (const token of stream) {
console.log(`Received token: "${token}"`);
summaryOutputEl.textContent += token;
}

summarizeReviewBtn.removeAttribute("disabled");
Expand Down
26 changes: 13 additions & 13 deletions built-in-ai/static/metrics.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,12 @@ class PlaygroundMetrics {
this.startTime = null;
this.sessionCreatedTime = null;
this.streamStartTime = null;
this.chunkCount = null;
this.tokenCount = null;

this.initLatencyMetricEl = document.querySelector("#init-latency-metric");
this.firstChunkLatencyMetricEl = document.querySelector("#first-chunk-latency-metric");
this.chunksMetricEl = document.querySelector("#chunks-metric");
this.chunkRateMetricEl = document.querySelector("#chunk-rate-metric");
this.firstTokenLatencyMetricEl = document.querySelector("#first-token-latency-metric");
this.tokensMetricEl = document.querySelector("#tokens-metric");
this.tokenRateMetricEl = document.querySelector("#token-rate-metric");
this.totalTimeMetricEl = document.querySelector("#total-time-metric");

if (!this.checkMetricsElements()) {
Expand All @@ -17,7 +17,7 @@ class PlaygroundMetrics {
}

checkMetricsElements() {
return this.initLatencyMetricEl && this.firstChunkLatencyMetricEl && this.chunksMetricEl && this.chunkRateMetricEl;
return this.initLatencyMetricEl && this.firstTokenLatencyMetricEl && this.tokensMetricEl && this.tokenRateMetricEl;
}

setNoStreamMode() {
Expand Down Expand Up @@ -51,23 +51,23 @@ class PlaygroundMetrics {
}

this.streamStartTime = performance.now();
this.chunkCount = 0;
this.tokenCount = 0;
}

signalOnStreamChunk() {
signalOnStreamToken() {
if (!this.checkMetricsElements()) {
return;
}

if (this.chunkCount === 0) {
this.firstChunkLatencyMetricEl.innerText = Math.round(performance.now() - this.streamStartTime);
if (this.tokenCount === 0) {
this.firstTokenLatencyMetricEl.innerText = Math.round(performance.now() - this.streamStartTime);
}

this.chunkCount++;
this.chunksMetricEl.innerText = this.chunkCount;
this.tokenCount++;
this.tokensMetricEl.innerText = this.tokenCount;

const rate = this.chunkCount / ((performance.now() - this.streamStartTime) / 1000);
this.chunkRateMetricEl.innerText = rate.toFixed(1);
const rate = this.tokenCount / ((performance.now() - this.streamStartTime) / 1000);
this.tokenRateMetricEl.innerText = rate.toFixed(1);
}

signalOnAfterResult() {
Expand Down
4 changes: 2 additions & 2 deletions built-in-ai/static/news.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -144,8 +144,8 @@ addEventListener("DOMContentLoaded", () => {

const stream = session.rewriteStreaming(selectedText);

for await (const chunk of stream) {
textToBeRewrittenEl.textContent += chunk;
for await (const token of stream) {
textToBeRewrittenEl.textContent += token;
}

proposedText = textToBeRewrittenEl.textContent;
Expand Down
6 changes: 3 additions & 3 deletions built-in-ai/static/playground.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -235,8 +235,8 @@ input[type="number"] {
grid: 1fr / 1fr 1fr;
}

.metrics.no-stream-mode .metric:has(#first-chunk-latency-metric),
.metrics.no-stream-mode .metric:has(#chunks-metric),
.metrics.no-stream-mode .metric:has(#chunk-rate-metric) {
.metrics.no-stream-mode .metric:has(#first-token-latency-metric),
.metrics.no-stream-mode .metric:has(#tokens-metric),
.metrics.no-stream-mode .metric:has(#token-rate-metric) {
display: none;
}
12 changes: 6 additions & 6 deletions built-in-ai/static/prompt-api.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -158,17 +158,17 @@ addEventListener("load", async () => {

metrics.signalOnBeforeStream();

let isFirstChunk = true;
for await (const chunk of stream) {
if (isFirstChunk) {
let isFirstToken = true;
for await (const token of stream) {
if (isFirstToken) {
spinnerEl.remove();
isFirstChunk = false;
isFirstToken = false;
outputEl.textContent = "";
}

metrics.signalOnStreamChunk();
metrics.signalOnStreamToken();

outputEl.textContent += chunk;
outputEl.textContent += token;
}
} catch (e) {
displaySessionMessage(`Could not generate a response: ${e}`, true);
Expand Down
12 changes: 6 additions & 6 deletions built-in-ai/static/rewriter-api.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,17 +69,17 @@ addEventListener("load", async () => {

metrics.signalOnBeforeStream();

let isFirstChunk = true;
for await (const chunk of stream) {
if (isFirstChunk) {
let isFirstToken = true;
for await (const token of stream) {
if (isFirstToken) {
spinnerEl.remove();
isFirstChunk = false;
isFirstToken = false;
outputEl.textContent = "";
}

metrics.signalOnStreamChunk();
metrics.signalOnStreamToken();

outputEl.textContent += chunk;
outputEl.textContent += token;
}
} catch (e) {
displaySessionMessage(`Could not rewrite text: ${e}`, true);
Expand Down
12 changes: 6 additions & 6 deletions built-in-ai/static/summarizer-api.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,17 +80,17 @@ addEventListener("load", async () => {

metrics.signalOnBeforeStream();

let isFirstChunk = true;
for await (const chunk of stream) {
if (isFirstChunk) {
let isFirstToken = true;
for await (const token of stream) {
if (isFirstToken) {
spinnerEl.remove();
isFirstChunk = false;
isFirstToken = false;
outputEl.textContent = "";
}

metrics.signalOnStreamChunk();
metrics.signalOnStreamToken();

outputEl.textContent += chunk;
outputEl.textContent += token;
}
} catch (e) {
displaySessionMessage(`Could not summarize the text: ${e}`, true);
Expand Down
12 changes: 6 additions & 6 deletions built-in-ai/static/translator-api.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -277,17 +277,17 @@ addEventListener("load", async () => {

metrics.signalOnBeforeStream();

let isFirstChunk = true;
for await (const chunk of stream) {
if (isFirstChunk) {
let isFirstToken = true;
for await (const token of stream) {
if (isFirstToken) {
spinnerEl.remove();
isFirstChunk = false;
isFirstToken = false;
outputEl.textContent = "";
}

metrics.signalOnStreamChunk();
metrics.signalOnStreamToken();

outputEl.textContent += chunk;
outputEl.textContent += token;
}
} catch (e) {
displaySessionMessage(`Could not translate the text: ${e}`, true);
Expand Down
12 changes: 6 additions & 6 deletions built-in-ai/static/writer-api.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,17 +65,17 @@ addEventListener("load", async () => {

metrics.signalOnBeforeStream();

let isFirstChunk = true;
for await (const chunk of stream) {
if (isFirstChunk) {
let isFirstToken = true;
for await (const token of stream) {
if (isFirstToken) {
spinnerEl.remove();
isFirstChunk = false;
isFirstToken = false;
outputEl.textContent = "";
}

metrics.signalOnStreamChunk();
metrics.signalOnStreamToken();

outputEl.textContent += chunk;
outputEl.textContent += token;
}
} catch (e) {
displaySessionMessage(`Could not write text: ${e}`, true);
Expand Down
6 changes: 3 additions & 3 deletions built-in-ai/templates/_includes/playground.njk
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,9 +19,9 @@

<div class="metrics card-with-shadow">
<span class="metric">Initial latency: <span class="value" id="init-latency-metric"></span> ms</span>
<span class="metric">First chunk latency: <span class="value" id="first-chunk-latency-metric"></span> ms</span>
<span class="metric">Chunks: <span class="value" id="chunks-metric"></span></span>
<span class="metric">Rate: <span class="value" id="chunk-rate-metric"></span> chunk/sec</span>
<span class="metric">First token latency: <span class="value" id="first-token-latency-metric"></span> ms</span>
<span class="metric">Tokens: <span class="value" id="tokens-metric"></span></span>
<span class="metric">Rate: <span class="value" id="token-rate-metric"></span> token/sec</span>
<span class="metric">Total time: <span class="value" id="total-time-metric"></span> ms</span>
</div>
</main>
Expand Down