동기 & 비동기

동기(synchronous) : 순서대로 일을 처리하는 방식
비동기(asynchronous) : 순서대로 일을 처리 하지 않고 빨리 처리할 수 있는 것들을 먼저 처리하는 방식

동기(Synchronous)

• 직렬적으로 작업 수행
• 요청을 보냈다면, 응답을 받아야 다음 동작 수행 가능
• 순차적으로 실행
• 어떤 작업이 수행중이라면 뒤의 작업은 대기
• 블로킹(작업 중단) 발생

비동기(Asynchronous)

• 병렬적으로 작업 수행
• 현재 작업의 종료여부와 무관하게 다음 작업 실행
• 완료 순서가 보장되지 않음
• 블로킹 발생하지 않음

비동기 방식이 필요 이유

→ 자바스크립트는 동기 방식의 언어이지만, 비동기 방식이 필요하다. 예를 들어, 로딩되는 데 30초 이상이 걸린다고 할 때 웹 페이지는 이 동작이 끝날 때까지 화면에 나타나지 않거나 다음 동작을 수행하는데 지장을 주게 된다. 따라서 이런 상황을 방지하기 위해 비동기 방식이 필요하다.

• 응답성 향상
• 블로킹 발생 방지
• 더 나은 UX 제공
• 리소스 사용 최적화

비동기 방식 사용

• Callback 함수
• Promise
• async / await

references
👉 https://ljtaek2.tistory.com/142