[JS] 동기, 비동기에 대해(Synchronous vs Asynchronous)

동기 vs 비동기

차이점부터 설명하자면, 동기는 '직렬적'으로 작동하는 방식이고 비동기는 '병렬적'으로 작동하는 방식이다.

즉, 비동기란 특정 코드가 끝날 때까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 것을 의미한다.

 

비동기 처리의 예

• Web API
• Ajax
• setTimeout

왼쪽 차트는 비동기로 작동하는 방식이다. 한번에 여러 테스크가 동시에 병렬적으로 실행된다.

오른쪽 차트는 동기로 작동하는 방식이다. 하나의 테스크가 끝날 때 까지 기다렸다가 다음 테스크가 실행된다.

 

※ 총 실행 시간으로 따지면 동기방식이 더 느리다.

---

동기(Synchronous)란?

• 직렬적으로 테스크를 수행하는 방식이다.
• 요청을 보낸 후 응답을 받아야지만 다음 동작이 이루어지는 방식이다. 어떠한 테스크를 처리할 동안 나머지 테스크는 대기한다.
• 실제로 cpu가 느려지는 것은 아니지만 시스템의 전체적인 효율이 저하된다고 할 수 있다.

---

비동기(Asynchronous)란?

• 병렬적으로 테스크를 수행하는 방식이다.
• 요청을 보낸 후 응답의 수락 여부와는 상관없이 다음 테스크가 동작하는 방식이다.
• 비동기 요청시 응답 후 처리할 콜백함수를 함께 알려준다. 따라서 해당 테스크가 완료되었을 때 콜백함수가 호출된다.

---

출처:https://velog.io/@khy226/%EB%8F%99%EA%B8%B0-%EB%B9%84%EB%8F%99%EA%B8%B0%EB%9E%80-Promise-asyncawait-%EA%B0%9C%EB%85%90

동기, 비동기란? (+Promise, async/await 개념)