Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

add useSelector support for 7.1.0 and also useTrackedState for reactive-react-redux #26

Closed
wants to merge 16 commits into from
Closed

add useSelector support for 7.1.0 and also useTrackedState for reactive-react-redux #26

wants to merge 16 commits into from

Conversation

dai-shi
Copy link

@dai-shi dai-shi commented Jul 29, 2019 •
edited

I think I did it pretty well with runBenchmarks.js. [type]-[version]
The remaining concern is that benchmark scenarios are now triple with mostly copy-and-paste.
Does anyone have a better idea?

Here's the result:

$ yarn start
yarn run v1.13.0
$ node ./runBenchmarks.js
Running benchmark deeptree
  react-redux type-version: connect-5.1.1
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-6.0.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useTrackedState-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)

Results for benchmark deeptree:
┌───────────────────────────┬─────────┬──────────────┬───────────┬───────────┬──────────┬─────────────────────────────────────────────────────────────────────────┐
│ Type-Version              │ Avg FPS │ Render       │ Scripting │ Rendering │ Painting │ FPS Values                                                              │
│                           │         │ (Mount, Avg) │           │           │          │                                                                         │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ connect-5.1.1             │ 23.12   │ 118.7, 0.1   │ 19747.24  │ 6009.08   │ 2371.71  │ 22,24,22,25,24,23,26,23,24,23,24,25,26,25,20,17,19,18,19,19             │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ connect-6.0.0             │ 14.11   │ 90.8, 4.5    │ 24127.39  │ 3362.54   │ 1366.11  │ 14,13,14,15,14,13,14,15,14,15,14,14                                     │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ connect-7.1.0             │ 41.72   │ 107.7, 0.6   │ 10367.16  │ 10305.98  │ 5719.96  │ 51,55,54,55,52,56,54,55,53,54,43,33,32,31,33,32,22,23,22,23,23          │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ useSelector-7.1.0         │ 44.61   │ 82.4, 0.5    │ 9690.65   │ 10776.30  │ 5909.30  │ 57,59,57,59,60,59,55,60,59,42,34,33,35,28,24,25,23,24,24                │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ useSelector-rrr-4.2.0     │ 44.56   │ 72.9, 0.7    │ 9506.13   │ 10813.97  │ 6015.37  │ 56,58,59,58,57,60,59,60,59,58,42,35,34,33,30,23,24,22,24,24             │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ useTrackedState-rrr-4.2.0 │ 39.98   │ 81.1, 1.0    │ 9950.90   │ 10477.39  │ 5857.69  │ 44,45,34,33,38,52,54,58,56,53,54,47,32,33,32,34,32,25,31,32,25,23,19,19 │
└───────────────────────────┴─────────┴──────────────┴───────────┴───────────┴──────────┴─────────────────────────────────────────────────────────────────────────┘
Running benchmark deeptree-nested
  react-redux type-version: connect-5.1.1
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-6.0.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useTrackedState-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)

