Vercel 무료 플랜 limit?

Hobby(무료)로 잘 쓰고 있었는데 갑자기 75% 를 사용했다면서 Pro로 업그레이드 하라는 메일이 왔다.

'아직 더 버텨줄 수 있을거라 생각했는데...'

 

'뭐가 문제일까?' 

 

Free 는 4시간 무료인데 3시간 9분을 사용하고 있었다.

 

Fluid Active CPU 란?

API를 호출해서 응답 받고 내 코드가 처리하는 시간
ex) DB에 쿼리 날리고 결과 기다림(과금 x) -> 결과 받아서 내 코드로 가공/처리 (과금)

 

Vercel, 이제 "기다리는 시간"엔 돈 안 받는다

Vercel이 서버리스 함수 과금 방식을 바꿨다. 기존엔 함수가 DB 응답이나 AI API를 기다리는 동안에도 시간이 그대로 청구됐는데, 새로운 Fluid + Active CPU 방식은 코드가 실제로 CPU를 쓰는 순간만 과금한다.

예를 들어 함수 실행 시간이 500ms라도 그중 400ms가 DB 대기였다면, 청구는 100ms분만. Supabase나 외부 API를 많이 쓰는 구조라면 체감 절감이 꽤 크다.

Hobby/Pro 플랜 모두 기본 활성화되어 있어 별도 설정 없이 적용된다. I/O 위주의 가벼운 앱일수록 유리한 방식이다.

 

내 로직엔 2가지 문제가 있었다.

1) 프로모션 로직 call 하는 부분을 server 에서 client 로

   ~~**(b) `/api/promotion/grant` mTLS 3단계**~~ 

   - 호출당 1,500~2,500ms (폴링 루프가 주범)

   - 호출처 4곳: `useIdlePoints.ts:148,221`, `usePunch.ts:133,167` (모두 `src/utils/auth.ts:196` `grantTossPoints()` 경유)

   - 레퍼런스: `D:\projects\toss-sajaseongeoquiz\src\components\QuizGame.tsx:255~320`

   - 효과: 호출당 1,500~2,500ms → 160ms (90~95% 절감)

 

: 프로모션 주는 로직을 server 단에 뒀는데 SDK 2.0 인가부터 client 에서 바로 호출 할 수 있도록 해서 이 부분을 client 로 이동

(물론 어뷰징이 있을 수 있어서 server 를 체크하고 프로모션 결과를 기록하는 로그를 추가)

 

2) 출석체크 로직을 필요할 때만 호출하도록 줄임

   **(a) `useAttendance` 이중 호출** (보류, (b) 후 재판단)

   - `MainScreen.tsx:118` / `AttendanceScreen.tsx:53`이 각자 훅 호출 → 화면 전환 시 `/api/attendance/status` + `/api/attendance/history` 중복 호출 (메인 → 출석 → 메인 = 8회)

   - 해결: `App.tsx`에서 1회 호출 후 `AttendanceContext`로 공급

   - 효과: 세션당 50% 감소

 

: 각 페이지마다 status, history 부분을 호출하고 있음. 
따라서 필요할 때(최초 앱 진입, 출석체크 후)만 호출해서 Context(App.tsx)에 넣고 공통변수로 사용한다.

 

* 혹시라도 사용량이 over 되어 pro 로 업그레이를 해야할 경우, 다음을 체크하도록 하자.

 

여기서 Speed Insights 를 빼서 필요하지 않은 요금을 들이지 않도록 하자.