next js 13 next/cache 폴더

이명진·2024년 1월 2일
0

next 13을 사용하면서 빌드를 할때마다 시간이 엄청 오래 소요가 되었다.
뭐 업무 중일때는 배포 가 오래걸릴것을 고려해서 미리 배포 해서 상관은 없는데
퇴근해야 하는데 급한 수정사항을 만나게 되어서 배포 까지 하고 후 처리 까지 하면 야근은 필수가 된다. 야근도 길이가 중요한데 30분 배포가 걸리고 후처리 까지 테스트 해야 하니 엄청 답답하다.. 특히 react를 사용해서 빌드 및 배포를 하는 것보다 엄청난 빌드 및 배포 시간이 소요되었다.
react는 보통 5분 정도 소요되던데.. 빨리 수정하고 5분정도 배포하고 후처리를 해도 next작업시간 보다 넉넉하다.

next13을 보면 빌드 속도에 개선이 엄청나게 이루어 졌다고 공식문서에도 알려주었는데
전혀 체감할수가 없었다.

원인을 추측해보니 next/cache폴더의 용량이 엄청 커서 그런게 아닐까 생각하게 되었다.

구글에서 검색해보아도
Why .next folder is so big? 등 글들이 많이 적혀있었고

대부분 답변을 보면 10G가 넘어가는 분들도 있었다.

나도 커밋을 하고 푸시를 진행했는데 100mb가 넘어가서 푸시가 안된다 라는 경고 문을 받고
푸시가 안되는 경우가 있었다. 결국 커밋들을 삭제하고 캐시 폴더를 지운뒤에 푸시를 하게 되었다.

말그대로 캐시이기 때문에 단순한 메모리 일거라고 추측하고 삭제후에 빌드를 진행하게 되었다.

이 cache 폴더의 목적은 무엇일까 ?

댓글들을 보니 이미지 런타임 속도에 영향을준다 라고 도 본것 같은데 댓글로 확인해보니
빌드할때 빌드 속도를 올려준다고 한다.

하지만 앱을 운영할때는 전혀 필요가 없다고하는데 나는 이것을 토대로 빌드 속도에 전혀 영향을 안주는것 같아서 과감하게 삭제하고 빌드를 진행해보게 되었다.

쭉 테스트를 위해서 계속 배포를 해봤다. 처음에는 29분 정도 소요가 되었다.

git ignore 에 .next/cache/webpack/를 추가 해 두어서 웹팩 부분은 저장 용량을 줄이도록 설정해 두었다.

계속 배포를 하면서 시간을 체크해 보았다.

확실히 캐시가 있다보니 처음에만 20분 정도 걸리고 나머지 부분에서는 평균 4분 정도 소요된걸로 보인다
1분 대는 빌드 실패한 것이니 넘어가도록 하자.

그래도 오래간만에 다시 배포하면 30분 대로 뛰기 때문에 다시 다음에 테스트 해보도록 하려고 한다.

그래도 체감상 조금 나아진것 같기도 하다는 느낌이 든다.
결과적으로는
'next 폴더의 cache 폴더를 지우고 배포를 해도 문제 없다는 것' 과 gitignore에 cache를 추가해도 작동된다는 것이다.

테스트는 ing


2024.01.11 추가..
next cache폴더를 gitignore에 추가했는데 브랜치를 옮길때마다 complict가 나서 다시 gitignore에서 삭제했다.

profile
프론트엔드 개발자 초보에서 고수까지!

0개의 댓글