Results for benchmark deeptree-nested:
┌───────────────────────────┬─────────┬──────────────┬───────────┬───────────┬──────────┬───────────────────────────────────────────────────────────────────────────────┐
│ Type-Version              │ Avg FPS │ Render       │ Scripting │ Rendering │ Painting │ FPS Values                                                                    │
│                           │         │ (Mount, Avg) │           │           │          │                                                                               │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼───────────────────────────────────────────────────────────────────────────────┤
│ connect-5.1.1             │ 51.14   │ 179.8, 0.7   │ 7196.08   │ 4557.65   │ 1783.12  │ 57,58,55,56,57,56,55,54,55,53,55,53,46,44,45,46,48,46,44,42,45,43,45,42,42    │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼───────────────────────────────────────────────────────────────────────────────┤
│ connect-6.0.0             │ 17.03   │ 130.3, 6.3   │ 20360.52  │ 3719.39   │ 824.22   │ 19,18,19,20,21,20,23,21,18,20,19,14,15,14,15,13,14,12,13,12,14,14             │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼───────────────────────────────────────────────────────────────────────────────┤
│ connect-7.1.0             │ 52.22   │ 142.2, 0.4   │ 6322.56   │ 4484.55   │ 1793.23  │ 58,59,58,59,58,57,56,54,57,55,54,48,49,44,46,48,45,49,45,44,43,46,42,43,43    │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼───────────────────────────────────────────────────────────────────────────────┤
│ useSelector-7.1.0         │ 52.59   │ 103.5, 0.4   │ 5315.03   │ 4532.30   │ 1817.59  │ 58,60,57,59,58,59,58,55,57,56,54,57,55,57,50,48,49,50,46,50,48,46,43,48,45,45 │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼───────────────────────────────────────────────────────────────────────────────┤
│ useSelector-rrr-4.2.0     │ 52.99   │ 105.4, 1.4   │ 5082.65   │ 4480.35   │ 1824.95  │ 58,59,58,59,58,57,58,56,55,56,55,57,56,55,51,46,49,50,48,47,44,48,47,46,45,45 │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼───────────────────────────────────────────────────────────────────────────────┤
│ useTrackedState-rrr-4.2.0 │ 53.08   │ 120.5, 1.2   │ 4711.62   │ 4485.96   │ 1809.16  │ 58,59,58,56,57,56,57,55,47,50,49,50,49,45,43,48,47,47                         │
└───────────────────────────┴─────────┴──────────────┴───────────┴───────────┴──────────┴───────────────────────────────────────────────────────────────────────────────┘
Running benchmark forms
  react-redux type-version: connect-5.1.1
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-6.0.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useTrackedState-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)

Results for benchmark forms:
┌───────────────────────────┬─────────┬──────────────┬───────────┬───────────┬──────────┬─────────────────────────────────────────────────────────────────────────────────────┐
│ Type-Version              │ Avg FPS │ Render       │ Scripting │ Rendering │ Painting │ FPS Values                                                                          │
│                           │         │ (Mount, Avg) │           │           │          │                                                                                     │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ connect-5.1.1             │ 57.21   │ 962.3, 0.2   │ 6015.14   │ 1046.54   │ 2847.59  │ 56,57,58,57,58,57,58,57,58,57,58,56,57,59,58,56,58,57,55,56,58,55,55                │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ connect-6.0.0             │ 55.46   │ 944.8, 1.9   │ 11619.02  │ 861.48    │ 2261.33  │ 56,54,57,54,56,55,54,56,55,53,55,53,58,55,58,57,55,56,53,57,56,55,57,56,55,57,56,56 │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ connect-7.1.0             │ 57.18   │ 942.4, 0.3   │ 6350.89   │ 937.68    │ 2566.82  │ 56,58,57,58,57,58,57,58,57,56,60,58,53,58,57,58,57,57                               │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ useSelector-7.1.0         │ 57.42   │ 971.6, 0.2   │ 5206.20   │ 1040.26   │ 2810.55  │ 56,57,58,57,58,57,60,57,58,57,58,57,58,56,59,58,57,58,58                            │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ useSelector-rrr-4.2.0     │ 57.53   │ 950.1, 0.4   │ 5243.96   │ 975.52    │ 2667.12  │ 56,57,58,57,58,57,58,57,58,60,58,56,58,57,58,57,58,57,58,58                         │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ useTrackedState-rrr-4.2.0 │ 57.50   │ 968.3, 0.6   │ 5976.38   │ 1100.85   │ 2845.86  │ 57,56,58,57,58,57,58,57,59,57,58,57,58,57,59,57,58,57,57                            │
└───────────────────────────┴─────────┴──────────────┴───────────┴───────────┴──────────┴─────────────────────────────────────────────────────────────────────────────────────┘
Running benchmark stockticker
  react-redux type-version: connect-5.1.1
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-6.0.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useTrackedState-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)

