개인프로젝트
-
썸네일 이미지를 변경해서 페이지 속도 증가하기개인프로젝트/음악블로그 2022. 9. 17. 03:22
1. img 태그에 loading="lazy"를 옵션을 설정하여 첫 로딩 시 속도 증가시키기 img 태그에 loading="lazy" 속성을 설정하게 되면 첫 로딩 시 화면에 잡히지 않는 이미지들은 로딩되지 않으므로 속도가 늘어나는 효과를 볼 수 있습니다. 2. 이미지 표시 크기 줄이기 이 부분은 말 그대로 용량이 아닌 표시되는 크기를 줄이면 속도 개선이 됩니다. 3. 썸네일 JPG 이미지를 WEBP로 변경하기 구글에서 만든 최신 이미지 확장자. 이름처럼 web에 최적화된 확장자라고 합니다. 아무튼 WEBP 이미지가 다른 JPG나 PNG 같은 이미지들 보다 압축률이 좋아서 용량이 적어 속도 증가에 도움이 될것입니다. 예시로 용량 비교를 해보겠습니다. JPG : 3.4 KB WEBP : 2.6 KB 0.8..
-
nginx + ubuntu + pm2 로 aws lightsail 서버에 배포개인프로젝트/음악블로그 2022. 8. 3. 20:09
로컬환경과 버전 동일하게 하기 위해 npm, node, 버전을 맞추었다. npm 8.1.2v node 16.13.2v Ubuntu 20.04 LTS 무중단 서비스를 도와주는 pm2를 통해 node를 실행시킬것이다. // pm2.config.js const config = { apps : [ { name : 'music_blog', script : './app.js', instances : 0, exec_mode : 'cluster' } ] } module.exports = config exec_mode 를 cluster 모드로 실행하게 되면 모든 cpu 코어를 사용할수 있게 되며 instances의 숫자만큼 인스턴스가 생성이 되는데 이때 instances 를 0으로 설정하게 되면 인스턴스가 cpu 코어 ..