Why Indie Developers Should Care About "Streaming"
First, let me share a before-and-after comparison from my own projects (personal testing, not vendor data):
- Non-streaming call: For a generation task of roughly 800 characters, users stare at a blank loading animation for 20–35 seconds, with noticeably higher drop-off rates;
- Streaming call: First-token latency is typically around 1 second, text appears segment by segment, and the user-perceived "response time" drops from the 30-second level to the 1-second level.
For indie developers and small teams, this change costs almost nothing—it's just a different way of reading the response. Server compute and API billing logic remain unchanged (refer to the official pricing page for specific billing rules), but the product experience improves qualitatively. Especially for long-text scenarios like customer support replies, article summaries, and code explanations, streaming is practically a must-have.
Node.js was born for this: event-driven, async I/O—handling streaming data is its home turf. This article walks you from registration to running your first piece of code, all in under 15 minutes.
Step 1: Register and Get Your API Key
- Open the ThisToken.AI registration page (link at the end of this article) and sign up with your email;
- After logging in, go to the console and create a new key on the "API Keys" page;
- Copy and save it immediately—the key is usually only shown in full once, and if you lose it, you'll have to generate a new one.
Security reminder: don't hardcode your key in code and commit it to a Git repository. Use environment variables instead:
export THISTOKEN_API_KEY="sk-your-key"Windows users can use set or put it in a .env file and load it with dotenv.
Step 2: Understand What Exactly Is "Streaming"
Regular call: request → wait for the model to finish generating the entire piece → return the complete result all at once.
Streaming call: request → the server pushes the generation process back chunk by chunk in SSE (Server-Sent Events) format → display each chunk as soon as it arrives.
For frontend users, this means going from a "spinning wheel" to a "typewriter effect." And the core code change you need to make is just one thing: replace "wait for the complete response" with "listen for data chunk events."
Step 3: Get Your First Code Running
Create a project and install dependencies (here we use the OpenAI-compatible SDK—you only need to change baseURL to connect to ThisToken.AI):
mkdir stream-demo && cd stream-demo
npm init -y
npm install openaiCreate index.js with the following complete code, ready to copy and run:
import OpenAI from "openai";
// 关键:通过 baseURL 指向 ThisToken.AI 的接口地址
const client = new OpenAI({
apiKey: process.env.THISTOKEN_API_KEY,
baseURL: "https://api.thistoken.ai/v1",
});
async function main() {
const stream = await client.chat.completions.create({
model: "gpt-4o-mini", // 模型名称以控制台支持列表为准
messages: [{ role: "user", content: "用三段话解释什么是SSE流式传输" }],
stream: true, // 核心开关:开启流式
});
const start = Date.now();
let firstChunkTime = null;
let full = "";
for await (const chunk of stream) {
const delta = chunk.choices[0]?.delta?.content ?? "";
if (delta && !firstChunkTime) {
firstChunkTime = ((Date.now() - start) / 1000).toFixed(2);
console.log(`\n[首字延迟: ${firstChunkTime}s]\n`);
}
process.stdout.write(delta); // 逐块打印,打字机效果
full += delta;
}
console.log(`\n\n[总耗时: ${((Date.now() - start) / 1000).toFixed(2)}s,共 ${full.length} 字]`);
}
main().catch(console.error);Run it:
node index.jsIf everything works, you'll first see [首字延迟: x.xx秒], then text "flowing" out segment by segment—that's the entire core of streaming. Compare it with the wait time of your previous non-streaming call for the same question, and the difference in feel is immediately obvious.
This code also prints the first-token latency and total time. I recommend keeping these two metrics and monitoring them continuously after integrating into your business—they're the most direct numbers for measuring user experience.
Common Pitfalls Checklist
- Forgot to set
baseURL: The SDK requests the official address by default, and your key will fail outright. Make sure you setbaseURL: "https://api.thistoken.ai/v1". - Didn't write
stream: true: You'll get a complete JSON object instead of an iterator, andfor awaitwill throw an error. - Using
res.send()directly in Express: To forward the stream in a web service, you need to set the response headerContent-Type: text/event-stream, write chunks out withres.write(), and finish withres.end(). - Key leakage: Once again—manage keys with environment variables, and never commit them to a repository.
Integrating Into Your Real Project
After getting the demo working, integrating into an existing project usually takes less than half a day of work: change the original "call → wait → return" API into a streaming passthrough, and have the frontend receive it with fetch + ReadableStream. In my own experience, retrofitting an existing long-text feature took about 2 hours from start to deployment; in return, the user-side perceived wait dropped from half a minute to 1 second—this may be the highest-ROI technical upgrade you'll ever make.
Go register an account now and run the code above: https://api.thistoken.ai/register
---
Ready to try it yourself? Sign up at https://api.thistoken.ai/register to get your API key and start building.
Ready to try Token.AI?
Create a project-level API Key, enable channels in the console, and configure routing, budgets, and audit logs.
注册 ThisToken.AI 并获取 API Key