4주차 - 비동기

무엇이든 궁금한점

들어가기전 (그냥 설명하고 싶었음)

Javascript 개발 파이프라인

• Code → Transpiler → Packaging → CI → Deploy

• Code: ES3.1, 5, 6, TypeScript, Kotlin, …

• Transpiler: tsc, kotlinc, babel, …

• Packaging(bundle): webpack, rollup, vite

Java 개발 파이프라인

• Code → Compile → JAR/WAR → JVM

• Java도 client-side에서 사용됨
• 안드로이드

Kotlin

• server-side

• client-side
• 안드로이드
• 웹(kotlin-js)

• 어떤 차이가 있을까?
• 참고포스트
• JVM(Java Virtual Machine)
• DVM(Dalvik Virtual Machine)
• ART(Andriod Runtime)

program & timing

• 프로그램은 보통 Load → Run → Terminate → Load … 의 과정의 반복

• 유지보수란?
• Language code → File 까지 가는 과정

• 개발의 목표
• 시간(비용)을 줄이는 것 = 만들어진 코드를 얼마나 안건드리고 더 많은 기능이나 수정에 대응할 수 있을까?
• 변화에 대응하는 여파를 최소화시켜서 수정할 파일을 적게 만드는 것!

• 코드의 설계가 잘 됐는지 따져보기
• 수정사항을 반영하는 과정에서 몇 개의 파일이 수정 되었는가
• 자동화를 얼마나 많이 해놨는가
• 코드의 격리를 얼마나 잘 해놨는가
• Layered Architecture

병렬성(Parallelism) vs 동시성(Concurrency)

• 어떤 차이가 있을까요? 일단 고민해보기
정답
동시성은 “동시에 일어나는 것 처럼” 보이게 하는 것
병렬성은 “동시에 일어나는 것”

• 싱글 스레드 → 동시성

• 멀티 스레드 → 병렬성
• 정확히는 멀티코어

병렬성

• 병렬 처리의 문제
• 메모리를 공유한다.
• 공유하는 메모리에 대해 한번에 하나의 프로세서만 사용할 수 있도록 blocking을 유발한다.

• blocking된 대상 프로세서는 어떤 행동을 할까?
• 좌절(그대로 접근을 포기)
• 탈취(메모리 점유하는 프로세서부터 권한을 강제로 넘겨받음)
• 대기 (자바의 Object.wait() 등)

• 화장실이라는 공유 공간 (메모리)
• 얼만큼의 영역을 통제할 것 인가
• 화장실이라는 영역 자체에 Lock을 걸 것인가
• 화장실의 각각의 칸에 Lock을 걸 것인가

자바스크립트

• 병렬성 처리: 백그라운드에서 발생하는 작업은 멀티 쓰레드로 해결
• GPU를 사용하는 DOM event
• timer(setTmeout, setInterval)
• postmessage API
• 네트워크 통신 작업
• 파일 I/O
• 주로 메모리 영향이 없는 작업들

• 동시성 처리: 이벤트 루프는 메인 쓰레드(싱글 쓰레드)로 해결
• 위에서 언급한 것들(GPU 사용 작업, Timer, Networking 등)은 멀티 쓰레드로 실행되지만, 결국 이들을 실행하는 코드는 이벤트 루프에 올라감 → 싱글스레드로 처리됨

sync와 async

• 3개를 요청했는데
• 응답에서 그 순서가 지켜진다면 Sync
• 어떤 게 먼저 올지 모른다면 Async

• async + blocking
• 세 번째에 보낸 요청이 먼저 올 수도 있는데, 첫 번째 요청을 보낸 다음에 block을 해버린다?

• Promise.all

Promise.all([
  new Promise(resolve => setTimeout(()=>{console.log(1500); resolve();}, 1500)),
  new Promise(resolve => setTimeout(()=>{console.log(500); resolve();}, 500)),
  new Promise(resolve => setTimeout(()=>{console.log(2500); resolve();}, 2500)),
]).then(() => console.log('test'))

• Promise.allSettled

재밌는 비유

• https://musma.github.io/2019/04/17/blocking-and-synchronous.html

• 가정을 추가해보자
• 대표님이 1명, 직원이 10명
• 대표님이 2명, 직원이 20명
• 대표님이 10명, 직원이 100명
• 대표님이 1명, 직원이 100명

NodeJS와 Database

• NodeJS가 MySQL에게 요청을 보내면 MySQL이 제어권을 넘겨주지 않음
• 정확히는 MySQL Client (Driver) 가 Blocking 방식으로 동작함

• Java + MySQL로 된 (Blocking + Sync) API를 NodeJS에서 호출한다면?
• Non-Blocking + Async 로 동작 가능

• 브라우저는 Client이다.

• NodeJS도 쓰기에 따라선 Client가 되기도 하고, Server가 되기도 한다.
• 호출하는 입장이면 Client
• 호출에 대한 응답을 보내주는 입장이면 Server

• NodeJS가 사용하는 Client 프로그램이 Non-Blocking으로 동작해야 효율적
• DB의 경우 보통 NoSQL 계열이 Non-Blocking Client를 제공

sync

// 연속성, 코어 100개여도 1000개여도, 1개만 쓰이지 않을까?
const a = 1;
const b = 2;
const c = a + b;

console.log(c);

// 오래 걸리는 작업, 코어 100개여도 1000개여도, 1개만 쓰이지 않을까?
console.log('start');
for(i = 1; i < 1000000000; i++);
console.log('end');

• 100의 성능을 낼 수 있는 듀얼코어 vs 70의 성능을 낼 수 있는 멀티코어
• 어떤 환경이 더 쾌적할까?
• 우리가 만드는 프로그램에서는 어떤 환경이 더 쾌적할까?

• 병렬처리에 대한 고민도 해보면 좋음
• 70 + 70 + 70 + 70 인 환경에서 더 좋은 성능을 낼 수 있는 프로그램을 만들기 위해선?

• 2017년도(아이폰6 vs LG G5)

• 아이폰 vs 안드로이드
• 아이폰
• 메모리 1G
• CPU 듀얼코어
• 배터리 용량도 적었음
• 안드로이드
• 메모리 2G
• CPU 멀티코어
• 배터리 용량도 많았음

async 방식으로 만들어보기

// 반복문을 쪼개보기
console.log('start');
for(i = 1; i < 1000000000; i++);
console.log('end');

• 루프를 쪼갠다

• 쪼갠 루프를 원하는 시점에 실행한다.

• 쪼개진 루프의 다음 시작 지점을 알고 있어야 한다.

• 루프를 실행할 때 얼만큼 실행할지 정할 수도 있지 않을까?

스트림

go(
  make(infinity), // 블록킹이 걸릴 수도 있지 않을까?
  map(() => i * 2),
  take(5)
)

const list = new ArrayList()// 1000000000개의 데이터를 가진 List

list.map(i => i * 2) // js라면 1000000000 번 실행
  .limit(5)
  

list.stream().map(i => i * 2) // java의 stream은 5번 실행
  .limit(5)

// 렌더링을 할 때
// 10만개의 데이터가 있는데 => for, map, filter, forEach를 쓰면 10만벌 실행이 됨. blocking
이 됨

// 만개의 데이터만 가져오고 싶어