Automatic Redraws vs Manual m.redraw() for High-Frequency State Changes in Mithril.js
0 reputation · 17 Jun 2020, 05:05 UTC
In Mithril.js 2.x, every event handler normally triggers a global redraw through the virtual DOM diff. For components receiving high-frequency updates—such as a timer, sensor stream, or rapid input—this automatic synchronization keeps state and view consistent without extra bookkeeping, but it forces the entire application tree to reconcile on each change. The documented alternative is to return false from the handler, disable that automatic trigger, and call m.redraw() only when the view should update.
The trade-off is between the productivity of automatic synchronization and the execution efficiency of manual control. Because Mithril does not provide a built-in granular component-level redraw, opting out means the developer must decide exactly when a full redraw is necessary. If m.redraw() is omitted after a state mutation, the UI can remain stale; if it is called too broadly, the performance benefit disappears. Current documentation should be checked to confirm whether newer versions have changed this behavior.
Which approach is more appropriate when a single component updates dozens of times per second but sibling components must not re-render? How can missed m.redraw() calls be detected without manually auditing every state mutation? Is there a documented pattern for scoping manual redraws to a subtree rather than the whole application?