Flutter 기초 공부 1: 작동방식 개요

들어가며

본 게시글은 노마드코더의 Flutter로 웹툰 만들기를 보고 정리한 글입니다.

Flutter Docs : https://docs.flutter.dev/

How Flutter Works

Framework와 Engine

Swift로 iOS나 Java로 안드로이드 네이티브 앱을 개발할 때 네이티브 프레임워크는 운영체제와 직접적으로 소통한다. 반면 Flutter와 Dart는 운영체제와 직접적으로 소통하지 않고 C나 C++로 짜여진 엔진과 소통한다. 엔진은 Flutter 어플리케이션의 실제 UI를 렌더링한다. 운영체제와 직접적으로 소통하지 않고 엔진을 거치기 때문에 운영체제에 내장된 플랫폼 위젯은 사용하지 않는다.

 

즉 운영체제에서는 엔진만 실행하고 엔진은 프레임워크를 동작시킨다.

 

iOS의 경우 엔진의 C/C++ 코드는 LLVM(Low Level Virtual Machine)으로 컴파일되고, Dart 코드는 AOT로 네이티브와 ARM 라이브러리로 컴파일된다. 이 라이브러리들은 .ipa로 빌드되며 "runner" iOS 프로젝트에 포함된다. 따라서 유저가 어플리케이션을 다운받고 실행시키면 엔진은 "ruuner" iOS 프로젝트를 열고 이는 엔진을 실행하고, 엔진은 UI를 렌더링한다.

※ LLVM (Low Level Virtual Machine)은 iOS, MacOS 소프트웨어를 개발하기 위해 사용하던 GCC 컴파일러를 대치하기 위해 Apple이 오픈소스 프로젝트로 진행하고 있는 컴파일러 시스템이다.

 

안드로이드도 마찬가지로 엔진의 C/C++ 코드가 안드로이드의 NDK로 컴파일되고, Dart 코드는 AOT로 네이티브와 ARM, x86 라이브러리로 컴파일된다. 이 라이브러리들은 "runner" 안드로이드 프로젝트에 포함되고 .apk로 빌드된다. 따라서 유저가 어플리케이션을 실행시키면 엔진은 "runner" 프로젝트를 실행하고 엔진이 Dart 코드를 실행시킨다.

※ Android NDK는 C 및 C++와 같은 언어를 사용하여 네이티브 코드로 앱의 일부를 구현할 수 있게 하는 도구 모음이다.

 

Flutter의 문제는 위에서 볼 수 있는 것처럼 네이티브 위젯을 사용하지 않는다는 것이다. 모두 운영체제에 의해 그려지는 실제 네이티브가 아니고 렌더링 엔진에 의해 그려진다. 반면에 이는 Flutter를 통해 네비게이션, 애니메이션 등 호스트에 의존할 필요 없이 통제할 수 있는 것들이 많아진다는 것이기도 하다.

 

Embedder

임베더는 엔진을 실행하는 "runner" 프로젝트를 의미한다. 이는 iOS, 안드로이드, 맥OS, 윈도우, 리눅스를 위한 다양한 임베더가 존재한다.