안녕하세요 센세
개인프로젝트 하고 있는데 지금 70% 정도는 완료한 상태입니다.
테스트해보려고 netlify로 배포했는데 조금 문제가 있어서 질문 드립니다.
진행중인 프로젝트는 꼬맨틀 이라는 웹게임 클론코딩입니다.
꼬맨틀을 정답 단어와 사용자가 유추한 단어 사이의 유사도를 비교해서 오늘의 정답 단어가 무엇일지 유추하는 게임입니다.
특징으로는 정답 단어와 유사한 단어 순위를 1~1000위까지 매겨서 보여줍니다.
정답 단어와 사용자가 유추한 단어의 유사도 비교는 open ai 임베딩 api를 이용해서 쉽게 구현했습니다.
근데 정답 단어와 유사한 단어 순위를 미리 저장해서 사용자에게 보여줘야하는게 문제가 됐습니다.
처음에는 fs 라이브러리를 사용해서 프로젝트 내부에 유사도 순위를 기록 파일을 생성하고, 파일을 읽는 방식을 사용했습니다.
근데 이 방식은 배포 후에 파일 생성 과정에서 문제가 생길 수 있다고 판단했습니다.
매일 바뀌는 정답 단어에 대한 새로운 파일을 생성해야 하기 때문입니다.
그래서 db에 오늘의 정답 단어에 대한 5500단어의 유사도 순위를 담은 어레이를 저장하고(1),
그 어레이를 불러와서 사용자가 입력한 값과 비교하고, (2)
만약 입력한 값이 미리 저장한 5500개의 단어 안에 포함되지 않으면 정답 단어에 대한 유사도를 추측(3)
이러한 방식으로 수정하여 netlify에 배포했습니다.
그런데 이런 방식으로 하니까 사용자가 정답을 유추할 때 (2)번 과정이 대략 1.3s, (3) 과정이 0.5s 정도 소요되더라구요.
기존에 fs 라이브러리를 이용할 때는 길어봤자 둘 과정 모두 0.5초 내외였는데 말입니다.
그래서 질문은
1. 현재 사용중인 방식의 속도 개선이 가능한 부분이 있을까요?
2. 만약 1번 질문이 불가능하다면 처음 차용한 방식인 fs 라이브러리 이용을 사용해도 괜찮은가요?
3. 2번 질문도 불가능하다면 어떤 방식을 사용하는게 좋을까요?
4. 또한, cookie로 다크모드 관리를 하는데 cookie를 불러오는 속도도 local에서 개발할때보다 0.2~0.3초 가량 늦어집니다.
이것에 대한 원인이나 해결책이 있나요?
개인적으로는 처음 웹사이트 입장할 때 db에 저장한 유사도 순위 어레이를 불러와서
이를 캐싱하고 필요할때마다 캐싱한 데이터를 불러오는 방식을 사용할 것 같습니다.
아마 React-query를 이용할 것 같구요.
배포한 웹사이트
https://kkodle-kkodle.netlify.app/
깃허브
https://github.com/pvvng/kkomentle
질문 더럽게 많은데 읽어주셔서 감사합니다 센세.
-
이 게시글은
김동우에 의해 11 월, 3 주 전에 수정됐습니다.