add why did you render (keybase#22932)

turlodales · Mar 6, 2020 · 6a4d0e2 · 6a4d0e2
1 parent 5e530d7
commit 6a4d0e2
Show file tree

Hide file tree

Showing 8 changed files with 35 additions and 2 deletions.
diff --git a/shared/__mocks__/feature-flags.tsx b/shared/__mocks__/feature-flags.tsx
@@ -14,6 +14,7 @@ const ff: FeatureFlags = {
   teamInvites: false,
   teamsRedesign: true,
   webOfTrust: false,
+  whyDidYouRender: false,
 }
 
 console.warn('feature flag mock in effect')

diff --git a/shared/desktop/renderer/main.desktop.tsx b/shared/desktop/renderer/main.desktop.tsx
@@ -4,6 +4,17 @@ import 'react-hot-loader'
 import {_setSystemIsDarkMode, _setSystemSupported} from '../../styles/dark-mode'
 import {isDarwin} from '../../constants/platform'
 import * as SafeElectron from '../../util/safe-electron.desktop'
+import flags from '../../util/feature-flags.desktop'
+import React from 'react'
+
+if (__DEV__ && flags.whyDidYouRender) {
+  const whyDidYouRender = require('@welldone-software/why-did-you-render/dist/no-classes-transpile/umd/whyDidYouRender.min.js')
+  const ReactRedux = require('react-redux')
+  whyDidYouRender(React, {
+    trackAllPureComponents: true,
+    trackExtraHooks: [[ReactRedux, 'useSelector']],
+  })
+}
 
 _setSystemIsDarkMode(SafeElectron.workingIsDarkMode())
 _setSystemSupported(isDarwin)

diff --git a/shared/desktop/webpack.config.babel.js b/shared/desktop/webpack.config.babel.js
@@ -102,6 +102,16 @@ const config = (_, {mode}) => {
     }
     console.warn('Injecting defines: ', defines)
 
+    const alias = {}
+    if (isHot) {
+      // hot loader
+      alias['react-dom'] = '@hot-loader/react-dom'
+    }
+    if (isDev) {
+      // enable why did you render
+      alias['react-redux'] = 'react-redux/dist/react-redux.js'
+    }
+
     return {
       bail: true,
       context: path.resolve(__dirname, '..'),
@@ -121,7 +131,7 @@ const config = (_, {mode}) => {
         new webpack.IgnorePlugin(/^lodash$/), // Disallow entire lodash
       ],
       resolve: {
-        ...(isHot ? {alias: {'react-dom': '@hot-loader/react-dom'}} : {}),
+        alias,
         extensions: ['.desktop.js', '.desktop.tsx', '.js', '.jsx', '.tsx', '.ts', '.json'],
       },
       stats: {

diff --git a/shared/package.json b/shared/package.json
@@ -70,6 +70,7 @@
     "@react-native-community/netinfo": "4.2.2",
     "@react-navigation/core": "3.5.1",
     "@react-navigation/native": "3.6.2",
+    "@welldone-software/why-did-you-render": "4.0.5",
     "base64-js": "1.3.1",
     "buffer": "5.4.3",
     "classnames": "2.2.6",

diff --git a/shared/util/feature-flags.d.ts b/shared/util/feature-flags.d.ts
@@ -8,6 +8,7 @@ export type FeatureFlags = {
   teamInvites: boolean
   teamsRedesign: boolean
   webOfTrust: boolean
+  whyDidYouRender: boolean
 }
 
 declare const ff: FeatureFlags

diff --git a/shared/util/feature-flags.desktop.tsx b/shared/util/feature-flags.desktop.tsx
@@ -15,6 +15,7 @@ const ff: FeatureFlags = {
   teamInvites: false,
   teamsRedesign: false,
   webOfTrust: false,
+  whyDidYouRender: false,
 }
 
 const inAdmin: {[K in keyof FeatureFlags]?: boolean} = {

diff --git a/shared/util/feature-flags.native.tsx b/shared/util/feature-flags.native.tsx
@@ -15,6 +15,7 @@ const ff: FeatureFlags = {
   teamInvites: false,
   teamsRedesign: false,
   webOfTrust: false,
+  whyDidYouRender: false,
 }
 
 // load overrides

diff --git a/shared/yarn.lock b/shared/yarn.lock
@@ -2454,6 +2454,13 @@
     "@webassemblyjs/wast-parser" "1.8.5"
     "@xtuc/long" "4.2.2"
 
+"@welldone-software/[email protected]":
+  version "4.0.5"
+  resolved "https://registry.yarnpkg.com/@welldone-software/why-did-you-render/-/why-did-you-render-4.0.5.tgz#15a8de16fc84307ab401fb3f859d9a94f2b5334c"
+  integrity sha512-igBq0kGqKUdwMUQFgPkDzKQS+8MHqhDvF2j2w+05yS7LqcIIZyBL7FRYf1Hvm1QABx86prS7xwiIJa0U0ev5JA==
+  dependencies:
+    lodash "^4"
+
 "@xtuc/ieee754@^1.2.0":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@xtuc/ieee754/-/ieee754-1.2.0.tgz#eef014a3145ae477a1cbc00cd1e552336dceb790"
@@ -8523,7 +8530,7 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/lodash.upperfirst/-/lodash.upperfirst-4.3.1.tgz#1365edf431480481ef0d1c68957a5ed99d49f7ce"
   integrity sha1-E2Xt9DFIBIHvDRxolXpe2Z1J984=
 
-[email protected], lodash@^4.0.1, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.12, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.3, lodash@^4.17.5, lodash@^4.3.0, lodash@^4.5.0, lodash@^4.6.0, lodash@^4.6.1:
+[email protected], lodash@^4, lodash@^4.0.1, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.12, lodash@^4.17.13, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.3, lodash@^4.17.5, lodash@^4.3.0, lodash@^4.5.0, lodash@^4.6.0, lodash@^4.6.1:
   version "4.17.15"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.15.tgz#b447f6670a0455bbfeedd11392eff330ea097548"
   integrity sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A==