모바일 개발 · 중급
React Native에서 `StyleSheet.create`를 사용하여 스타일을 정의하는 것이 인라인 스타일이나 일반 JavaScript 객체를 직접 사용하는 것보다 어떤 이점들이 있나요?
힌트 · StyleSheet.create는 스타일 객체를 한 번만 생성하여 메모리 사용을 최적화하고, 네이티브 모듈로 전달되어 더 효율적인 렌더링을 가능하게 합니다.
성능최적화타입 안정성재사용성유지보수성
모범답안
StyleSheet.create를 사용하면 몇 가지 중요한 이점이 있습니다.
첫째, 성능 최적화입니다. StyleSheet.create는 스타일 객체를 한 번만 생성하고, 이를 네이티브 모듈로 전달합니다. 이렇게 하면 매 렌더링마다 새로운 스타일 객체를 생성하는 인라인 스타일이나 일반 JavaScript 객체 사용 시 발생하는 불필요한 오버헤드를 줄여줍니다. 이는 특히 복잡한 UI나 많은 컴포넌트가 렌더링될 때 앱의 전반적인 성능 향상으로 이어집니다.
둘째, 타입 안정성과 유지보수성입니다. StyleSheet.create는 스타일 객체의 유효성을 검사하고, 잠재적인 오류를 미리 잡아낼 수 있도록 도와줍니다. 또한, 스타일을 중앙 집중식으로 관리할 수 있어 코드의 가독성과 재사용성이 높아지고, 나중에 스타일을 수정하거나 확장하기가 훨씬 용이해집니다.
읽었다면, 이제 직접 답해볼 차례예요
패스잇 앱에서 이 질문에 말로 답하면 AI가 꼬리질문까지 이어가며 1:1 코칭합니다.
함께 보는 React Native 면접 질문
- React Native 컴포넌트에서 `useEffect` 훅의 의존성 배열(dependency array)과 클린업(cleanup) 함수를 사용하여 발생할 수 있는 일반적인 메모리 누수나 불필요한 재실행 문제를 어떻게 방지할 수 있나요?
- React Navigation 라이브러리에서 `Stack Navigator`와 `Tab Navigator`의 주요 차이점은 무엇이며, 각각 어떤 사용자 경험을 제공할 때 더 적합하다고 생각하시나요?
- React Native 애플리케이션에서 `Context API`와 `Redux` (또는 MobX와 같은 전역 상태 관리 라이브러리)의 차이점을 설명하고, 각각 어떤 상황에 더 적합하다고 판단하시나요?
- `FlatList` 컴포넌트의 성능을 최적화하기 위한 방법들을 3가지 이상 설명하고, 각 방법이 어떤 원리로 성능 향상에 기여하는지 구체적으로 설명해주세요.
- React Native에서 JavaScript 코드와 네이티브 모듈(Java/Kotlin for Android, Objective-C/Swift for iOS) 간의 통신 원리에 대해 설명하고, 네이티브 모듈을 언제 사용해야 하는지 예시를 들어주세요.
- React Native 애플리케이션에서 발생할 수 있는 일반적인 렌더링 성능 저하 문제를 어떻게 진단하고 해결할 수 있나요? 디버깅 도구(예: Flipper, React DevTools) 활용 방안을 포함하여 설명해주세요.