diff --git a/README.md b/README.md index 9fb421cda..abced7709 100644 --- a/README.md +++ b/README.md @@ -75,6 +75,18 @@ If you are editing source code, running the following command will allow hot-rel auspice develop --datasetDir data ``` +#### Environment variables + +The client looks for some environment variables. All are optional. + +> [!NOTE] +> This is an incomplete list. For other variables, search for `process.env.` in the codebase. + +- `SKIP_REDUX_CHECKS`: Set this to a truthy value to improve dev server responsiveness. Useful when you see a console warning like this: + + > ImmutableStateInvariantMiddleware took 200ms, which is more than the warning threshold of 32ms. + > If your state or actions are very large, you may want to disable the middleware as it might cause too much of a slowdown in development mode. + ### CLI (Command Line Interface) Run `auspice --help` or `auspice view --help` to see all the available command line options. diff --git a/src/store.ts b/src/store.ts index 8ea3bee76..135128400 100644 --- a/src/store.ts +++ b/src/store.ts @@ -13,12 +13,27 @@ const middleware = [ const store = configureStore({ reducer: rootReducer, middleware: (getDefaultMiddleware) => + // This adds the thunk middleware, and for development builds, other useful checks. getDefaultMiddleware({ - // TODO: Go through reducers and see why the state is not immutable nor serializable. - // These were not checked prior to the adoption of Redux Toolkit, and were not - // investigated to minimize conversion efforts. - immutableCheck: false, - serializableCheck: false + // Immutability can't be checked in some parts of the state due to circular references. + // Allow the option to disable this check through an environment variable. + // Note that it is never enabled when NODE_ENV=production. + immutableCheck: process.env.SKIP_REDUX_CHECKS + ? false + : { + ignoredPaths: [ + 'tree.nodes', + 'tree.vaccines', + 'treeToo.nodes', + 'treeToo.vaccines', + ], + }, + + // By design, the state contains many values that are non-serializable. + // Instead of adding several ignoredPaths, disable this check entirely. + // This means time-travel debugging is not possible, but it would not be + // performant enough given the large size of the Redux state. + serializableCheck: false, }).concat(middleware), devTools: process.env.NODE_ENV !== 'production', }) diff --git a/webpack.config.js b/webpack.config.js index fd5cb04df..cf332a42d 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -67,6 +67,7 @@ const generateConfig = ({extensionPath, devMode=false, customOutputPath, analyze const pluginProcessEnvData = new webpack.DefinePlugin({ "process.env": { NODE_ENV: devMode ? JSON.stringify("development") : JSON.stringify("production"), + SKIP_REDUX_CHECKS: JSON.stringify(process.env.SKIP_REDUX_CHECKS), EXTENSION_DATA: JSON.stringify(extensionData) } });