들어가며

Flutter로 만보기 앱을 운영했다. 가장 많았던 문의가 이거였다.

"걸음수가 안 올라가요"

권한도 다 줬고, 앱도 정상 동작하는데 왜 안 올라간다는 걸까? 로그를 봐도 이상 없고, 재현도 안 됐다.

근데 재현이 안 됐던 이유가 있었다.

왜 재현이 안 됐나

개발자인 나는 제자리에서 핸드폰만 흔들기 바빴다.

업무 중이니까 밖에 나가서 걸을 수가 없었다. 그래서 책상에 앉아서 핸드폰 흔들고, 숫자 올라가는 거 확인하고, "정상이네~" 하고 넘어갔다. ~~(이러면 안 됐는데...)~~

근데 실제 사용자는 걷다가 앱을 껐다. 이게 핵심이었다.

직접 이리저리 사용해보고 나서야 원인을 찾았다.

진짜 원인: 동기화 타이밍

문제는 걸음수 자체가 아니었다. 서버 동기화 타이밍이었다.

왜 디바운스를 썼나

1걸음마다 서버 API를 쏠 수는 없다. 사용자가 1000걸음 걸으면 1000번 API 호출? 말이 안 된다.

그래서 디바운스를 걸었다. 걸음수가 변할 때마다 타이머를 리셋하고, 일정 시간(1.5초) 동안 변화가 없으면 그때 서버에 보내는 방식이다.

                        dart
                    
1
2
3
4
5
// 포인트 탭 시 디바운스 처리
_debounceTimer?.cancel();
_debounceTimer = Timer(const Duration(milliseconds: 1500), () async {
  await _executeBatchSync();  // 서버 동기화
});

문제 상황

                        Auto (css)
                    
1
2
3
4
5
6
7
8
9
[걷는다] → [걸음수 증가] → [디바운스 타이머 시작 (1.5초)]
                                   ↓
                             [0.5초 후 앱 종료 or 탭 이동]
                                   ↓
                             [타이머 취소됨]
                                   ↓
                             [서버 동기화 안 됨]
                                   ↓
                             [사용자: "걸음수가 안 올라가요"]

디바운스 대기 중에 앱을 나가버리면, 서버에 안 보내지고 날아간다. 사용자 입장에서는 "분명히 걸었는데 왜 반영이 안 되지?" 하는 거다.

해결책

1. 앱 lifecycle 감지

WidgetsBindingObserver

를 써서 앱이 백그라운드로 가는 순간을 감지했다.

                        dart
                    
1
2
3
4
5
6
7
@override
Future<void> didChangeAppLifecycleState(AppLifecycleState state) async {
  if (state == AppLifecycleState.paused ||
      state == AppLifecycleState.inactive) {
    // 백그라운드 전환 감지
  }
}

2. 전환 직전 강제 동기화

백그라운드로 가기 전에 버퍼 정리하고 즉시 동기화한다.

                        dart
                    
1
2
3
4
5
6
7
8
9
10
11
12
13
14
if (state == AppLifecycleState.paused ||
    state == AppLifecycleState.inactive) {
  _isInForeground = false;

  // 낙관적 UI 버퍼 정리 (안전장치)
  if (_optimisticPending > 0) {
    setState(() {
      _accumulatedTapCount = 0;
    });
  }

  // 걸음수 데이터 즉시 전송
  await sendStepData();
}

3. 폴링 간격 조정

포그라운드/백그라운드 상태에 따라 폴링 간격도 다르게 가져갔다.

                        dart
                    
1
2
3
4
5
// 포그라운드: 5초마다 걸음수 체크
// 백그라운드: 50초마다 걸음수 체크
interval = _isInForeground
    ? Duration(seconds: 5)
    : Duration(seconds: 50);

백그라운드에서 너무 자주 체크하면 배터리 소모가 심하다. 적절한 균형을 찾아야 했다.

전체 흐름

flowchart TD
    A[걸음 감지] --> B[디바운스 타이머 시작]
    B --> C{앱 상태 변화?}
    C -->|유지| D[1.5초 대기]
    D --> E[서버 동기화]
    C -->|백그라운드 전환| F[즉시 강제 동기화]
    F --> G[버퍼 정리]
    G --> H[폴링 간격 변경 50초]

배운 점

1. 개발자 테스트 ≠ 사용자 사용 패턴

제자리에서 핸드폰 흔드는 건 테스트가 아니었다. 실제로 걸어봐야 한다. 당연한 말 같은데, 바쁘다는 핑계로 안 했다. (반성...)

2. 디바운스의 함정

디바운스는 좋은 패턴이다. 근데 **"중간에 끊기면?"**을 항상 생각해야 한다. 특히 모바일에서는 앱이 언제든 백그라운드로 갈 수 있다.

마치며

"걸음수가 안 올라가요" 문의의 대부분은 동기화 타이밍 문제였다. 걸음수는 제대로 세고 있었는데, 서버에 보내기 전에 앱을 나가버린 거다.

해결책은 간단했다. 백그라운드 전환 직전에 강제로 동기화하면 된다.

근데 이걸 찾기까지가 오래 걸렸다. 직접 걸어봐야 했으니까. 다음에는 더 빨리 알아차릴 수 있겠지?