When I get more than 10 thousand raw of data from Database in one Get request, the response takes a lot of time to reach client side.

Is there a way to pipe this data into small chunks to client side?

When sending a huge amount of data to client side, the client has to wait for the request to be completed in order to use that data.

this causes a lag in client side. Each time the client reloads the page, a request will be made and the client will wait for 10s of thousands of data to reach client.

I wanted to send it as chunks of small data when the client make a GET request, the client instantly receive data while it keeps completing the request from the server side,

it's like streaming data, Is there such a thing that I can use to achieve the above logic?

**example code**

```
/**
 * SERVER SIDE DASHBOARD ENDPOINT
 */
import { Request, Response } from 'express';

public dashboard = (req: Request, res: Response) => {
  // I get more than 10k of data that contains a lot of jsonb AKA Large data
  let data = await knex('dashboard').select();
  // Here I want to send data as chunks and translate it in client side
  res.status(200).json({ status: 'success', data });
};

/**
 * CLIENT SIDE
 * MOBX STORE HOOK
 */
import axios from 'axios';
import { makeAutoObservable, runInAction } from 'mobx';

// The rest of the class code is here
// I call this method in App.tsx

public getData = async () => {
  try {
    let response = await axios({
      url: 'http://localhost:3000/dashboard',
      method: 'GET',
    });

    runInAction(() => {
      if (response.status === 'success') {
        this.data = response.data;
      } else {
        console.error(response.msg);
      }
    });
  } catch (err) {
    console.error(err.message || err);
  }
};

/**
 * REACT DASHBOARD COMPONENT
 */
import { FC, useEffect } from 'react';
import { observer } from 'mobx-react-lite';
import { Table } from 'antd';

import { useStore } from 'hooks/context';

const CustomTable: FC = () => {
  const { store } = useStore();
  const { data } = store;

  useEffect(() => {

  }, [data]);

  let columns: any = [
    {
      title: 'id',
      dataIndex: 'id',
    }
  ];

  return (
    <>
      <div className={`table-responsive`}>
        <Table
          rowKey="id"
          className={`home__table`}
          columns={columns}
          dataSource={data}
        />
      </div>
    </>
  );
};

export default observer(CustomTable);

```