React Router hook performance [listen+match] vs [Router.onUpdate]

I am working on a project that makes use of async chunked routes using react-router's getChildRoutes and webpack2's System.import

I am seeing an issue when using this code:

browserHistory.listen(location => {
    var time4 = new Date()
    //OR match({location, routes}
    match({history, routes}, (err, redirectLocation, renderProps: any) => {
        console.log("match:second: " + timeSince(time4))
        setTimeout(function () {
            trigger('loadclientonly', components, getLocals(renderProps))
                .then(function () {

                });
        }, 10);
    });
});

The match() causes an additional call to react-router's getChildRoutes, which adds a few hundred milliseconds to route transition time

I am prototyping an alternative way of doing this, and wanted some feedback Hints taken from this thread https://github.com/markdalgleish/redial/issues/3

<Router onUpdate={RouterOnUpdate} />

With

function RouterOnUpdate() {
    let components = this.state ? this.state.components : this.props.components;
    let renderProps = this.state ? this.state : this.props;
    setTimeout(function () {
        trigger('loadclientonly', components, getLocals(renderProps))
            .then(function () {

            });
    }, 10);
}

This approach seems to remove the lag during route transition

markdalgleish / redial

React Router hook performance [listen+match] vs [Router.onUpdate] #34