Where did useContextSelectors go?

[richard-ejem]

Hi, can I ask why did yo remove support for useContextSelectors? We use it heavily in our codebase. We were using some pretty old version of this library (0.51.7), and after update to the latest version, this hook is gone.

For us it was really useful since we often select many attributes from the context, and I'm afraid multiple calls to useContext / useContextSelector may reasonably affect performance (or maybe my knowledge of React, that every context listener is performance expensive, is outdated in this case?). So I'm curious what was the reason to remove this API?

[layershifter]

Do you mean a hook from @fluentui/react-context-selector?

In Fluent UI N* codebase it lives now under @fluentui/react-bindings. For Fluent UI v9 we decided to remove it by multiple reasons.

• Its implementation was too complicated and didn't work well with new changes required to make it work in Concurrent mode
• We are looking forward for getting it in React itself (I mean useContextSelector), but there is a zero chance that we will get useContextSelectors. So in future will not have a change to replace it with first party implementation if we would keep it for v9.

[richard-ejem]

Thanks, I understand that when React's proposal itself won't offer useContextSelectors it is a valid reason to not implement them.

However it still sounds reasonable to avoid hooking the context multiple times, and I honestly don't understand why do you use such complex implementation for useContextSelectors. I think it can be implemented quite straightforward just like useContextSelector, and it should work even in concurrent mode if useContextSelector does:

• combine selectors accepted by useContextSelectors into one, sth like

const combinedSelector = (selectors) => (contextValue) => Object.entries(selectors).reduce(
  (acc, [key, selector]) => {
    acc[key] = selector(contextValue);
    return acc;
  },
  {}
};

• then, instead of Object.is, use shallow compare on the selected record

So, actually if useContextSelector supported custom comparator function, I'd be able to implement useContextSelectors on top of it in userland.

[layershifter]

Thanks, I understand that when React's proposal itself won't offer useContextSelectors it is a valid reason to not implement them.

Well, we want to maintain less code in foundation and keep it simple (FYI originally it was forked from use-context-selector). It's the same thing as useId(), now it's available with React 18 and we can use our implementation as a fallback.

P.S. As I mentioned before useContextSelectors() is available under @fluentui/react-bindings.

However it still sounds reasonable to avoid hooking the context multiple times

Not really as reading a context is cheap as it's just Context._contextValue (you can check React internals if interested). It's actually one of reasons why we decided to move forward without useContextSelectors.

then, instead of Object.is, use shallow compare on the selected record

We don't want to diverge from a possible implementation in React as the current implementation has own consequences (dai-shi/use-context-selector#69). If we will implement a custom comparator we may stuck with our implementation forever 😿