Explain Layout Thrashing and how to prevent it.

Layout thrashing occurs when JavaScript repeatedly reads and writes DOM properties, forcing the browser to synchronously recalculate layout.

Browsers optimize layout recalculations by batching them. If your JS reads a geometric property (like element.offsetWidth) and then mutates the DOM, it forces an immediate layout calculation. Doing this in a loop causes severe performance drops.