9월일에 mobx 6.0이 출시되었다.
mobx 6 요약
ECMAScript에 적합한 라이브러리 & Proxy (모던브라우저) 및 비 Proxy (ES5) 동시지원
mobx가 데코레이터를 버리는 이유
가장 큰 이유는 데코레이터가 현재 표준으로 지정되어 있지 않은 점이다. 그렇기 때문에, 데코레이터를 사용하려면 복잡한 설정이 꼭 동반된다. 예를 들면 create-react-app로 프로젝트를 생성한 경우에는 순정상태로 사용할 수 없고 eject를 통해서 설정을 해줘야한다.
또한 비표준 데코레이터를 버림으로써, 추후에 등장할 표준 데코레이터(?)를 잘 지원할 수 있고, 당장은 비지원으로 인한 코드 용량 절감을 들 수 있다.
mobx 6 With ES5
기존에는 IE를 지원하는 프로젝트에서는 mobx 5를 사용할 수 없었고, mobx 4를 사용해야만 했다. 그러나 mobx 6에서는 mobx 5처럼 Proxy를 사용하거나, mobx 4처럼 이전 레거시 API를 활용하여 동작시킬수도 있다.
아직 실험적인 기능이지만, Proxy가 지원되는 모던 브라우저에는 Proxy를, 미지원 브라우저에서는 이전 레거시 API를 사용하도록 할 수 있는 설정도 지원한다.
mobx 6을 사용하면서 데코레이터를 사용하싶은 경우
mobx 6에서는 기존 방식으로 데코레이터를 사용할 수 없다. 그러나 객체의 생성자에, makeObservable(this)를 넣어주면 기존 방식대로 사용할 수 있다. www.npmjs.com/package/mobx-undecorate 를 통해 위 작업을 자동화 할 수 있다.
개인적으로 mobx를 데코레이터와 함께 사용하는 것이, 명시적인 코드처럼 보이게 해주며, 가독성이 증대되는 편이라고 생각한다. 그렇기 때문에, makeObservable을 쓰는 것도 좋지만, 데코레이터를 사용하는 것을 추천하는 편이다.