getServerSideProps에서 context.store.dispatch를 이용해 redux store에 state를 가져오는 과정에서 질문이있습니다.

Question

안녕하세요. 제로초님! 현재 회사 프로젝트를 노드버드 강의를 참고하여 만들어보았습니다.  그런데 아래와같이 getServerSideProps을 이용해 서버사이드렌더링일때 디스패치 함수를 실행시켜 redux store에 state를 가져와 입력해주는 부분에서 속도가 너무 느려 초기 로딩속도가 너무 오래걸리는데 해결방법을 모르겠어서 질문드렸습니다.. 어떤방법으로 해결해야 서버사이드렌더링에서 로딩속도가 오래걸리는 부분을 해결할 수 있을까요?.. const   cookie   =   context . req   ?   context . req . headers . cookie   :   '' ; const   {   id   }   =   context . query ;    axios . defaults . headers . Cookie   =   '' ;    if   ( context . req   &&   cookie )   {      axios . defaults . headers . Cookie   =   cookie ;    }    context . store . dispatch ( getFollowersRequest ({   userId :   id   })) ;    context . store . dispatch ( getFollowingsRequest ({   userId :   id   })) ;    context . store . dispatch ( getUserPaperRequest ({   id   })) ;    context . store . dispatch ( getCarrerListRequest ({   userId :   id   })) ;    context . store . dispatch ( getUserInfoRequest ( id )) ;    context . store . dispatch ( getUserInfoRequest ()) ;    context . store . dispatch ( END ) ;    await   context . store . sagaTask . toPromise () ;

제로초(조현영) · Answer

throttle이라는 기능 자체는 사가에만 있는게 아니라 lodash같은 라이브러리에도 있습니다. 프론트에서 dispatch({ type: GET_USER_PAPER_REQUEST }) 이런 걸 사용하신다면 이 함수를 _.throttle(lodash의 예시입니다)로 감싸서 호출하는 경우 dispatch 자체가 5초에 한번씩만 호출되게 조절 가능합니다.

제로초(조현영) · Answer

혹시 saga에서 throttle 쓰신 부분이 있나요? throttle은 현재 버그가 있어 takeLatest 대신 쓰셔야 합니다.

Kyongsoo LEE · Answer

감사합니다 !!

Kyongsoo LEE · Answer

와.. 감사합니다 제로초님 11초에서 2~3초로 줄었습니다.. 제로초님 현재 프로젝트에서 유저가 요청할때마다 같은데이터를 계속 보내주는 것이 비효율적이라 생각하여 throttle을 사용해 아래와같이 코드를 작성하여 데이터를 요청하는 함수가 실행되고 5초가 지날때까지 요청이 안가도록 해주었는데요 제가  throttle에 대해 알맞게 이해한게 맞을까요?, 그리고 이러한 경우에 takelastest를 사용해도 제가 하고자하는 기능 구현이 될까요? function*   watchGetUserPapers ()   {    yield   throttle ( 5000 ,   getUserPaperRequest ,   getUserPapers ) ; }