JS 난독화 도구

JavaScript 난독화에 대하여

난독화는 JavaScript의 동작은 그대로 유지하면서 사람이 읽기 훨씬 어렵게 코드를 다시 작성합니다. 변수 이름을 의미 없는 문자열로 바꾸고, 문자열 리터럴을 분할하고 인코딩하며, 코드의 정상적인 흐름을 추가적인 우회 경로로 재구성합니다. 압축(minify)과 달리 목표는 파일을 작게 만드는 것이 아니라 혼란스럽게 만드는 것입니다.

세 단계는 난독화 강도와 출력 크기·실행 비용을 맞바꿉니다. 낮음은 식별자 이름을 바꾸고 문자열 리터럴을 배열로 옮기며, 중간은 제어 흐름 평탄화(단순한 로직을 추적하기 어려운 상태 기계로 재구성하는 것)와 죽은 코드 주입을 더하고, 높음은 RC4로 인코딩된 문자열, 문자열 리터럴 청크 분할, 그리고 출력이 재포맷되거나 정렬 도구를 거치면 깨지는 자기 방어 코드를 활성화합니다. 단계가 높을수록 눈에 띄게 파일이 커지고 실행이 느려지므로, 높음은 애플리케이션 전체가 아니라 라이선스 체크처럼 정말 그럴 가치가 있는 코드에만 아껴 두는 것이 좋습니다.

사용되는 곳

• 클라이언트 측 로직을 복사하거나 역설계하기 어렵게 만들기
• 프런트엔드 코드에 포함된 라이선스 검사나 API 키 보호
• 내부 함수와 변수 이름을 노출하지 않고 번들 배포
• 신뢰할 수 없는 환경에서 실행되는 코드를 조작하는 데 드는 비용 증가

자주 묻는 질문

난독화된 코드는 실제로 안전한가요?
아닙니다. 난독화는 코드를 읽거나 수정하는 데 필요한 노력을 늘리지만, 브라우저에서 실행되는 것은 결국 의지가 있는 사람에 의해 역난독화될 수 있습니다. 개인 API 키와 같은 진짜 비밀을 보호하는 수단으로는 절대 의존하지 마세요.

난독화와 압축(minify)의 차이는 무엇인가요?
압축은 파일 크기를 줄이지만 정렬 도구로 쉽게 되돌릴 수 있습니다. 난독화는 다시 포맷한 후에도 식별자 이름 변경, 문자열 인코딩, 제어 흐름 재구성 등을 통해 의도적으로 로직을 혼란스럽게 만듭니다.

난독화하면 코드가 느려지나요?
약간 느려질 수 있으며, 특히 높은 수준에서는 추가적인 우회와 문자열 디코딩으로 약간의 실행 비용이 발생합니다. 대부분의 프런트엔드 코드에서는 무시할 수 있는 수준이지만, 성능이 중요한 반복문에서는 테스트해 볼 가치가 있습니다.

낮음, 중간, 높음 단계는 구체적으로 무엇을 바꾸나요?
낮음은 변수와 함수를 짧고 의미 없는 이름으로 바꾸고 문자열 리터럴을 배열에 숨깁니다. 중간은 제어 흐름 평탄화(로직의 분기를 추적하기 어려운 상태 기계로 재구성하는 것)와, 노이즈만 더할 뿐인 주입된 죽은 코드를 추가합니다. 높음은 RC4로 인코딩된 문자열, 실행 시점에 다시 조립되는 청크로 나뉜 리터럴, 그리고 재포맷을 감지해 반응하는 자기 방어 코드를 추가합니다. 단계가 하나 올라갈 때마다 출력 크기와 실행 속도를 더 희생하는 대신, 되돌리는 데 드는 노력도 더 커집니다.