대용량 실시간 데이터 그리드

개요

운용 확대로 주문 데이터 25만 건 초과. 일반 HTML 테이블로는 한 화면에 렌더 불가, 페이지 넘김으로는 현장의 일괄 확인·편집이 막힘. 이전에 탭 건수 뱃지가 거대한 집계 뷰를 매번 세면서 DB에 46시간분 CPU 부하가 몰려, 무관한 쿼리까지 연쇄 타임아웃되는 장애 발생. canvas 기반 그리드로 대량 데이터를 가상 렌더하고, 무거운 집계는 백그라운드로 이관해 화면은 결과만 읽는 구조로 전환.

담당 업무

• 01

  canvas 그리드로 25만 건 이상을 DOM 없이 가상 렌더. 전체 컬럼 검색을 단일 컬럼 GIN 인덱스로 교체해 약 10초→40ms대로 단축.

• 02

  무거운 건수 집계를 pg_cron 정기 스냅샷으로 옮겨 화면은 결과만 읽도록(7.5초→약 0.001초). 피크 시 DB 포화로 인한 연쇄 다운을 무중단 해소.

• 03

  같은 사고가 재발하지 않도록 위험한 집계 호출을 툴 훅·git 훅·룰 문서 3중으로 기계적 차단. '부하가 안 보인다=안전'이 아니라고 보고, 부하를 현장에서 잡는 계측기도 자작.

성과

'대량 데이터는 한 화면에 못 본다'는 전제를 뒤집어, 25만 건을 끊김 없이 여러 명이 동시에 다루는 운영 그리드를 구현.