OneGrid
병원 HIS(React + Spring Boot + PostgreSQL)용 고속 데이터 그리드. 컬럼형 Dataset · 행 상태(I/U/D) · 한글 IME 편집 · 필터·그룹·합계·피벗·차트 · 엑셀/PDF · 서버 행 모델. 런타임 의존성 없음.
예제 · 처방 입력 + 검사결과 10만 행
스크립트 한 줄 include로 동작하는 편집 그리드와 대량 조회(필터 행·그룹·합계)
200컬럼 × 10만 행 측정 · OneGrid
JSON 파싱부터 첫 화면, 스크롤 fps, 정렬·필터 시간을 이 브라우저에서 직접 잽니다
같은 조건 · AG Grid 33 비교
같은 데이터·같은 시나리오 (AG Grid Community)
사용 안내 (AI용)
어떤 파일을 include 할지, 데이터 계약, React·Spring 예 — Claude 등 AI가 먼저 읽는 문서
측정 (200컬럼 × 100,000행, Windows 10 Edge)
| 항목 | OneGrid | AG Grid 33 |
|---|---|---|
| 서버 JSON 파싱 → 첫 화면 | 1.44초 | 2.59초 |
| 세로 / 가로 스크롤 | 64 / 61 fps | 64 / 62 fps |
| 대각 점프 (임의 위치 이동) | 64 fps | 14 fps |
| 정렬 / 필터 | 46 / 35 ms | 709 / 454 ms |
| PostgreSQL → Spring → 화면 전체 | 5.2초 | — |
쓰는 법
<script src="OneGrid/browser/onegrid.min.js"></script> 를 넣고 new onegrid.OneGrid(요소, { dataset, columns }). React는 esm/react.js 의 <OneGridView/>, 서버는 Spring 코어(GridData·GridChanges). 자세한 내용은 사용 안내를 보세요.