비동기처리시 async함수의 함정

// const URL = "https://jsonplaceholder.typicode.com/todos/";

  //   (async function go() {
  //     console.time(1);
  //     const urls = [URL + 1, URL + 2];

  //     const res1 = await fetch(urls[0]);
  //     const data1 = await res1.json();

  //     const res2 = await fetch(urls[1]);
  //     const data2 = await res2.json();
  //     console.log(data1, data2);
  //     console.timeEnd(1);
  //   })();
  //이코드는 직렬로 시간차를 두고 처리가 되고있다.
  // 총 수행시간은 4초임
  // 응답이 늦어지는걸 원하지 않는다면, 즉, 병렬로 처리하고 싶다면
  //즉, 동시에 병렬적으로 결과를 보내주면 되는것이다.
  //Promise.all 이라는건 병렬로 두가지 요청을 보낼 수 가있다.

  const URL = "https://jsonplaceholder.typicode.com/todos/";

  (async function go() {
    console.time(1);
    const urls = [URL + 1, URL + 2];

    const requests = urls.map((url) => fetch(url)); // url을 받아서 fetch요청을 보내버리면 되는거에요., 그다음은

    const [res1, res2] = await Promise.all(requests); // 여기서 그 결과를 배열로 담는거죠.// 어차피 map의 반환값은 배열이니까, 배열로 바로 받으면 되겠죠,
    //  여기서 await으로 받아 줄 수가 있죠.
    const [data1, data2] = await Promise.all([ress1.json(), res2.json()]);

    console.log(data1, data2);
    console.timeEnd(1);
  })();

  // 아까 는 4초 걸렸는데, 지금 이코드는 2초정도 나온다. 시간이 절반정도 줄었다.
  // 크롬개발자도구 Network 보면 차트에 Waterfall 보면 병렬로 요청을 간거를 볼수가있다.
  // 우리가 await를 자주 쓰는데, 직렬로 보내는 코드를 짜면 느리고, 병렬 코드를 짜야 빠르다.
  // await 는 뭐하는 코드일까요? Blocking 을 하는 코드입니다. 조심히 써야함.