# メモリ管理 (React Native)

> メモリリーク、クリーンアップ、useEffect cleanup、listeners、timers、大きな画像の処理

- 20 面接問題
- Senior
- [面接問題: React Native](https://sharpskill.dev/ja/technologies/react-native/interview-questions.md)

## 1. React Native アプリケーションにおける memory leak とは何ですか？

**回答**

memory leak は、メモリ上のオブジェクトがアプリケーションで使われなくなったにもかかわらず、それらへの参照がまだ残っているために garbage collector が解放できないときに発生します。React Native では、クリーンアップされていない subscription、unmount 後も動き続ける timer、古い参照を捕捉した closure などでよく起こります。memory leak はパフォーマンスを徐々に低下させ、長時間のセッションでクラッシュを引き起こすことがあります。

## 2. メモリ管理において useEffect の戻り値の関数（cleanup function）はどのような役割を果たしますか？

**回答**

useEffect が返す cleanup function は、コンポーネントが unmount される前、または新しい依存関係でエフェクトが再実行される前に実行されます。その主な役割は、エフェクトが確保したリソースをクリーンアップすることです。subscription のキャンセル、clearTimeout/clearInterval、event listener の削除、進行中のリクエストの中断などを行います。このクリーンアップがないと、これらのリソースはメモリ上に残り続け、unmount されたコンポーネントを更新しようとすることがあります。

## 3. useEffect の cleanup function で clearTimeout と clearInterval を使うことが重要なのはなぜですか？

**回答**

setTimeout や setInterval で作成された timer は、コンポーネントが unmount された後も実行され続けます。timer の callback が unmount されたコンポーネントの state を更新しようとすると、'Can't perform a React state update on an unmounted component' という warning が発生し、memory leak になります。timer は callback とその closure への参照を保持するため、garbage collector がこれらのリソースを解放できません。cleanup で clearTimeout/clearInterval を使うことで、これらの timer を適切にキャンセルできます。

## さらに17問利用可能

- React Native で event listener を使うときに memory leak を防ぐにはどうすればよいですか？
- React Nativeコンポーネントにおいて、closureはメモリ管理にどのような影響を与えますか？

無料で登録: https://sharpskill.dev/ja/login

## その他のReact Native面接トピック

- [JavaScript の基礎](https://sharpskill.dev/ja/technologies/react-native/interview-questions/javascript-essentials.md): 25問, Junior
- [React の基礎](https://sharpskill.dev/ja/technologies/react-native/interview-questions/react-fundamentals.md): 20問, Junior
- [React Native の基礎](https://sharpskill.dev/ja/technologies/react-native/interview-questions/react-native-basics.md): 22問, Junior
- [React Hooks](https://sharpskill.dev/ja/technologies/react-native/interview-questions/react-hooks.md): 20問, Junior
- [React と React Native のための TypeScript](https://sharpskill.dev/ja/technologies/react-native/interview-questions/typescript-for-react-native.md): 22問, Junior
- [React Native のコンポーネントと API](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-components-api.md): 20問, Junior
- [React Native のスタイリングとレイアウト](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-styling-layout.md): 18問, Junior
- [React Native ナビゲーション](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-navigation.md): 22問, Mid-Level
- [React Native の状態管理](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-state-management.md): 24問, Mid-Level
- [React Native のネットワーキングと API](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-networking-api.md): 20問, Mid-Level
- [データの永続化](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-data-persistence.md): 20問, Mid-Level
- [フォームとバリデーション](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-forms-validation.md): 18問, Mid-Level
- [React Native アニメーション](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-animations.md): 22問, Mid-Level
- [Native Modules & Bridge](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-native-modules.md): 20問, Mid-Level
- [プラットフォーム固有のコード](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-platform-specific-code.md): 18問, Mid-Level
- [権限とデバイスAPI](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-permissions-apis.md): 20問, Mid-Level
- [Push Notifications](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-push-notifications.md): 18問, Mid-Level
- [React Native のテスト](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-testing.md): 20問, Mid-Level
- [React Native のデバッグ](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-debugging.md): 18問, Mid-Level
- [Build & Deployment](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-build-deployment.md): 20問, Mid-Level
- [Expo vs React Native Bare](https://sharpskill.dev/ja/technologies/react-native/interview-questions/expo-vs-bare-rn.md): 18問, Mid-Level
- [パフォーマンス最適化](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-performance-optimization.md): 24問, Senior
- [Architecture Patterns](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-architecture-patterns.md): 22問, Senior
- [React Native の New Architecture](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-new-architecture.md): 24問, Senior
- [セキュリティのベストプラクティス](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-security-best-practices.md): 20問, Senior
- [Offline-First Architecture](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-offline-first.md): 20問, Senior
- [React Native の CI/CD](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-ci-cd.md): 20問, Senior
- [Monorepoとコード共有](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-monorepo-architecture.md): 18問, Senior
- [高度なトピック](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-advanced-topics.md): 22問, Senior
- [アプリのライフサイクルとバックグラウンド実行](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-app-lifecycle-background.md): 20問, Mid-Level
- [認証とセッション管理](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-auth-session-management.md): 22問, Mid-Level
- [Monitoring & Crash Reporting](https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-monitoring-crash-reporting.md): 20問, Senior

---

Source: SharpSkill (https://sharpskill.dev), tech interview preparation for your real stack.
HTML version of this page: https://sharpskill.dev/ja/technologies/react-native/interview-questions/rn-memory-management