[Flutter] Flutter의 동작원리 및 Isolate와 쓰레드

Flutter를 사용하여 애플리케이션을 개발하는 과정에서 UI가 버벅거리거나 성능이 저하되는 현상을 경험한 개발자들이 많을 것이다. 이는 주로 메인 스레드에서 무거운 작업을 처리할 때 발생하는 문제다. 이 문서에서는 Flutter의 내부 아키텍처와 Isolate 시스템의 작동 방식, 그리고 이를 활용한 최적화 방법에 대해 기술적 관점에서 심층적으로 살펴본다.

1. Flutter 아키텍처 개요

Flutter는 단일 코드베이스로 다양한 플랫폼에서 동작하는 UI 프레임워크다. Flutter 애플리케이션은 다음과 같은 계층 구조로 구성된다.

Flutter Application
│
├── Framework Layer (Dart)
│   ├── Material/Cupertino (디자인 시스템)
│   ├── Widgets (UI 컴포넌트)
│   ├── Rendering (레이아웃, 페인팅)
│   └── Foundation (기본 클래스, 유틸리티)
│
└── Engine Layer (C/C++)
    ├── Skia (그래픽 엔진)
    ├── Dart Runtime
    └── Platform-specific Embedders

Flutter 애플리케이션은 OS 수준에서 하나의 프로세스로 실행되며, 기본적으로 싱글 스레드 모델을 사용한다. 이 스레드는 UI 렌더링, 이벤트 처리, 비즈니스 로직 실행 등 모든 작업을 담당하며, 일반적으로 "메인 스레드" 또는 "UI 스레드"라고 불린다.

2. 프로세스와 쓰레드의 기본 개념

Flutter의 병렬 처리 모델을 이해하기 위해서는 먼저 프로세스와 쓰레드의 개념을 정확히 이해해야 한다.

구분 프로세스(Process) 쓰레드(Thread)

정의	독립된 메모리 공간을 가지는 실행 단위	프로세스 내에서 메모리를 공유하는 실행 흐름
메모리 공유 여부	독립적인 메모리 영역	동일 프로세스 내에서 메모리 공유
생성 비용	높음 (메모리 할당, 자원 초기화 등)	낮음 (상대적으로 빠른 생성)
컨텍스트 스위칭 비용	높음	낮음
오류 격리	완벽한 격리	제한적인 격리 (한 스레드의 오류가 전체 프로세스에 영향)

일반적으로 모바일 애플리케이션은 하나의 프로세스로 실행되며, 내부적으로 여러 스레드를 활용하여 다양한 작업을 동시에 처리한다.

3. Flutter의 이벤트 루프 모델

Flutter는 이벤트 루프 기반의 실행 모델을 사용한다. 이는 다음과 같은 구조로 동작한다:

메인 스레드 (이벤트 루프)
┌─────────────────────────────────────────┐
│                                         │
│  ┌───────────┐      ┌───────────────┐   │
│  │           │      │               │   │
│  │  이벤트   │ ──▶ │  이벤트 처리  │   │
│  │  큐(Queue)│      │               │   │
│  │           │ ◀─── │               │   │
│  └───────────┘      └───────────────┘   │
│                                         │
└─────────────────────────────────────────┘

이벤트 루프는:

1. 이벤트 큐에서 다음 이벤트를 가져온다 (사용자 입력, 타이머, 네트워크 응답 등)
2. 해당 이벤트에 대한 처리 함수를 실행한다
3. 필요한 경우 UI를 업데이트한다
4. 다시 1번으로 돌아가 다음 이벤트를 처리한다

이 모델의 핵심적인 특징은 한 번에 하나의 작업만 처리한다는 점이다. 따라서 시간이 오래 걸리는 작업을 실행하면 전체 애플리케이션의 응답성이 저하될 수 있다.

4. Isolate: Flutter의 병렬 처리 솔루션

Flutter는 UI 응답성 문제를 해결하기 위해 Isolate라는 독특한 병렬 처리 메커니즘을 제공한다. Isolate는 다음과 같은 특징을 가진다:

4.1 Isolate의 핵심 특징

• 메모리 격리: 각 Isolate는 완전히 독립된 메모리 공간(힙)을 가지며, 다른 Isolate와 직접적인 메모리 공유가 불가능하다
• 메시지 기반 통신: Isolate 간 데이터 교환은 메시지 전달 방식으로만 이루어진다
• 독립적인 이벤트 루프: 각 Isolate는 자체적인 이벤트 루프를 가지고 독립적으로 작업을 처리한다

4.2 Isolate와 OS 스레드의 관계

중요한 내부 구조는 다음과 같다:

1. Flutter 앱은 OS 관점에서 하나의 프로세스로 실행된다
2. Dart VM은 이 프로세스 내에서 여러 개의 OS 스레드를 관리한다
3. 각 Isolate는 별도의 OS 스레드 위에서 실행된다

Flutter 애플리케이션 (단일 OS 프로세스)
│
├── Main Isolate (UI Thread)
│    └── Dart Event Loop
│
└── Background Isolates (별도 OS 스레드)
     ├── Isolate 1
     │    └── Dart Event Loop
     └── Isolate 2
          └── Dart Event Loop

