반응형
250x250
Notice
Recent Posts
Recent Comments
Link
관리 메뉴

짧은코딩

await 연달아쓰면 Promise.allSettled를 생각해보자 본문

JS/인간 JS엔진

await 연달아쓰면 Promise.allSettled를 생각해보자

5_hyun 2024. 1. 29. 00:15

await을 남용한 것과 최적화한 예시

// setTimeout을 Promise로 만드는 법
function delayP(ms) {
  return new Promise((resolve, reject) => {
    setTimeout(resolve, ms);
  });
}

async function a() {
  await delayP(3000);
  await delayP(6000);
  await delayP(9000);
} // 토탈 18초

async function b() {
  const p1 = delayP(3000); // 3초
  const p2 = delayP(6000); //6초
  await Promise.allSettled([p1,p2]); // 6초
  await delayP(9000); // 9초
} //토탈 15초
  • 함수 a는 await을 연달아서 사용하여 시간이 많이 소모된다.
  • 함수 b는 동시에 사용할 수 있는 것들을 allSettled로 묶어서 시간 소요가 짧게 된다.
  • promise 흐름
    • 동기 부분이 있으니까 실행은 바로 -> resolve(), reject()가 되어야 되니까 결괏값이 나올 때는 나중 -> 결괏값을 사용하는 것은 더 나중
    • 백그라운드에서 동시에 할 수 있는 애들은 Promise.allSettled로 바로 실행하여 시간을 아끼자

실행도 바로 하고 결괏값도 바로 쓰고 싶으면

// 이런 상황
axios.get().then(()=>{});
  • 실행은 바로 -> 결괏값도 바로 쓰고 싶은데 -> 결괏값이 나오면 -> them, await, Promise.all 이런 게 결괏값을 기다리고 실행
  • 이러면 콜백이랑 다를 게 없다.
  • 초보 개발자들은 주로 이렇게 사용할 것이다.

실전 예시

-시간이 길게 소요되는 코드

async function createPost(){
  const post = await db.getPosts(); // 게시물 조회
  if(post){
    res.status(403).send('이미 게시글이 존재합니다.')
  } else {
    await db.createPost(); // 게시글 작성
    await db.userIncrementPostCount(); // 사용자에 작성글 카운트 1 올림
    await db.createNoti(); // 새로운 게시글 알림 등록
  }
}
  • 여기서 작성글 카운트 1 올리는 거랑 새로운 게시글 알림 등록은 굳이 순차적으로 할 필요가 없음

-수정된 코드

async function createPost(){
  const post = await db.getPosts(); // 게시물 조회
  if(post){
    res.status(403).send('이미 게시글이 존재합니다.')
  } else {
    await db.createPost(); // 게시글 작성

    const p1 = db.userIncrementPostCount(); // 사용자에 작성글 카운트 1 올림
    const p2 = db.createNoti(); // 새로운 게시글 알림 등록
    await Promise.allSettled([p1, p2]);
  }
}
  • allSettled를 사용하여 처리하면 시간이 더 줄어든다.
  • 이렇게 하면 응답 시간이 줄어든다.
  • 항상 동시에 진행해도 될 것이 있나 체크하는 게 중요하다.

-출처

https://www.youtube.com/watch?v=r6Tl4VcJaEI&list=PLcqDmjxt30Rt9wmSlw1u6sBYr-aZmpNB3&index=16

 

728x90
반응형

'JS > 인간 JS엔진' 카테고리의 다른 글

클로저  (1) 2024.01.30
async/await, Promise로 바꾸기  (1) 2024.01.28
Promise에도 동기는 있다!  (0) 2024.01.27
비동기는 동시가 아니다  (1) 2024.01.27
Promise, async/await  (2) 2024.01.25
Comments