한 권으로 끝내는 Node & Express: 웹사이트 구축을 위한 서버 사이드 자바스크립트

265

16

장

-

정적 콘텐츠

이제 정기적으로 실행해야 하는

grunt

를 실행하면 매핑되지 않은 정적 자원을 모두 찾을 수 있

습니다.

16.10.

마치며

정적 자원은 단순해 보이지만 골칫거리를 많이 일으킵니다. 하지만 정적 자원은 방문자에게 실

제 전송되는 데이터의 대부분을 차지하므로 시간을 들여 최적화하면 상당한 대가를 얻을 수 있

습니다.

웹사이트의 크기와 복잡한 정도에 따라서는, 여기서 설명한 정적 매핑 테크닉이 좀 과할 수도

있습니다. 그런 프로젝트에서는 그냥 처음부터 정적 자원을

CDN

에 올리고, 뷰와

CSS

에 항

상 자원의 완전한

URL

을 쓰는 게 좋을 수도 있습니다. 처음부터

CDN

을 쓰더라도 린트를 통

해 정적 자원을 서버에서 전송하지는 않는지 찾는 게 좋습니다.

grunt

-

lint

-

pattern

에서

(?:

https

?:)//

로 시작하지 않는 링크를 검색하면, 실수로 자원을 서버에서 전송하더라도 찾

아낼 수 있습니다.

정교한 번들링과 최소화를 통해 애플리케이션 성능이 올라가지 않는다면 아예 빼는 편이 시간

을 절약할 수 있습니다. 특히 사이트에서 자바스크립트 파일은 한두 개만 쓰고

CSS

도 모두 하

나의 파일에 들어 있다면 번들링은 의미가 없으며, 최소화 역시 자바스크립트나

CSS

가 아주

크지 않다면 큰 효과는 없습니다.

정적 자원 계획을 어떻게 짜든 간에, 따로 호스팅하기를, 특히

CDN

에 올리길 강력히 권합니

다. 이게 귀찮은 작업으로 들린다면, 생각만큼 어렵지 않다는 걸 필자가 보장합니다. 특히 시간

을 조금 투자해서 정적 자