shouldComponentFetch in container

[adamschoenemann]

I think it would be useful to have a shouldComponentFetch method in container, in order to control if the component should update. For example, if a modal is open, I might not want the underlying UI to spend time updating its invisible UI until the modal closes. Right now, I've achieved this with quite an ugly hack.

Marty.createContainer(UnderlyingUI, {
    shouldComponentUpdate(nextProps) {
        if (nextProps.modal) {
            return false;
        }
        return true;
    },
    // FIXME: Ugly hack, but Marty has no shouldComponentFetch method
    setState(...args) {
        if (this.shouldComponentUpdate(this.props) === false) {
            return;
        }
        return React.Component.prototype.setState.call(this, ...args);
    }
});

[taion]

What do you mean by "spend time updating its invisible UI"? If it's just re-rendering time, wouldn't that better be handled by shouldComponentUpdate on the contained components?

[adamschoenemann]

Yes, I actually agree, the problem in my case was that the fetched result was always a new reference, due to Immutable.Collection.Filter always returning a new reference, so I wanted to stop the fetch from even happening. But I ended up solving my problem by memoization instead. I still think it would be useful in some circumstances, but maybe not the most pressing issue at the moment.

[taion]

That's really interesting. I'm not using immutable right now, but is there no straightforward pure render alternative for that use case?

Alternatively, why not just put that shouldComponentUpdate call in the wrapped component, if you're checking for the presence of props.modal?

[adamschoenemann]

Yes, that is certainly possible, but ideally I do not want the wrapped component to know about that particular prop. Then, I could make a wrapper that wraps the wrapped component, that only does the shouldComponentUpdate part, and that would be fine as well. As I said, I don't think this is a particularly big deal on second thought, but it could be nice, especially if your fetch involves some expensive computations.