Hacker News new | ask | show | jobs
by blixt 19 days ago
The biggest performance bomb you can have in your code is a loop that does something like

    for (...) {
        el.style.height = `${something}px`;
        whatever.value = el.style.offsetHeight;
    }
This forces the browser to recalculate layout multiple times in a single frame. Separating layout changing code from measurement code will help a lot here (most frameworks out there have solved this so we don't have to be too concerned about it though).
2 comments

This is true, but a much more common reason is that you have a self growing textarea and Firefox didn't support field-sizing: content until recently, so you had to let JS resize the textarea on every keypress.
I miss Firefox Quantum that effort should have continued, stuff like this makes for great candidates for that initiative to resolve.
Or as Andreas Kling (jokingly) put it[1]: “STOP INTERLEAVING STYLE CHANGES AND LAYOUT METRIC QUERIES ASSHOLE”.

[1] https://nitter.net/awesomekling/status/2021932080742142056