이레 이레

큰 collections을 렌더링해야 할 때 특히 지켜져야 한다. collection이 바뀔 때 마다 collection으로 부터 produced된 component는 재조정을 거쳐야 하기 때문이다. 따라서, 컴포넌트는 다른 무언가를 렌더링하지 않고 collection만을 render하는 것을 권장한다. bad: const MyComponent = observer(({ todos, user }) => ( {user.name} {todos.map(todo => ( ))} )) good: const MyComponent = observer(({ todos, user }) => ( {user.name} )) const TodosView = observer(({ todos }) => ( {todos.map(to..

observable state를 감시하는 action state를 바꿀 메서드 computed state로 부터 새로운 변화를 가지고 올 getter, 결과물을 cache함. makeObservable 주로 클래스 생성자에서 선언(target은 this) target으로 모든 js object를 넘길 수 있음 makeAutoObservable super가 있거나 subclass가 있는 class에선 사용 불가 makeObservable과 비교해서 자동적으로 관리해주기 때문에 편리함. makeAutoObservable의 규칙: 자신의 property는 다 observable이 된다. getter는 computed로 setter는 action으로 prototype인 모든 함수는 autoAction이 된다. ..

Concepts MobX내에서 크게 3가지로 분류할 수 있다. 1. State 2. Actions 3. Derivations 1. State를 정의하고 state를 observable하게 한다. State는 어플리케이션에서 drive(추출)한 data이다. state를 observable하게 함으로 MobX가 확인할 수 있다. 예시: import { makeObservable, observable, action } from "mobx" class Todo { id = Math.random() title = "" finished = false constructor(title) { makeObservable(this, { title: observable, finished: observable, toggle:..