01
HTML5 웹표준 기반
시맨틱 HTML, ARIA, 키보드 내비게이션, 스크린리더 친화적 마크업이 컴포넌트 수준에서 기본값으로 구현되어 있습니다. 접근성 WCAG AA 대응이 추가 작업이 아닙니다.
SOLUTION · 03
SML
실시간 데이터, 복잡한 폼, 규제 고지, 접근성 요구가 한 화면에서 동시에 살아야 하는 맥락을 위해 만든 자체 프레임워크. 접근성 AA와 Core Web Vitals 통과를 기본 조건으로 합니다.
01Overview
고신뢰 웹은 다릅니다. 실시간 데이터와 복잡한 폼, 규제 고지와 접근성 요구가 한 화면에 공존합니다. SML은 이런 맥락에서만 만들어질 수 있는 선택들 - 접근성, 성능, 실시간 렌더링, 국제화 - 을 프레임워크의 기본값으로 옮긴 결과입니다.
컴포넌트 라이브러리가 아니라 플랫폼입니다. 프로젝트 팀은 도메인 로직에 집중하고, 공통의 기술 요구사항은 프레임워크가 담당합니다. 추가 작업이 아니라 기본값입니다.
02Features
Capabilities that matter.
02
실시간 데이터 패턴
주가·호가·체결 같은 고빈도 실시간 데이터의 렌더링 최적화 패턴이 내장되어 있습니다. 메모리·프레임 드랍·배터리 영향을 측정·관리하는 도구도 함께 제공합니다.
03
Core Web Vitals 빌트인
LCP·INP·CLS 같은 주요 지표를 프레임워크 레벨에서 자동 측정하고, 기준치 미달 시 빌드 경고를 발생시킵니다. 성능은 선택이 아니라 통과 조건입니다.
04
금융 폼 컴포넌트
금액 입력·계좌번호·계약서 동의·본인인증 같은 금융 공통 폼 패턴을 표준 컴포넌트로 제공합니다. 접근성·유효성·에러 복구가 일관되게 동작합니다.
05
국제화·다채널 대응
한국어·영어·중국어의 타이포·띄어쓰기·숫자 포맷 차이를 반영했고, Web·PC·Mobile 환경을 같은 코드베이스에서 지원합니다.
03Use case
삼성증권 Samsung POP Web 채널은 SML을 기반으로 구축되었습니다. 기본 탑재된 접근성·성능 계측 덕분에 프로젝트 초기부터 WCAG AA와 Core Web Vitals를 꾸준히 충족시켰고, 런칭 후에도 추가 성능 개선 작업이 거의 필요하지 않았습니다. 미래에셋증권의 WTS 또한 SML 기반으로 개발되었으며, 두 증권사 모두 Web 채널의 안정성 지표가 업계 상위권을 유지하고 있습니다.
WCAG AA
접근성
CWV Pass
성능
Tier-1 증권사 2곳
적용 사례