Results for benchmark stockticker:
┌───────────────────────────┬─────────┬──────────────┬───────────┬───────────┬──────────┬─────────────────────────────────────────────────────────────────────────┐
│ Type-Version              │ Avg FPS │ Render       │ Scripting │ Rendering │ Painting │ FPS Values                                                              │
│                           │         │ (Mount, Avg) │           │           │          │                                                                         │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ connect-5.1.1             │ 59.20   │ 178.3, 0.4   │ 13861.48  │ 10625.63  │ 3613.06  │ 53,60,59,60,59,60,59,60,58,60,59,60,59,60,59,60,59,60,59,60,59,60,60    │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ connect-6.0.0             │ 21.41   │ 170.9, 5.1   │ 23188.04  │ 4479.60   │ 1334.57  │ 22,23,22,21,22,21,22,21,20,21,20,20                                     │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ connect-7.1.0             │ 55.11   │ 241.0, 0.3   │ 14093.91  │ 10291.27  │ 3461.91  │ 53,58,59,56,59,57,56,58,55,57,59,56,55,56,31,49,50,57,55,57,55,53,54,54 │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ useSelector-7.1.0         │ 59.24   │ 153.1, 0.4   │ 10222.92  │ 12621.06  │ 4165.74  │ 57,59,60,59,60,59,60,59,60,59,60,59,60,59,60,59,59                      │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ useSelector-rrr-4.2.0     │ 59.23   │ 136.3, 1.7   │ 11838.46  │ 11729.19  │ 4013.76  │ 56,60,59,60,59,60,59,60,59,60,59,60,59,60,59,60,59,60,58,59,58,60,60    │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────┤
│ useTrackedState-rrr-4.2.0 │ 55.56   │ 161.1, 2.5   │ 13776.99  │ 10417.79  │ 3605.89  │ 54,60,59,60,59,60,58,59,57,55,58,60,58,55,52,54,52,51,48,51,52,51,50,50 │
└───────────────────────────┴─────────┴──────────────┴───────────┴───────────┴──────────┴─────────────────────────────────────────────────────────────────────────┘
Running benchmark tree-view
  react-redux type-version: connect-5.1.1
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-6.0.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useTrackedState-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)

Results for benchmark tree-view:
┌───────────────────────────┬─────────┬──────────────┬───────────┬───────────┬──────────┬─────────────────────────────────────────────────────────────────────────────────────┐
│ Type-Version              │ Avg FPS │ Render       │ Scripting │ Rendering │ Painting │ FPS Values                                                                          │
│                           │         │ (Mount, Avg) │           │           │          │                                                                                     │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ connect-5.1.1             │ 51.39   │ 501.5, 0.2   │ 7906.98   │ 8081.01   │ 595.82   │ 48,51,56,43,49,50,53,47,51,53,52,49,51,52,58,50,55,50,48,56,51,53,53                │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ connect-6.0.0             │ 40.85   │ 487.2, 17.2  │ 18761.17  │ 4396.43   │ 300.58   │ 44,39,41,43,45,34,39,41,39,40,39,40,43,44,46,38,43,42,35,45,43,40,45,40,36,40,42,42 │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ connect-7.1.0             │ 52.08   │ 549.0, 0.2   │ 7831.28   │ 8387.32   │ 612.22   │ 52,53,54,47,48,52,49,54,47,56,53,50,52,48,56,52,53,55,51,52,56,54,53,51,51          │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ useSelector-7.1.0         │ 50.85   │ 415.0, 1.0   │ 6019.33   │ 8260.46   │ 639.90   │ 43,53,54,46,43,50,55,52,54,48,54,49,50,51,47,57,53,55,54,49,50,55,51,46,52,54,54    │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ useSelector-rrr-4.2.0     │ 50.50   │ 419.1, 2.6   │ 5668.93   │ 8703.02   │ 643.78   │ 45,51,46,42,52,47,54,48,50,53,50,45,51,49,57,55,53,50,53,55,47,44,50,53,53          │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼─────────────────────────────────────────────────────────────────────────────────────┤
│ useTrackedState-rrr-4.2.0 │ 50.27   │ 475.2, 5.2   │ 7559.43   │ 8263.97   │ 612.24   │ 42,50,51,47,48,51,48,53,56,40,53,49,51,47,52,47,57,54,55,54,50,51,53,50,46,53,53    │
└───────────────────────────┴─────────┴──────────────┴───────────┴───────────┴──────────┴─────────────────────────────────────────────────────────────────────────────────────┘
Running benchmark twitter-lite
  react-redux type-version: connect-5.1.1
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-6.0.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: connect-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-7.1.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useSelector-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)
  react-redux type-version: useTrackedState-rrr-4.2.0
    Checking max FPS... (30 seconds)
    Running trace...    (30 seconds)

