Node.js에서 가장 오래되고 유명하면서도 널리쓰이는 라이브러리는 웹 프레임워크인 Express.js입니다.
<p dir="auto">기본적인 라우팅, 정적 파일 서빙, 템플릿 등을 지원하며 본인 입맛에 맞는 ORM/ODM 등을 활용하여 나름 MVC 형태를 구축할 수 있습니다. <h2>Express.js에 Gzip 적용하기 <p dir="auto">예전에 제가 개인프로젝트로 운영하던 사이트가 있었는데 <p dir="auto">사이트 런칭 후 느낀게 이상하게 사이트 로딩 속도가 좀 느리다는 게 느껴졌습니다. <p dir="auto">보통 웹사이트가 느리게 열리는데에는 여러가지 이유가 있겠지만 나름 제가 아는 기본적인 최적화는 많이 되어 있었기 때문에 <p dir="auto">무엇이 빠져있나 살펴보기 위해서 <a href="http://developers.google.com/speed/pagespeed/insights/" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Google Pagespeed를 돌려보았습니다. <p dir="auto"><img src="https://images.hive.blog/768x0/https://steemitimages.com/DQmcizea5xAmujQB3rRmW43v9epgxqbNXafKDrrvcos1mN2/image.png" srcset="https://images.hive.blog/768x0/https://steemitimages.com/DQmcizea5xAmujQB3rRmW43v9epgxqbNXafKDrrvcos1mN2/image.png 1x, https://images.hive.blog/1536x0/https://steemitimages.com/DQmcizea5xAmujQB3rRmW43v9epgxqbNXafKDrrvcos1mN2/image.png 2x" /> <p dir="auto">제가 잊어버리고 Gzip을 사용하도록 서버에서 설정을 안해줬습니다. <p dir="auto">매 경우 다르지만 저의 경우 Gzip을 사용하면 70% 넘게 전송하는 패킷 크기를 줄일 수 있다고 분석 결과가 나왔습니다. <h2>Gzip <p dir="auto">Gzip을 혹시 처음 들어보시나요? <p dir="auto"><img src="https://images.hive.blog/768x0/https://steemitimages.com/DQmNr2SpVtvsix6iMSMnQexs7mvXXXnwZdY3jxJNfBgV9ZC/image.png" srcset="https://images.hive.blog/768x0/https://steemitimages.com/DQmNr2SpVtvsix6iMSMnQexs7mvXXXnwZdY3jxJNfBgV9ZC/image.png 1x, https://images.hive.blog/1536x0/https://steemitimages.com/DQmNr2SpVtvsix6iMSMnQexs7mvXXXnwZdY3jxJNfBgV9ZC/image.png 2x" /> <p dir="auto">Gzip을 사용할 수 있는 브라우저가 서버에 요청을 보냈을 때, 서버는 브라우저에 데이터를 압축해서 보내줄 수 있고 브라우저는 압축된 데이터를 풀어서 원본 데이터를 받게 됩니다. <p dir="auto">서버가 Gzip 압축에 대해 지원하지 않고 그냥 무시한다면, 압축되지 않은 원래 사이즈의 데이터가 전송되기 때문에 Gzip을 사용하는 것보다는 상대적으로 오래걸리고 비효율적으로 큰 데이터를 주고 받는 것이 됩니다. <p dir="auto">Express 2.x 버전에서는 저는 <a href="https://github.com/tomgco/gzippo" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">Gzippo 라는 모듈을 사용해서 Gzip을 사용했었는데 최근 버전의 Node.js와 Express에서는 호환이 되지 않습니다.<br /> Express 3.x 버전부터는 자체 내장된 <code>express.compress()를 사용해서 쉽게 Gzip을 적용할 수 있습니다. <h2>Gzip 적용하기 <p dir="auto">Express App을 실행하는 <code>app.js나 <code>index.js와 같은 메인 파일을 보면 여러 <code>app.use를 사용하는 라인들이 보입니다. <pre><code>app.use(express.json()); app.use(express.urlencoded()); app.use(express.bodyParser()); app.use(express.methodOverride()); app.use(express.cookieParser()); <p dir="auto"><code>express.compress()를 가장 윗줄에 추가해주면 서버에서 Gzip 압축을 사용할 수 있습니다. <pre><code>app.use(express.compress()); app.use(express.json()); app.use(express.urlencoded()); app.use(express.bodyParser()); app.use(express.methodOverride()); app.use(express.cookieParser()); <h2>Gzip 적용 확인해보기 <p dir="auto">Gzip 압축을 서버에 적용한 후, Gzip이 잘 적용되었는지 확인을 해보는 게 좋습니다. <p dir="auto"><a href="http://www.gziptest.com" target="_blank" rel="nofollow noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">GzipTest에 가서 운영하고 있는 사이트의 주소를 입력해보세요. <p dir="auto"><img src="https://images.hive.blog/768x0/https://steemitimages.com/DQmXjVvYKuLcZwQEt4zevKh1MBwizFVNDjVxiD7NHP4NsJP/image.png" srcset="https://images.hive.blog/768x0/https://steemitimages.com/DQmXjVvYKuLcZwQEt4zevKh1MBwizFVNDjVxiD7NHP4NsJP/image.png 1x, https://images.hive.blog/1536x0/https://steemitimages.com/DQmXjVvYKuLcZwQEt4zevKh1MBwizFVNDjVxiD7NHP4NsJP/image.png 2x" /> <p dir="auto">이런 그림이 뜬다면, 성공적으로 Gzip 압축 적용을 하신겁니다 :) <h2>Gzip 적용 가능한 브라우저 <p dir="auto">현재 아래 표를 보시면 초록색으로 되어있는 브라우저 및 버전은 지원 / 빨간색은 미지원 브라우저입니다. <p dir="auto"><img src="https://images.hive.blog/768x0/https://steemitimages.com/DQmP3hnrZ4fdPfiECCUQrYqnBN4rR2o7FqUMrE6GF135oU2/image.png" srcset="https://images.hive.blog/768x0/https://steemitimages.com/DQmP3hnrZ4fdPfiECCUQrYqnBN4rR2o7FqUMrE6GF135oU2/image.png 1x, https://images.hive.blog/1536x0/https://steemitimages.com/DQmP3hnrZ4fdPfiECCUQrYqnBN4rR2o7FqUMrE6GF135oU2/image.png 2x" />
good
Thank you :) Would you vote for this post?
너무 전문 내용이라 잘 모르겠지만 아무튼 좋은 글 잘읽고 갑니다.
어려운 내용은 아니에요. 쉽게 말하자면 브라우저에 결과물을 압축해서 보내는 기능을 켜는 방법입니다 :)