Getting a large postgresql table using queryStream and ReadableStream does not 'stream'

[federicomarcantognini]

I am getting the data from the psql database table to the client but getting it all at once instead of stream chunks. Why?

Should ReadableStream return chunks to populate a variable in the client incrementally?

routes/api/+servert.ts

/** @type {import('./$types').RequestHandler} */
export async function GET({ url }) {
     ....

      const ac = new AbortController();

      const stream = new ReadableStream({
         async start(controller) {
            try {
               const client = await pool.connect();
               const query = new QueryStream(querystring);
               const dbStream = client.query(query);
               const jsonStream = JSONStream.stringify();
         
               dbStream.pipe(jsonStream);
         
               jsonStream.on('data', (chunk) => {
                  controller.enqueue(chunk);
               });
         
               jsonStream.on('end', () => {
                  controller.close();
                  client.release();
               });      
         
               ac.signal.addEventListener('abort', () => {
                  dbStream.destroy();
                  client.release();
               });

            } catch (error) {
               console.error("Error in stream:", error);
               controller.error(error);
            }
         },
         cancel() {
            console.log("cancel and abort");
            ac.abort();
         },
      });
    
      return new Response(stream, {
         headers: {
            'Content-type': 'application/json'
         }
      });
 
}

routes/example/+page.svelte

async function getDatabaseData2 ({ url, state }) {
   // state.value is a Rune class
    // fetch internal server api.
    const response = await fetch(url, {
        method: 'GET',
    });
    state.value = await response.json();
}