How to improve PanResponder efficiency in ReactNative? - react-native

Question

I am using React Native for a game (perhaps not the best framework but not the point). I need user to be able to slide on a grid. On the pic, user is selecting MKEC without removing its finger from screen.
I am from the web, so I thought I would use onHover event. But it dossn't exist on mobile. So I created a parent component and a grid component. Parent component catch event with PanResponder, and I calculate where user finger is on the grid, and change state of the grid component.
However, if user is going too fast from on letter to another, it sometimes 'skip' a letter. If you go from M to G (first column) very fast, it seems that not event is triggered on H. Am I clear ? User feels latency.
componentWillMount() {
const onRelease = (evt, gestureState) => {
this.props.validateWord();
};
const onMove = (evt, gestureState: GestureState) => {
const obj = Object.assign({}, {
pageX: evt.nativeEvent.pageX,
pageY: evt.nativeEvent.pageY
});
const pos = {
x: evt.nativeEvent.pageX - this.position.pageX,
y: evt.nativeEvent.pageY - this.position.pageY
}
const whatSquare = whatSquareIsTouched(
pos,
defaultLetter.width, // size of letter
defaultLetter.width * 0.22 // padding for diagonale
);
const letter = this.props.gridReducer[whatSquare.y]
&& this.props.gridReducer[whatSquare.y][whatSquare.x] ?
this.props.gridReducer[whatSquare.y][whatSquare.x] : null;
// if letter => if touch is on a letter and not outside of grid comp
if (letter) {
this.props.letterTouched(letter, whatSquare.insidePadding);
}
}
this._panResponder = createResponder(onMove, onRelease);
}
How could I improve my code ? Or perhaps go another way to tackle this problem?
Update after comment :
I have not solved the problem yet. But i tried the following. I assumed that when user change direction, a new event is trigger. So I could calculate the finger path. If user starts at M and finish in G without changing direction, then H has been hovered.