navigator.geolocation.watchPosition twice in React: update frequency is different

Question

I have two calls to navigator.geolocation.watchPosition. One is being used in a component I'm importing before ReactDOM render, one inside a React component. The problem is that the callback in imported component is working great, but the one I created in React Component is being called "randomly" and it's calling frequency is very low. Basically all the settings are the same. What could be the reason?

React component

    componentDidMount() {
        let watchId = window.navigator.geolocation.watchPosition(this.watchPosition, err => console.log(err), {
            enableHighAccuracy: true,
            maximumAge: 0,
            timeout: 5000
// distance filter doesn't help
        })
        this.setState({
            ...this.state,
            watchId
        })
    }

    componentWillUnmount() {
        navigator.geolocation.clearWatch(this.state.watchId);
    }

    watchPosition(position) {
        this.props.dispatch(updatePosition({
            latitude: position.coords.latitude,
            longitude: position.coords.longitude
        }))
    }