Style Rank
AST 기반 코드 품질 분석 및 랭크 측정 VSCode 확장 프로그램
기능
Style Rank는 JavaScript/TypeScript 코드의 복잡도와 클린 코드 규칙을 자동으로 분석하여 S/A/B/C/D/F 등급으로 시각화합니다.
주요 기능
- 파일 저장 시 자동으로 코드 품질 분석
- VSCode 하단 상태바에 실시간 랭크 표시
- 클릭 가능한 상세 분석 결과 (QuickPick UI)
- 문제 위치로 즉시 이동 가능
- JavaScript, TypeScript, JSX, TSX 파일 지원
- AST 기반 정확한 분석
분석 항목
1. 인지 복잡도 (Cognitive Complexity)
if, for, while 등 제어 구조의 중첩 깊이 측정- Early return 패턴 감지 및 가산점 부여
- 깊은 중첩 코드 핫스팟 자동 감지
2. 함수 길이 분석
- 30줄 초과 함수 자동 감지
- JSX/React 컴포넌트는 분석에서 제외
- 비즈니스 로직만 정확히 측정
3. 클린 코드 규칙 검사
- 느슨한 동등 연산자:
== 대신 === 사용 권장
- 매직 넘버: 하드코딩된 숫자를 상수로 선언 권장
- 파라미터 플래그: boolean 플래그 대신 함수 분리 권장
- 과다한 파라미터: 4개 초과 시 객체로 그룹화 권장
등급 기준 (CCS_Refined)
| 점수 |
등급 |
설명 |
| ≤5, 위반 0건 |
S |
완벽 - 클린하고 이해하기 쉬운 코드 |
| ≤10, 위반 ≤1건 |
A |
우수 - 가독성과 유지보수성이 높은 코드 |
| ≤20, 위반 ≤3건 |
B |
양호 - 약간의 개선 여지가 있는 코드 |
| ≤30, 위반 ≤5건 |
C |
주의 - 복잡도 또는 코드 스타일 개선 필요 |
| ≤40, 위반 ≤8건 |
D |
나쁨 - 즉시 리팩토링 권장 |
| >40 또는 위반 >8건 |
F |
위험 - 긴급 리팩토링 필수 |
CCS 계산식: 1.0 × 인지복잡도 + 0.5 × 길이페널티 + 5.0 × 위반건수
사용 방법
- JavaScript, TypeScript, JSX, 또는 TSX 파일을 열기
- 파일을 저장 (Ctrl+S 또는 Cmd+S)
- VSCode 하단 우측 상태바에서 코드 랭크 확인
- 상태바 클릭 시 상세 분석 결과 표시
- 개선이 필요한 항목 선택 시 해당 코드 위치로 자동 이동
요구사항
- Visual Studio Code 1.105.0 이상
릴리즈 노트
0.0.4
0.0.3
- QuickPick UI로 상세 분석 결과 표시
- 복잡도 핫스팟, 긴 함수, 위반 사항 선택 시 해당 위치로 즉시 이동
- 개선된 사용자 경험
0.0.2
- 인지 복잡도 및 CCS_Refined 계산 시스템 도입
- 클린 코드 규칙 검사 엔진 추가
- JSX 컴포넌트 함수 길이 측정 제외
- 복잡도 핫스팟 자동 감지
- OUTPUT 채널을 통한 상세 분석 결과 제공
0.0.1
- 초기 릴리즈
- AST 기반 순환 복잡도 계산
- S/A/B/C/D/F 랭킹 시스템
- 상태바 실시간 표시
- JavaScript/TypeScript/JSX/TSX 지원
| |
