memoize state reading

[petemill]

Fix #11515

The reactjs/reselect library is a common method to memoize the result of functions that read or compute data based on state. It creates functions that are only re-computed when the relevant state changes. It becomes useful when:

1. A state tree is large
2. When portions of the state tree are modified often, and not all of the state tree is modified on every action dispatch
3. When immutablejs is used to represent state, and therefore partial tree equality comparison oldstate.get('portion1') === newstate.get('portion2') can be used very effectively.

Problems this PR aims to solve

• Time spent recalculating react/redux component instance mergeProps functions
  • A high number of components exist that subscribe to state changes
  • A high number of actions are dispatched that change certain relevant state properties
  • A high number of time is spent re-computing state changes where dependent state properties have not changed
  • Many components run the same expensive state-parsing functions within the same render-cycle but re-run those functions nevertheless.

This PR adds the following features:

• Common state accessors that are not dynamic, and should only be re-evaluated when a portion of the state tree changes are turned in to static memoized functions (e.g. in xxxState.js)
  • Identify and address some main ones
  • Create Issues for refactoring some others
• Component instance-specific state accessors that are computed from dynamic properties, e.g. the state of a specific tab, frame, etc, are memoized per-instance use-case
  • Allow mergeProps to return a function or instance-specific memoized selector
  • Consider re-reselect to cache common dynamic selectors (e.g. frames or tabs)
• Some components are passed data as ownProps, when a child's state is very closely tied to its immediate parent, instead of calculating the same props again, and will benefit from its parent's mergeProp memoization
• Enhances equality comparison for appState / windowState by only merging the two when neccessary

This PR results in the following metric improvements:
...

Submitter Checklist:

• Submitted a ticket for my issue if one did not already exist.
• Used Github auto-closing keywords in the commit message.
• Added/updated tests for this change (for new code or code which already has tests).
• Ran git rebase -i to squash commits (if needed).
• Tagged reviewers and labelled the pull request as needed.

Test Plan:

Reviewer Checklist:

Tests

• Adequate test coverage exists to prevent regressions
• Tests should be independent and work correctly when run individually or as a suite ref
• New files have MPL2 license header

[codecov-io]

Codecov Report

Merging #12105 into master will increase coverage by 0.07%.
The diff coverage is 64.08%.

@@            Coverage Diff             @@
##           master   #12105      +/-   ##
==========================================
+ Coverage   56.27%   56.34%   +0.07%     
==========================================
  Files         282      282              
  Lines       28027    28086      +59     
  Branches     4584     4594      +10     
==========================================
+ Hits        15772    15825      +53     
- Misses      12255    12261       +6

Flag	Coverage Δ
#unittest	56.34% <64.08%> (+0.07%)	⬆️

Impacted Files	Coverage Δ
app/common/state/notificationBarState.js	52% <40%> (-48%)	⬇️
app/renderer/components/reduxComponent.js	60.9% <63.41%> (-0.31%)	⬇️
js/state/frameStateUtil.js	67.17% <67.16%> (+6.01%)	⬆️
app/common/state/windowState.js	91.83% <75%> (-0.42%)	⬇️
app/common/state/siteSettingsState.js	59.09% <90%> (+1.94%)	⬆️
js/stores/appStoreRenderer.js	91.66% <0%> (-8.34%)	⬇️
js/stores/windowStore.js	27.65% <0%> (-0.3%)	⬇️
... and 1 more

[alexwykoff]

closing in favor of other priorities