const tarballResp = await fetch(tarballUrl);
const stream = tarballResp.body!.pipeThrough(new DecompressionStream("gzip"));

is the actual code, which'll run in production but the dev server will prevent execution

@Grass carp I'm in the same boat, did you ever have any luck?

I ended up using a polyfill if DecompresionStream wasn't in the global scope

Which definitely isn't ideal but I deploy to Cloudflare and not Vercel so it's only ever used in development

For anyone else reading this in the future, I wasn't able to use a polyfill to get around my issue (kept getting the error). I'm not really super sharp on polyfills, but added one to the top of my app/page.tsx.

What did work for me was to push all of the AI operations I was running into a separate worker that I then added to my NextJS app as a Service Binding (https://developers.cloudflare.com/workers/configuration/bindings/about-service-bindings/). This works well for my needs.

import { Ai } from '@cloudflare/ai';
import { AiTextToImageInput, AiTextToImageOutput } from '@cloudflare/ai/dist/ai/tasks/text-to-image';

export interface Env {
        AI: Ai;
}

export default {
        async fetch(request: Request, env: Env, ctx: ExecutionContext): Promise<Response> {
                if (request.method !== 'POST') {
                        return new Response('Invalid method', { status: 405 });
                }

                const url = new URL(request.url);
                const model = url.pathname.slice(1);

                const body = await request.json<AiTextToImageInput>();

                const ai = new Ai(env.AI);
                const startTime = Date.now();
                const image = (await ai.run(model as any, body)) as AiTextToImageOutput;
                const duration = (Date.now() - startTime) / 1000;
                return new Response(image, { headers: { 'x-duration': `${duration}` } });
        },
};