[Feature request] lazy loading

[kopax]

Hi and thanks for the module,

If this is still maintained, I have some good idea to share and maybe to implement

I have a react component that display an image of a flag, whenever I change the language, the flag change, and a new image get downloaded. This result in an image download and UI is not handling it properly.

This solution will preload all the resource images and store it to state:

class ImageLoader extends Component {
    constructor() {
        super();

        this.data = {
            data: null
        };
    }

    componentDidMount() {
        axios.get("http://url.to/my/RESTful/api").then(res => {
            this.setState({ data: res.data });
        });
    }

    render() {
        return this.state.data
            ? <img
                  src={require(`../images/${this.state.data.picture}`)}
                  alt="some name"
              />
            : null;
    }
}

This is actually not possible using src props, ` will render the following:

<img alt="French Flag" src="/img/flags/flags-iso/flat/32/_unknown.png" class="sc-bdVaJa bnvcRn">