Webpack부터 Kubernetes까지 (1) - Stream과 Node

- python, typescript로 개발되었던 기존 프로젝트에서는 webpack을 통해 개발, 관리되었음.

   그리고 이제 node기반 typescript로 이루어진 개발 프로젝트에 붙게 되면서 typescript, node 공부를 하면서 이것저것 하다가 습관적으로 kubernetes로 관리된다고 하셨던 말을 까먹고 webpack으로 개발하다가 다시 엎어야하는 것을 기념삼아 정리함 

 

- 공부하면서 쿠버네티스랑 차이점이 궁금하면서 생각해보니 webpack이 구체적으로 어떻게 돌아가는지 궁금해짐 
   -> 그러면서 gulp랑은 또 차이가 뭐지 궁금해짐 
   -> 일단 대충 찾아보니 gulp 방식이 stream 방식이네 이거 지금 공부하는 node에도 나오에도 나오던데 

- 정리 순서

1. 노드의 stream 
2. 그렇다면 gulp와 webpack의 차이
3. 그럼 kubernetes는 + MSA 찍먹

<Stream>

• Stream이란 : 스트리밍 데이터로 작업하기 위한 추상적인 인터페이스
• 배열이나 문자열 같은 데이터 컬렉션으로 한번에 모든 데이터를 얻는 그런건 아니다. 
• 일종의 추상적인 개념인데 입출력 기기나 프로세스, 파일 등 어디로 가는 지, 어디로 나왔는 지 상관없이 통일된 방식으로 데이터를 다루기 위한 가상의 개념, http 서버의 request같은 것들이 stream instance가 되는 것이다.

    정리하면 

1. 입출력 데이터를 순서에 의해서 순차적으로 처리되는 데이터 열
2. 전송되어야할 크기만큼 바이트들이 모여 만들어지는 통로로 데이터를 이동시킬 수 있는 다리 역할 

const fs = require("fs")

// 파일 그대로 호출
fs.readFile("./big.file", (err, data) => {
  if (err) throw err
  res.end(data)
})

// stream형태로 파일 호출
const src = fs.createReadStream("./big.file")

- 이러한 코드가 있고 big.file이 500MB정도의 크기라고 했을 때 전자는 메모리가 순간 500MB까지 올라갈 수 있다. 
   500MB에 달하는 파일을 메모리에 올려놓기 때문인데 반면 후자의 코드의 경우 stream형태로 한번에 하나의 chunk씩 stream으로 읽어오기 때문에 전자의 코드처럼 모든 파일을 메모리에 올리지 않게된다. 

 - 이러한 방식으로 영화 스트리밍 서비스 같은 경우 2~3GB의 크기의 파일을 전부 기다려서 시청하는 것이 아닌 파일의 앞단부터 차근차근 받아오면서 영화를 순차적으로 시청할 수 있게 된다. 

 

 

<Node stream>

 - Node에선 stream이 4가지 종류가 있음 (Readable, Writable, Duplex, Transform)

• Readable : 소비할 수 있는 데이터 (fs.createReadStream)
• writable : 데이터를 기록할 수 있는 종착점을 추상화한 스트림 데이터 (fs.createWriteStream)
• duplex : 읽기 / 쓰기 모두 가능한 스트림

 - 노드에서 stream이 더 중요한 이유는 앞서 정리한 것과 같이 노드는 이벤트 루프에 기반한 비동기 I/O를 제공하고 있음. 즉 위의 내용과 같은 파일 시스템에서 읽기/쓰기 작업을 할 때나 HTTP 요청을 전달할 때 Node.js는 응답을 기다리는 동안 다른 이벤트들을 처리할 수가 있다 (이를 non-blocking I/O라 부른다.)

  - Stream은 이러한 개념보다 더 확장된 개념으로 메모리 버퍼와 대역폭을 절약할 수 있는 이벤트 기반 I/O 인터페이스를 제공하고 있는 것으로 모든 스트림은 EventEmiiter라고 한다.

var fs = require('fs');
var stream = fs.createReadStream('./big_file.file');

stream.on('data', e => {
	console.log("load part of the file)
})

stream.on('end', e => {
	console.log("all parts is loaded")
})

stream.on('error', (err) => {
	console.log("log : " err);
})

• 기본적으로 읽기 스트림은 data, end, error 이벤트를 가지고 있으며 이렇게 data 이벤트로 하면 파일 전체가 로드될 때 까지 기다릴 필요 없이 파일을 일부를 쓰고 처리할 수 있게 된다. 

<Pipe>

 - 우후죽순처럼 정리하다 보니 또 나오는 개념인데 몰랐던 개념이니 일단 같이 정리한다. 

 - Pipe는 입력을 출력으로 리다이렉트 할 수 있게 도와주는 개념이다. (좀 더 Stream을 자유롭게 사용하기 위한 method인 듯)

 - 이 때 stream과 pipe을 함께 사용하거나 혹은 위처럼 event와 함께 stream을 사용할 것을 추천하며 pipe와 event를 같이 쓰는 것은 사용하지 말아야 한다. 일반적으로 좀 더 커스터마이징해서 사용하기 위해 event 방식으로 개발한다고 함