This story was originally published on HackerNoon at:
https://hackernoon.com/your-users-type-faster-than-your-javascript-react-native-drops-the-difference.
Why React Native TextInput drops characters when you type fast: the eventCount handshake that does it on purpose, the source behind it, and the fix.
Check more stories related to programming at:
https://hackernoon.com/c/programming.
You can also check exclusive content about
#react-native,
#ios-development,
#javascript,
#objective-c,
#react-native-eventcount,
#chat-app-optimization,
#controlled-input-performance,
#react-native-textinput-bug, and more.
This story was written by:
@grievouz. Learn more about this writer by checking
@grievouz's about page,
and for more stories, please visit
hackernoon.com.
React Native makes TextInput feel controlled, but native owns the text and your JS value is a lagging copy. An eventCount handshake stamps each write; if you typed while JS re-rendered, the counts mismatch and native drops the write on purpose. The leftover dropped characters come from transforms, cursor races, IME resets, and the old architecture. It is worst on a busy chat screen. Fix: keep the keystroke path cheap or go uncontrolled.