Request and Response Stream - Observations
Tags: javascript, streams, http, webdev
Published: 2022-06-18 18:46:00

---
canonical_url: https://faun.pub/streams-chunk-collecting-part-2-1f368b80045c
---
HTTP Request and Response streams. This is a story how I used postman to understand HTTP streams and their chunking.

## First, the source code

```js
// The source: https://nodejs.org/api/stream.html#api-for-stream-consumers
const http = require('http');

const server = http.createServer(
  function toUnderstandRequestAndResponseStreamRoleInDataFetching(req, res) {
    let body = '';
    let chunksReceived = 0;
    req.setEncoding('utf8');

    req.on('data', function saveChunkDataAndChunkCount(chunk) {
      body += chunk;
      chunksReceived += 1;
    });

    req.on('end', function sendReceivedChunkDataStatistic() {
      try {
        const chunkStatistic = JSON.stringify({
          chunkCount: chunksReceived,
          received: body,
        });

        res.writeHead(200, { 'Content-Type': 'application/json' });
        res.write(chunkStatistic);
        res.end();
      } catch (error) {
        // treat all errors as internal server error
        res.statusCode = 500;
        // let the user know what happened
        return res.end(error.message);
      }
    });
  }
);

const port = 3001;
server.listen(port);
```

## Chunk collecting

The listener receives data in chunks. Because the server receives data in chunks, the data is split.

```js
req.on('data', function saveChunkDataAndChunkCount(chunk) {
  body += chunk;
  chunksReceived += 1;
});
```

How large can each chunk be?

## How I used postman

I opened postman and started sending get requests. I added more characters to each request. I printed each chunk and incremented chunk counter. I observed that it took 50kb or more to increase chunk count. I started sending requests with more characters. I observed that request with 88 chunks took 'a while'.

```js
const chunkStatistic = JSON.stringify({
  chunkCount: chunksReceived,
  received: body,
});
```

## All previous observations draw the following conclusions

- `Request` and `Response` are streams.
- `Request` is a readable stream.
- `Response` is a writable stream.

Reading and writing to Request and Response streams is kind of hidden from the user. But there is possibility to manually fetch and write data to streams. Manual control of reading and writing allows us to control the fetch priority.

## References

- [NextJS - Streaming SSR](https://nextjs.org/docs/advanced-features/react-18/streaming#using-streaming-server-rendering)

_I wanted to add a link to the document by Dan Abramov about the streaming SSR, but I couldn't find it. Still, I wanted to note that it exists._

## Relevant reads

- [MDN - Streams API](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API)
- [MDN - Using readable streams](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API/Using_readable_streams)
- [MDN - Using writable streams](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API/Using_writable_streams)
- [MDN - ReadableStream](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream)
- [MDN - Response](https://developer.mozilla.org/en-US/docs/Web/API/Response)
- [MDN - WritableStream](https://developer.mozilla.org/en-US/docs/Web/API/WritableStream)
- [MDN - Streams API concepts](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API/Concepts)