Flutter - Provider Consumer and Selector

Provider를 사용할 때 Provider.of, Consumer, Selector등을 사용할 수 있는데

Provider.of에서는 listen을 제외하고는 크게 고려할것이 없습니다
(자세한 내용은 링크를 통해 확인해주세요 : https://devmemory.tistory.com/10)

 

그러면 Consumer와 Selector는 언제 쓰는것이 좋은지에 대해 알아보겠습니다

먼저 Consumer를 사용하는 가장 큰 목적은 크게 2가지로

1. BuildContext가 없는 곳에서 사용하기 용이

2. 최적화된 리빌드를 통한 성능적 이득

그러면 Consumer 대신 Selector를 사용해야 될때는 언제일까요?

먼저 Consumer랑 Selector의 기능은 동일합니다만 Selector에는 다른 기능이 있습니다

Provider를 사용할 때, notifyListeners()를 콜 하는 경우가 많은데

규모가 큰 앱에서 해당 메소드를 여기저기서 콜하게 되면

성능적 이슈 그리고 에러가 발생할 확률이 높아지게 됩니다

그래서 Selector를 통해 필요한 부분에서 notify 할 수 있도록 합니다

 

사용 예제는 다음 포스트를 참조해주세요

(링크 : devmemory.tistory.com/38)

 

 

그리고 다른 사용법으로는

 

provider 패키지 내부에 extension을 사용해 호출하는 방법으로

 

extension에 대해 알아보기싶다면 링크를 참고해주세요

(링크 : devmemory.tistory.com/44)

 

context.read<T>(), context.watch<T>(), context.selector<T>()등이 이와같은 방법으로 만들어졌는데

 

먼저 read는 provider에 listen : false와 같은 동작을 그리고 watch는 default

 

selector는 Selector<a,b>와 같은 역할을 한다고 하는데

 

여기서 read같은경우 위젯을 rebuild시키지도 않고 build안에서 사용하지 말라고 적혀있습니다

It's worth noting that context.read<T>() won't make widget rebuild when the value changes and cannot be called inside StatelessWidget.build/State.build. On the other hand, it can be freely called outside of these methods.

 

그러면 어디에 사용하면 좋은지 알아보니 버튼클릭과 같은 이벤트에 사용하기 좋다고 하더군요

onPressed: () => context.read<T>().method;

하지만 provider 제작자분의 코멘트를 보니 이런 방식보다는

 

Consumer와 Selector를 사용하는것이 성능상으로 더 유용하고

 

BuildContext를 가져오기 힘든곳에서도 훨씬 더 유용하다고 합니다

 

Alternatively, instead of using these methods, we can use Consumer and Selector.

These can be useful for performance optimizations or when it is difficult to obtain a BuildContext descendant of the provider.

 

필자도 해당 방식을 사용한 곳이 있는데 error에 조금 더 민감한부분이 있으나

 

사용하기 유용한 부분도 분명히 있는거 같습니다

참조 : 

pub dev : pub.dev/packages/provider

 

Provider : pub.dev/documentation/provider/latest/provider/Provider-class.html

 

Selector : pub.dev/documentation/provider/latest/provider/Selector-class.html

 

Consumer : pub.dev/documentation/provider/latest/provider/Consumer-class.html