들어가는 글

JavaScript Callback, Promise, Async/Await 코딩 방식의 차이를 적어봤습니다.

코드

https://github.com/drypot/javascript-study/tree/master/async

파일 5개가 등장하는데 위 리포지터리에 들어있습니다.
예제 코드들은 실제로 현업에서 많이 사용되는 방식으로 만들었습니다.

서브 루틴

untitled-1.png

왼쪽은 Callback 스타일에서 사용할 서브루틴입니다.
오른쪽은 Promise, Async/Await 에서 사용할 Promise 서브루틴입니다.

메인 루틴

untitled-2.png

왼쪽부터 Callback, Promise, Async/Await 입니다.
실행 결과는 각 소스 파일 하단에 있습니다.

루프

untitled-3.png

왼쪽은 Callback 스타일, 오른쪽 Async/Await 스타일 루프입니다.
Promise 는 제외했습니다.

속도와 메모리

http://bluebirdjs.com/docs/benchmarks.html

Promise 는 Callback 보다 메모리를 많이 먹습니다.
펑션 오브젝트를 추가로 여러개 만들기 때문입니다.

Async/Await 은 기본적으로 Promise 를 사용해 구현됩니다.
코드 흐름은 제네레이터로 분해됩니다.
해서 양상은 순수 Promise 와 비슷합니다.

사용될 환경, 사용자 취향에 따라 적절히 골라 쓰시면 되겠습니다.