JSFiddle - React, Tailwind, and code Playground

CSS

td { border:1px solid red; height: 40px; padding: 20px }

JavaScript

values = [
    [100, 400],
    [100, 500],
    [100, 500]
];


span = [
    [1, 1],
    [1, 1],
    [1, 1]
];


cols = 2
rows = 3

for (var col = 0; col < cols; col++) {
    for (var row = rows - 2; row >= 0; row--) {
    if (values[row][col] == values[row + 1][col]) {
        span[row][col] = span[row + 1][col] + 1;
        span[row + 1][col] = 0;
    }
    }
}


html = "<table>";

for (var row = 0; row < rows; row++) {
    html += "<tr><td style='border:0'>&nbsp;</td>"
    for (var col = 0; col < cols; col++) {    
        var s = span[row][col];
        var v = values[row][col]
        if (s == 1)
            html += "<td>" + v + "</td>"
        if (s > 1)
            html += "<td rowspan=" + s + ">" + v + "</td>"
    }
    html += "</tr>"
}

html += "</table>"
document.body.innerHTML = html