Promise.all()

비동기 함수를 하나씩 실행함

async function getMovie(id: string) {
  const response = await fetch(`${API_URL}/${id}`);
  return response.json();
}

async function getVideos(id: string) {
  const response = await fetch(`${API_URL}/${id}/videos`);
  return response.json();
}

export default async function  MovieDetail({ params: {id} } : {params: {id:string}}) {
  console.log("Start fetching");
  const movie = await getMovie(id);
  const videos = await getVideos(id);
  console.log("End fetching");
  
  return(
    <div>
      <h1>{movie.title}</h1>
    </div>
  )
}

비동기 함수를 병렬실행 누가 먼저 시작했던 끝나는 시간은 동시에.

import { API_URL } from "../../../(home)/page"

async function getMovie(id: string) {
  const response = await fetch(`${API_URL}/${id}`);
  return response.json();
}

async function getVideos(id: string) {
  const response = await fetch(`${API_URL}/${id}/videos`);
  console.log("response>>>", response);
  return response.json();
}

export default async function  MovieDetail({ params: {id} } : {params: {id:string}}) {
  console.log("start fetching");
  const [movie, videos] = await Promise.all([getMovie(id),getVideos(id)]);
  console.log("end fetching");

  return(
    <div>
      <h1>{movie.title}</h1>
    </div>
  )
}