JSFiddle - React, Tailwind, and code Playground

by InfinitiesLoop

HTML

<p>
    Place focus in the textbox below, and attempt to type something.
    The browser will lag, making typing in real time impossible.
</p>
<p>
    Then, click on the "fix it" button. This uses JS to add an empty text
    node after the checkbox in every row. After that, you can now type in
    the textbox with no issues. 
</p>
<input type="button" value="fix it" id="fixit"/>

<table>
    <tbody>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td><input type="textbox"/></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
        </tr>
        
        <tr>
            <td><input type="checkbox" /></td>
            <td></td>
       ...

JavaScript

document.getElementById("fixit").addEventListener("click", fixIt);

function fixIt() {
    var cells = document.querySelectorAll("table tbody tr td:first-child");
    for(var i = 0, l = cells.length; i < l; i++) {
        var simpleText = document.createTextNode("x");
        cells[i].appendChild(simpleText);
    }
}