2024.2.13 기록 (프로젝트는 밤을 샌다.)

제법 오랜만에 밤을 새며 작업을 진행하는 것 같다.

 

firebase를 이용해 이것저것 다루기 위해 나름 공부를 많이 했는데도 생각하지 못한 부분에서 오류가 발생하고, 수정 부분이 생긴다.

 

 파이어베이스의 데이터 전송속도는 느린 편이다. 랜더링이 되는 시간보다 늦은 개념이 아닌 조금 더 느리다.

그렇기 때문에 조건부 랜더링을 많이 걸어주게 되는데, 이번에는 useEffect 훅을 많이 사용했다.

 

그런데, useEffect 훅을 사용하며, getDoc, updateDoc 과 같은 작업을 실행하면 소요되는 시간이 더욱 길어지고,

페이지를 랜더링 후 약 3~4초 뒤에 파일들을 불러오게 된다.

 

방법은 크게 두 가지가 있었다.

 

첫 번째는 useEffect 내부에서 해당하는 작업들을 하지 않고 최대한 가볍에 할 것,

 

두 번째는 로딩이 되는 시간이 어쩔 수 없는 시간들이라면 여러가지 로딩을 기다리는 요소를 넣어줄 것

대표적으로 스피너가 그 예시다.

 

이제 남는 시간동안 코드를 정리하며 다음에 이런 일이 있을 때를 대비해서 스피너도 하나쯤은 만들어봐야겠다.