[250819] TIL

Today I Learned (2025-08-19)

STAR 기법 4단계

1. 상황
   • 어떤 상황에서 일이 발생했는지 맥락 설명하기
   • “작년 여름 인턴 프로젝트에서 성능 최적화 과제를 맡게 되었습니다.”
2. 과제
   • 맡았던 역할이나 책임 이야기하기
   • “저는 LCP 시간을 줄이는 책임을 맡았어요.”
3. 행동
   • 실제 어떤 행동, 노력을 했는지 구체적으로 설명하기
   • “분석 툴을 이용해 병목 구간을 찾아 이미지 최적화와 코드 스플리팅을 적용했습니다.”
4. 결과
   • 결과 이야기 하기

CommonJS , ESM 와 스코프

모듈 시스템이란?

• 코드의 재사용성과 유지보수성을 높이기 위해 프로그램을 독립된 단위로 나누고 서로 가져다 쓸 수 있도록 규칙을 정한 체계
• 단순히 파일 여러 개로 구성 되었다고 해서 모듈이 아니라, import/export 등의 키워드로 내보내지고 불러오는지에 따라 모듈이라 부름
• 독립된 기능 단위로 만들어야 함

브라우저

<script> // 전역 스코프
<script type="module"> 👉 파일 단위 스코프. (var도 지역처럼 동작)

Node.js

• 항상 모듈 스코프다.
• 어떤 모듈 시스템이냐에 따라 불러오는 방법만 다름
• 문법만 다름

CommonJS (옛날 방식): require() / module.exports
ESM (표준 방식): import / export

CommonJS vs ESM 차이

구분	CommonJS	ESM
기본 문법	require() / module.exports	import / export
실행 방식	런타임에 불러옴 (동적)	컴파일 단계에서 미리 파악 (정적)
파일 확장자	.cjs (보통 .js)	.mjs (또는 package.json에 “type”: “module”)
스코프	파일 단위	파일 단위

• package.json에 “type” : “module” 을 쓰면 js도 esm 취급을 한다.