I have a component has a list of items like this:

```
loadMore() {
    const len = this.state.itemList.length;
    if (len < 1000) {

        const newItems = Array.from({length:10}, (v,i) => "item-" + (i+len));
        this.setState({itemList: this.state.itemList.concat(newItems)});
    } else {
        alert("no more");
    }
}

render() {
    return (
        <div>
        <ul>
            this.state.itemList.map((item, i) => 
                <li key={i}>item</li>
            )
        </ul>
        <a onClick={this.loadMore.bind(this)}>Loading</a>
        </div>
    )
}

```

So, when I click `Loading`, **will react remove all old doms then recreate them?**

In fact, I am just adding elements, not replace them, so if react do this, the performance is not so good, **how can I avoid this?**