5. Isolate 간 통신 메커니즘

Isolate는 메모리를 공유하지 않으므로, 데이터 교환을 위해서는 메시지 패싱(Message Passing) 방식을 사용해야 한다.

5.1 SendPort와 ReceivePort

Flutter는 Isolate 간 통신을 위해 다음 두 가지 주요 인터페이스를 제공한다:

• ReceivePort: 메시지를 수신하는 엔드포인트
• SendPort: 다른 Isolate로 메시지를 보내는 엔드포인트

다음은 기본적인 Isolate 통신 예제이다:

import 'dart:isolate';

void isolateFunction(SendPort mainSendPort) {
  // 새 Isolate에서 ReceivePort 생성
  final isolateReceivePort = ReceivePort();
  
  // 메인 Isolate에게 이 Isolate의 SendPort 전송
  mainSendPort.send(isolateReceivePort.sendPort);
  
  // 메시지 수신 대기
  isolateReceivePort.listen((message) {
    // 계산 수행 (예: 숫자의 제곱)
    int result = message * message;
    
    // 결과를 메인 Isolate로 전송
    mainSendPort.send(result);
  });
}

Future<void> main() async {
  // 메인 Isolate에서 ReceivePort 생성
  final mainReceivePort = ReceivePort();
  
  // 새 Isolate 생성 및 메인 Isolate의 SendPort 전달
  await Isolate.spawn(isolateFunction, mainReceivePort.sendPort);
  
  // 새 Isolate로부터 SendPort 수신
  final isolateSendPort = await mainReceivePort.first as SendPort;
  
  // 데이터 전송 (숫자 10)
  isolateSendPort.send(10);
  
  // 결과 수신 대기
  mainReceivePort.listen((response) {
    print('결과: $response'); // 결과: 100
  });
}

5.2 데이터 전달 시 고려사항

Isolate 간 메시지 전달 시 주의해야 할 점:

1. 데이터는 **복사(copy)**되므로, 대용량 데이터 전송 시 성능 저하 가능성
2. 전송 가능한 데이터 타입이 제한됨 (기본 타입, List, Map, 등)
3. 참조 타입의 경우 객체의 참조가 아닌 내용이 복사됨

대용량 데이터를 효율적으로 전송하려면 TransferableTypedData를 사용하여 복사 없이 소유권을 이전하는 방식을 활용할 수 있다.

6. Flutter 엔진과 Dart VM의 역할

Flutter 앱의 실행 환경은 두 가지 주요 구성 요소로 이루어져 있다:

6.1 Flutter 엔진

• C/C++로 구현된 핵심 런타임 환경
• Skia 그래픽 라이브러리를 통한 렌더링 처리
• 플랫폼별 특화 기능 제공
• Dart VM 임베딩 및 관리

6.2 Dart VM

• Dart 코드 실행 환경 제공
• JIT(Just-In-Time) 및 AOT(Ahead-Of-Time) 컴파일 지원
• 가비지 컬렉션(GC) 수행
• Isolate 생성 및 OS 스레드 할당

Dart VM은 Isolate가 생성될 때마다 내부적으로 새로운 OS 스레드를 할당하여 해당 Isolate를 실행한다. 이는 Flutter에서 진정한 병렬 처리가 가능한 이유다.

7. 실제 개발에서의 Isolate 활용

7.1 적합한 사용 시나리오

• CPU 집약적 작업: 이미지 처리, 암호화, 복잡한 알고리즘 연산
• 대용량 데이터 처리: JSON 파싱, 데이터 변환, 필터링
• 백그라운드 작업: 주기적 데이터 동기화, 대용량 파일 처리

7.2 이미지 처리 예제

import 'dart:isolate';
import 'dart:typed_data';
import 'package:image/image.dart' as img;

// Isolate에서 실행될 함수
void processImageIsolate(Map<String, dynamic> data) {
  SendPort sendPort = data['sendPort'];
  Uint8List imageBytes = data['imageBytes'];
  
  // 이미지 디코딩
  img.Image? image = img.decodeImage(imageBytes);
  
  if (image != null) {
    // 이미지 처리 (흑백 변환)
    img.Image grayscale = img.grayscale(image);
    
    // 처리된 이미지 인코딩
    Uint8List processedBytes = img.encodeJpg(grayscale) as Uint8List;
    
    // 결과 반환
    sendPort.send(processedBytes);
  } else {
    sendPort.send(null);
  }
}

// 메인 코드에서 호출하는 함수
Future<Uint8List?> processImage(Uint8List imageBytes) async {
  final ReceivePort receivePort = ReceivePort();
  
  await Isolate.spawn(
    processImageIsolate, 
    {
      'sendPort': receivePort.sendPort,
      'imageBytes': imageBytes,
    }
  );
  
  // 결과 대기
  final processedBytes = await receivePort.first;
  return processedBytes != null ? processedBytes as Uint8List : null;
}

