Реакция - Избегает ли «Рендеринг списков в выделенных компонентах» сверки? - PullRequest
Новая
       18

Реакция - Избегает ли «Рендеринг списков в выделенных компонентах» сверки?

2 голосов
/ 15 октября 2019

https://mobx.js.org/best/react-performance.html#render-lists-in-dedicated-components

Плохо: 

@observer
class MyComponent extends Component {
    render() {
        const { todos, user } = this.props
        return (
            <div>
                {user.name}
                <ul>
                    {todos.map(todo => (
                        <TodoView todo={todo} key={todo.id} />
                    ))}
                </ul>
            </div>
        )
    }
}

Хорошо: 

@observer class MyComponent extends Component {
    render() {
        const {todos, user} = this.props;
        return (<div>
            {user.name}
            <TodosView todos={todos} />
        </div>)
    }
}

@observer class TodosView extends Component {
    render() {
        const {todos} = this.props;
        return <ul>
            {todos.map(todo => <TodoView todo={todo} key={todo.id} />)}
        </ul>)
    }
}

Это примеры документов MobX.

IИнтересно, есть ли заметная разница между плохими и хорошими примерами.

Я создал пример проекта, и результат не изменился.

Нет кодов, связанных с SCU или PureComponent.

Если TodosView extends PureComponent, да, это быстро.

Так что мне интересно, просто Render lists in dedicated components позволяет избежать примирения.

...