Results for benchmark twitter-lite:
┌───────────────────────────┬─────────┬──────────────┬───────────┬───────────┬──────────┬──────────────────────────────────────────────────────────────────────────────────┐
│ Type-Version              │ Avg FPS │ Render       │ Scripting │ Rendering │ Painting │ FPS Values                                                                       │
│                           │         │ (Mount, Avg) │           │           │          │                                                                                  │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼──────────────────────────────────────────────────────────────────────────────────┤
│ connect-5.1.1             │ 50.55   │ 3.7, 0.5     │ 20439.70  │ 3665.49   │ 673.92   │ 60,59,60,59,60,59,58,57,59,58,55,52,47,40,39,35,36,31,32,32                      │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼──────────────────────────────────────────────────────────────────────────────────┤
│ connect-6.0.0             │ 29.86   │ 2.8, 5.1     │ 26799.24  │ 1429.80   │ 327.82   │ 59,60,59,53,47,41,36,32,30,27,26,23,22,20,19,20,18,17,18,16,18,16,15,15          │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼──────────────────────────────────────────────────────────────────────────────────┤
│ connect-7.1.0             │ 50.77   │ 3.8, 0.2     │ 19874.18  │ 3766.76   │ 688.27   │ 60,59,60,59,60,59,58,57,60,58,60,56,59,58,57,54,48,43,40,42,40,37,33,34,30,29,29 │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼──────────────────────────────────────────────────────────────────────────────────┤
│ useSelector-7.1.0         │ 58.46   │ 3.1, 0.5     │ 14830.42  │ 5085.72   │ 877.47   │ 60,59,60,59,60,59,60,59,60,59,60,58,59,58,57,56,60,59,57,56,50,50                │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼──────────────────────────────────────────────────────────────────────────────────┤
│ useSelector-rrr-4.2.0     │ 58.02   │ 2.4, 2.5     │ 14641.09  │ 5089.34   │ 897.07   │ 59,60,59,60,59,60,59,60,59,60,59,60,59,56,58,54,57,58,59,56,57,54,52,52          │
├───────────────────────────┼─────────┼──────────────┼───────────┼───────────┼──────────┼──────────────────────────────────────────────────────────────────────────────────┤
│ useTrackedState-rrr-4.2.0 │ 58.87   │ 2.9, 2.0     │ 13127.55  │ 5353.57   │ 935.13   │ 59,60,59,60,59,60,59,60,59,60,59,60,59,58,60,58,56,60,58,60,57,59,56,59,57,57    │
└───────────────────────────┴─────────┴──────────────┴───────────┴───────────┴──────────┴──────────────────────────────────────────────────────────────────────────────────┘
✨  Done in 2713.90s.

dai-shi
dai-shi commented Jul 29, 2019
View reviewed changes
runBenchmarks.js
return a.concat([["useSelector", v], ["useTrackedState", v]]);
}
const [, major, minor] = /^(\d+)\.(\d+)\./.exec(v);
if (major >= 7 && minor >= 1) {
Copy link
Author

@dai-shi dai-shi Jul 29, 2019 •
edited

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh, this is too naive. It will fail with "8.0.0"

better to use a library for this: something like https://www.npmjs.com/package/compare-versions

This was referenced Nov 9, 2019
Closed
Closed
@dai-shi dai-shi mentioned this pull request Jan 20, 2020
Closed
@dai-shi dai-shi mentioned this pull request Jul 9, 2021
Closed
@dai-shi dai-shi closed this Sep 17, 2021
@markerikson markerikson mentioned this pull request Sep 23, 2021
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

None yet
1 participant
@dai-shi