7.3 compute() 함수 활용

Flutter는 Isolate를 간편하게 사용할 수 있는 compute() 유틸리티 함수를 제공한다:

import 'package:flutter/foundation.dart';
import 'dart:typed_data';

Future<Uint8List?> processImage(Uint8List imageBytes) async {
  return await compute(_processImageFunction, imageBytes);
}

// 독립적인 순수 함수로 구현해야 함
Uint8List? _processImageFunction(Uint8List imageBytes) {
  // 이미지 처리 로직
  return processedImageBytes;
}

이 함수는 내부적으로 Isolate 생성, 메시지 전달, Isolate 종료 등의 작업을 자동으로 처리해준다.

8. Isolate 사용 시 주의사항 및 최적화 기법

8.1 주의사항

1. Isolate 생성 비용: Isolate 생성은 비용이 큰 작업이므로, 빈번한 생성/소멸은 피해야 한다
2. UI 접근 불가: 백그라운드 Isolate에서는 UI 위젯이나 상태에 직접 접근할 수 없다
3. 플랫폼 채널 제한: 백그라운드 Isolate에서는 플랫폼 채널을 직접 호출할 수 없다
4. 디버깅 복잡성: 다중 Isolate 환경에서는 디버깅이 더 복잡해질 수 있다

8.2 최적화 기법

1. Isolate 풀링: 여러 작업을 처리하기 위해 Isolate를 재사용하는 패턴 구현
2. 데이터 최소화: Isolate 간 전달되는 데이터를 최소화하여 복사 비용 절감
3. TransferableTypedData: 대용량 데이터 전송 시 소유권 이전 방식 활용
4. 적절한 작업 크기: 너무 작은 작업에 Isolate를 사용하면 오히려 오버헤드가 커질 수 있음

다음은 Isolate 풀링 패턴의 간단한 예제이다:

class IsolatePool {
  final List<_IsolateData> _isolates = [];
  final int maxIsolates;
  
  IsolatePool({this.maxIsolates = 4});
  
  Future<void> initialize() async {
    for (int i = 0; i < maxIsolates; i++) {
      final receivePort = ReceivePort();
      final isolate = await Isolate.spawn(_isolateEntryPoint, receivePort.sendPort);
      final sendPort = await receivePort.first as SendPort;
      
      _isolates.add(_IsolateData(
        isolate: isolate,
        sendPort: sendPort,
        busy: false,
      ));
    }
  }
  
  Future<T> compute<T>(Function(dynamic) func, dynamic message) async {
    // 사용 가능한 Isolate 찾기
    final isolateData = await _getAvailableIsolate();
    final completer = Completer<T>();
    
    // 작업 실행 및 결과 수신 로직
    // ...
    
    return completer.future;
  }
  
  // 사용 가능한 Isolate 찾거나 대기
  Future<_IsolateData> _getAvailableIsolate() async {
    // 구현 로직
  }
  
  // 리소스 정리
  void dispose() {
    for (final data in _isolates) {
      data.isolate.kill();
    }
    _isolates.clear();
  }
}

class _IsolateData {
  final Isolate isolate;
  final SendPort sendPort;
  bool busy;
  
  _IsolateData({
    required this.isolate,
    required this.sendPort,
    this.busy = false,
  });
}

9. Isolate vs 일반적인 멀티스레딩 비교

Flutter의 Isolate 모델은 일반적인 멀티스레딩과 다음과 같은 차이점을 가진다:

구분 일반 멀티스레딩 Flutter Isolate

메모리 모델	공유 메모리	메모리 격리
동기화 메커니즘	락(Lock), 세마포어 등	메시지 패싱
데이터 접근	직접 접근 (동기화 필요)	메시지를 통한 간접 접근
복잡성	교착 상태, 경쟁 조건 등 발생 가능	단순하고 안전한 병렬 처리
디버깅	복잡함	상대적으로 용이함

Isolate 모델은 멀티스레딩의 복잡한 동기화 문제를 설계 단계에서 원천적으로 방지하여 안정적인 병렬 처리를 가능하게 한다.

10. 결론

Flutter의 Isolate는 UI 응답성을 유지하면서 복잡한 작업을 효율적으로 처리할 수 있는 강력한 메커니즘이다. 요약하면:

구분 설명

Flutter 앱(OS 관점)	하나의 프로세스로 실행됨
Dart VM 내부 구조	여러 OS 스레드를 관리하며 각 스레드 위에 Dart Isolate를 실행
각 Isolate 특징	독립된 메모리 공간, 메시지 기반 통신, 자체 이벤트 루프

Isolate의 메모리 격리 모델은 멀티스레딩의 복잡성 없이도 효율적인 병렬 처리를 가능하게 하며, 이를 통해 Flutter 애플리케이션은 복잡한 작업을 처리하면서도 60fps의 부드러운 UI 성능을 유지할 수 있다.

올바른 Isolate 활용 방법을 익히고 적용한다면, 복잡한 Flutter 애플리케이션에서도 뛰어난 성능과 사용자 경험을 제공할 수 있을 것이다.