Express - 9.2. 미들웨어의 사용 - compression

압축(Compression) 사용하는 이유

만약 create로 엄청 많은 데이터를 넣어보자.

개발자 도구 > Size 를 보니 데이터 크기는 49.6kB로 꽤 큰 데이터 양이다. 웹 사이트에는 많은 사람들이 접속을 하고, 그 사람들이 접속할 때마다 10MB씩 다운로드한다고 생각하면 돈과 시간, 부담이 많이 될 것이다. 

이 문제는 압축을 통해 해결할 수 있다. 웹 브라우저에게 응답을 할 때 데이터를 압축하는 것이다. 예로 들어서 zip처럼 말이다. 응답을 압축하고, 이 응답이 zip방식으로 압축되었으니 zip방식으로 압축을 풀라고 알려주면 웹 브라우저가 이를 받아 압축 방식에 따라 해제하고 응답을 보게 된다.

그렇게 되면 압축된 데이터가 전송되기 때문에 데이터의 양이 획기적으로 줄어들 수 있다. 압축을 하고 푸는 과정이 필요하지만, 이는 네트워크의 전송 비용보다 싸고 빠르기 때문에 압축 방식을 많이 사용한다.

 

Compression 사용 방법

Google에서 express middleware compression 검색해보자.

Express compression middleware

설치

npm install compression

API

// compress all responses
app.use(compression())

middleware인 compression()이 app.use를 통해 장착된다. 이를 통해 요청이 들어올 때마다 compression middleware가 실행된다.

현재 49.6kB인 이 데이터를 ctrl+shift+R 눌러 캐시를 삭제하여 강제로 리로드를 해보자.

그러면 데이터의 양이 갑자기 5.0kB가 된다. 데이터의 양이 많고 접속하는 사용자가 많다면 compression은 정말 큰 기능이 될 것이다.

요청을 클릭해보면 Response Headers의 Content-Encoding이 gzip라 되어있다. 즉, 이 데이터는 gzip방식으로 압축되었다는 것이다. 그러면 웹 브라우저는 이 압축된 방식으로 데이터를 해제하여 사용한다.