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.

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

Slow typescript compile time #217

Open
rturtu opened this issue Jun 10, 2021 · 1 comment
Open

Slow typescript compile time #217

rturtu opened this issue Jun 10, 2021 · 1 comment

Comments

@rturtu
Copy link

rturtu commented Jun 10, 2021

Hello, I work on a typescript react redux app using typesafe-actions. Recently, compiling / typechecking takes a lot of time (around 180s) (the app also requires more memory recently >8GB, but we fixed this using craco, and is not a problem anymore). The main section that I identified that takes a lot of time is the ActionType<typeof RootAction> (commenting this line will generate errors, but will reduce the compile time to ~10s).

The problem seems to be when infering all action types on the RootAction, it seems to be an union of all types from all actions.

The codebase has:

  • 150 actions (all of them typed createAsyncAction)
  • 150 epics (1 for each action)
  • ~300 handleAction functions

The setup is as follows:
Action:

export const fetchCurrentUserAsync = createAsyncAction(
  'FETCH_USER_DATA_REQUEST',
  'FETCH_USER_DATA_SUCCESS',
  'FETCH_USER_DATA_FAILURE',
  'FETCH_USER_DATA_IDLE',
)<string, User, string, null>();

Epic:

export const fetchCurrentUserData: EpicFunction = (action$, state$, { api }) =>
  action$.pipe(
    filter(isActionOf(fetchCurrentUserAsync.request)),
    switchMap(action =>
      from(api.account.fetchCurrentUserData(action.payload)).pipe(
        map(fetchCurrentUserAsync.success),
        catchError(error => handleError(error, fetchCurrentUserAsync)),
      ),
    ),
  );

Reducer:

export const user = createReducer({} as User)
  .handleAction(fetchCurrentUserAsync.success, (state, action) => {
    return {...state, ...action.payload},
      },
    };
  })

Reducers are merged using combineReducer, except from this is when merging reducers into RootReducer, where the setup is as follows (this might not be the best approach, but AFAIK this shouldn't be the main problem ):

const reducerWrapper = (reducer: any) => {
  return (state: any, action: any) => {
    if (action.type === 'RESET_SESSION') {
      state = undefined;
    }
    return reducer(state, action);
  };
};

const rootReducer = {
  account: reducerWrapper(accountReducer),
  ...
};

Action / State types:

import { StateType, ActionType } from 'typesafe-actions';
import RootReducer from '../redux/store/root-reducer';
import RootAction from '../redux/store/root-action';

declare module 'typesafe-actions' {
  export type RootState = StateType<typeof RootReducer>;
  export type RootAction = ActionType<typeof RootAction>;
  export type Services = typeof import('./index').default;

  interface Types {
    RootAction: RootAction;
  }
}

My solution would be to remove typechecking with RootAction and add the types by hand for each .handleAction, but this is a workaround, not a fix. Do you have any ideas what how to fix that long compilation time on RootAction?

@JesusTheHun
Copy link

I have the same issue with a project about the same size

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants