Authenticate component renders on each redux state change

[alexyuly]

I'm using the Authenticate component in an app that uses React and Redux. Using the React Perf add-on, I found that my instance of this component was rendering on each and every Redux state change, causing a lot of wasted rendering time (since my app has very frequent state changes).

After some investigation, I found that this occurs because Authenticate subscribes to accounts.instance.store (see https://github.com/js-accounts/react/blob/master/packages/react/src/authenticate.js#L25). In my use case, I was passing my app's Redux store into AccountsClient.config (when initializing the overall accounts package), which resulted in Authenticate subscribing to my app's Redux store.

I fixed my problem by not passing in my app's Redux store to AccountsClient.config, which allows accounts to use its own default, private Redux store. However, this may not be a practical solution for all users. I would recommend that Authenticate is modified so that it does not render on each and every state change -- only those state changes that are relevant, to avoid wasted rendering.