HTTP/2와 Node.js: 푸시 및 성능 최적화
Node.js 환경에서 HTTP/2 도입, 서버 푸시 활용, 그리고 Express 환경 구성과 성능 최적화를 설명하는 기술
목차
HTTP/2가 필요한 이유
HTTP/1.1은 연결당 요청-응답 패턴으로 설계됐다. 이 구조는 리소스가 늘어날수록 지연과 오버헤드를 유발한다. 반면 HTTP/2는 멀티플렉싱, 헤더 압축, 서버 푸시 같은 기능으로 대역폭 활용도를 높인다. 결과적으로 초기 페인트 시간과 전체 대기 시간이 줄어든다.
Node.js에서 HTTP/2 기본 개념
핵심 기능 요약
- 멀티플렉싱: 하나의 연결로 여러 스트림 처리
- 헤더 압축: HPACK으로 헤더 크기 감소
- 서버 푸시: 서버가 클라이언트 대신 리소스 전송
Node.js는 자체 http2 모듈을 제공한다. 이를 통해 TLS 기반의 HTTP/2 서버를 손쉽게 구성할 수 있다.
Node HTTP/2 설정 예제
아래 예제는 기본적인 보안 HTTP/2 서버 구성이다. 인증서와 키 파일이 필요하다.
const http2 = require('http2');
const fs = require('fs');
const server = http2.createSecureServer({
key: fs.readFileSync('server.key'),
cert: fs.readFileSync('server.crt')
});
server.on('stream', (stream, headers) => {
const path = headers[':path'];
if (path === '/') {
stream.respond({ 'content-type': 'text/html', ':status': 200 });
stream.end('HTTP/2 서버 푸시 Node.js
서버 푸시는 HTML이 필요로 하는 리소스를 미리 전송해 렌더를 앞당긴다. 다만 무분별한 푸시는 오히려 낭비다. 요청 패턴과 캐시 정책을 고려해 적절히 사용한다.
아래 코드는 HTML 응답과 함께 CSS 파일을 푸시하는 예시다.
server.on('stream', (stream, headers) => {
if (headers[':path'] === '/') {
// 푸시 가능한 경우에만 pushStream 호출
stream.pushStream({ ':path': '/styles.css' }, (err, pushStream) => {
if (!err) {
pushStream.respond({ 'content-type': 'text/css', ':status': 200 });
pushStream.end('body { background: #fafafa; }');
}
});
stream.respond({ 'content-type': 'text/html', ':status': 200 });
stream.end('Express HTTP2 구성
Express는 기본적으로 HTTP/1.1에 맞춰져 있다. 그러나 http2.createSecureServer에 Express 앱을 넣어 사용하면 함께 동작한다. 다만 Express의 res 객체는 http2 스트림을 직접 노출하지 않으므로 서버 푸시 같은 고급 기능은 낮은 수준의 http2 API를 통해 접근해야 한다.
Express와 함께 쓰는 예제
const express = require('express');
const http2 = require('http2');
const fs = require('fs');
const app = express();
app.get('/', (req, res) => {
// Express의 res에는 stream이 없을 수 있으므로 원 서버 객체에서 처리 필요
res.send('보다 정교한 제어가 필요하면 Express 미들웨어에서 초기 요청을 분석하고, 원시 스트림을 찾아 pushStream을 호출하는 패턴을 적용한다.
성능 최적화 포인트
- 리소스 병합과 HTTP/2 멀티플렉싱의 균형 유지
- 캐시 정책을 엄격하게 설정해 불필요한 푸시 방지
- 푸시 후보 선정은 요청 로그와 캐시 히트율 기반으로 결정
- 헤더 크기 최적화로 HPACK 효율 개선
- TLS 설정에서 낮은 레이턴시 암호화 스위트 사용
결론
HTTP/2는 페이지 로드 성능을 개선할 수 있는 실무 기술이다. Node.js 기본 모듈로 간단히 서버를 구성하고, 상황에 따라 서버 푸시를 활용하면 초기 렌더를 앞당길 수 있다. Express 환경에서도 http2.createSecureServer를 활용해 기존 코드를 크게 바꾸지 않고 적용 가능하다. 다만 푸시는 신중한 정책 수립이 필요하며, 모니터링과 캐시 전략이 병행될 때 가장 큰 효과를 기대할 수 있다.
참고 키워드: Node HTTP/2 설정 예제, HTTP/2 서버 푸시 Node.js, Express HTTP2 구성