How do I display thinking text with @ai-sdk/google?

[tfmcmahon]

Hi, I'm using @ai-sdk/google 1.2.19 and @ai-sdk/react 1.2.12 in a project. I've noticed that when I use the Gemini Pro model, text generation takes significantly more time than with Flash. I'm interested in displaying the thinking step text. In the docs it mentions a thinkingBudget setting.

      providerOptions: {
        google: {
          thinkingConfig: {
            thinkingBudget: 128,
          },
        } satisfies GoogleGenerativeAIProviderOptions,
      },

I'm using streamObject in my route and useObject on my page to display text. Questions:

1. Am I on the right track? Is there a way to display thinking text with this set up?
2. I've noticed that adjusting the thinkingBudget has no effect on the time it takes to generate a response. Is this expected?

[frescoanalytics]

Yes I think Pro model is designed to be more "sophisticated" than Flash. I wouldn't be surprised it take more time.

As for displaying the thinking text, try the following snippet. Let me know if this works for you.

"dependencies": { "@ai-sdk/google": "^1.2.19", "@google/genai": "^1.4.0", "ai": "^4.3.16" }

import { google } from '@ai-sdk/google';
import { streamText } from 'ai';

async function main() {
    const result = streamText({
        model: google('gemini-2.5-flash', { useSearchGrounding: false }),
        prompt: 'Is Stephen Curry the best player in the NBA?',
        providerOptions: {
            google: {
                thinkingConfig: {
                    includeThoughts: true,
                    thinkingBudget: 1024,
                },
            },
        },
        // experimental_generateMessageId: () => '123',
        onFinish: (result) => {
            console.log();
            console.log('Finish reason:', result.finishReason);
            console.log('Token usage:', result.usage);
            console.log('Warnings:', result.warnings);
            console.log('Response Metadata:', result.response);
        },
    });
    for await (const part of result.fullStream) {
        if (part.type === 'reasoning') {
            process.stdout.write('\x1b[34m' + part.textDelta + '\x1b[0m');
        } else if (part.type === 'text-delta') {
            process.stdout.write(part.textDelta);
        }
    }
}
main().catch(console.error);

Then execute the file with bun run ./ai-sdk/google-reasoning.ts (this is the file name I used)

[tfmcmahon]

Hey @frescoanalytics - thanks for the reply. Is it possible to modify this solution to work with streamObject ? I am using this method in my route (to work with useObject on the FE). I am sort of stuck using streamObject + useObject barring a major refactor.

I've since switched to openAI. The response times are acceptable in my case.

[frescoanalytics]

Google seems to have a unified interface to generate "response". In the case of generating object, you'd call ai.models.generateContent with a responseSchema config. (See https://ai.google.dev/gemini-api/docs/structured-output)

You can slightly tweak the example on the page to achieve streaming. Below is a TS script with Google SDK. Turn thinking config on and off to see the difference.

import { GoogleGenAI, Type } from "@google/genai";

const ai = new GoogleGenAI({ apiKey: process.env.GEMINI_API_KEY });

let thoughts = "";
let answer = "";

async function main() {
  const response = await ai.models.generateContentStream({
    model: "gemini-2.5-flash",
    contents:
      "List a few popular cookie recipes, and include the amounts of ingredients.",
    config: {
      responseMimeType: "application/json",
      responseSchema: {
        type: Type.ARRAY,
        items: {
          type: Type.OBJECT,
          properties: {
            recipeName: {
              type: Type.STRING,
            },
            ingredients: {
              type: Type.ARRAY,
              items: {
                type: Type.STRING,
              },
            },
          },
          propertyOrdering: ["recipeName", "ingredients"],
        },
      },
      thinkingConfig: {
        includeThoughts: true,
        thinkingBudget: 1024,
      },
    },
  });

  for await (const chunk of response) {
    if (
      chunk.candidates &&
      chunk.candidates[0] &&
      chunk.candidates[0].content &&
      Array.isArray(chunk.candidates[0].content.parts)
    ) {
      for (const part of chunk.candidates[0].content.parts) {
        if (!part.text) {
          continue;
        } else if (part.thought) {
          if (!thoughts) {
            console.log("Thoughts summary:");
          }
          console.log(part.text);
          thoughts = thoughts + part.text;
        } else {
          if (!answer) {
            console.log("Answer:");
          }
          console.log(part.text);
          answer = answer + part.text;
        }
      }
    }
    // console.log(chunk.text);
    // await new Promise((resolve) => setTimeout(resolve, 1000));
  }
}

main();

Note from the documentation below, if you don't set thinking config, there might be default thinking behind the scene that could take time.
https://ai.google.dev/gemini-api/docs/thinking

Now back to AI SDK. It seems to me that its streamObject function does not return the thinking part. Compare and contrast the two following pages. And it makes two different interface for object and text outputs.

https://ai-sdk.dev/docs/reference/ai-sdk-core/stream-object#returns
https://ai-sdk.dev/docs/reference/ai-sdk-core/stream-text#returns

To achieve object streaming, and turning off Gemini thinking explicitly, you can try the following.

import { google } from "@ai-sdk/google";
import { streamObject } from "ai";
import { z } from "zod";

const { partialObjectStream } = streamObject({
  model: google("gemini-2.5-flash", { useSearchGrounding: false }),
  schema: z.object({
    recipe: z.object({
      name: z.string(),
      ingredients: z.array(z.string()),
      steps: z.array(z.string()),
    }),
  }),
  prompt:
    "Generate a lasagna recipe. If you use eggs, can you explain why you did?",
  providerOptions: {
    google: {
      thinkingConfig: {
        includeThoughts: false,
        thinkingBudget: 0,
      },
    },
  },
  onFinish: (result) => {
    console.log();
    console.log("Result:", result);
  },
});

for await (const partialObject of partialObjectStream) {
  console.clear();
  console.log(partialObject);
}

Let me know what you think and if anything doesn't work.

Cheers! 🍻

[tfmcmahon]

I really appreciate the detailed response. Thanks for your help!