JSFiddle - React, Tailwind, and code Playground

HTML

<table id='table'>
  <tr>
    <th>id</th>
    <th>fieldA</th>
    <th>fieldB</th>
  </tr>
</table>
<button id='render'>
  Render data
</button>

JavaScript

function* fabricateData(n = 20) {
	for (let i = 0; i < n; i++) {
  	yield {
    	id: i,
      fieldA: (i**2) % 2,
      fieldB: ((i + 10) ** 3).toString(36)
    };
  }
}

const table = document.getElementById('table'),
	renderButton = document.getElementById('render');
  
renderButton.onclick = () => {
	for (const obj of fabricateData(1000)) {
  	const row = ['id', 'fieldA', 'fieldB'].reduce(
    	(row, key) => {
      	const td = document.createElement('td');
        td.append(document.createTextNode(obj[key]));
        row.append(td);
        return row;
      },
      document.createElement('tr')
    );
    table.append(row);
  }
};