View
플러터의 다트 언어를 공부하면서, 다트는 JIT와 AOT를 둘 다 지원하는 언어이기에 효율적이라는 내용이 나왔다. 둘이 충돌하는 내용이 아닌가?? 라는 의구심이 들어서 찾아보았다.
ㅤ
- JIT - Just In Time
- JIT 컴파일러는 프로그램 소스코드를 네이티브 기계어로 프로그램의 실행 직전에 (런타임에) 컴파일을 수행한다. 다음에 실행될 명령어를 예측하고 코드를 실행 직전에 컴파일 하는 방식으로 작동한다.
- 일반적으로 [빌드 > 중간 언어로 전달 > 런타임에 중간 언어를 기계어로 변환] 의 매커니즘으로 프로그램을 실행한다.
- 장점
- 환경에 맞게 실시간으로 기계어로 변환할 수 있어, 효율적인 실행을 할 수 있다. 배포되는 프로그램 파일의 사이즈가 비교적 작다.
- JIT 컴파일러를 사용하면 실행 중에 바뀐 코드에 대해서도 컴파일이 가능하기 때문에, 개발 중에 코드를 수정했을 때 Hot-Reload를 통해 결과를 바로바로 화면에 보여줄 수 있다. 중간 언어만 전달하면 되서, 설치가 빠르다.
- 단점
- 아무래도 실행 중에 코드를 컴파일을 계속 해야하다보니, 실행 성능 자체는 비교적 낮을 수 있다.
- AOT - Ahead Of Time
- AOT 컴파일러는 실행 이전에 컴파일을 완료한 뒤 기계어를 전달한다.
- 실행 전에 전체 코드를 컴파일을 하기 때문에 실행 속도가 빠르다.
- 설치 시 소스코드/중간 언어로 전달 받은 뒤 환경에 맞게 컴파일까지 해줘야 하기 때문에 설치가 느리다. Hot-Reload를 사용할 수 없다.(처음부터 끝까지 컴파일을 해야하니깐)
ㅤ
두 방식이 완전히 다르지 않나? 라고 생각을 했는데, 아니나 다를까 두 방식을 따로 적용해준다고 한다!
- 개발 중에는 JIT 컴파일러를 통해 Hot-Reload 등을 통한 효율적인 실행 및 수정사항 확인을 지원
- 배포 시에는 AOT 컴파일러를 통해 런타임 실행 성능을 확보
ㅤ
Develop 과 Deploy 시에 각자 다른 방식의 컴파일러를 유연하게 적용하여 각자의 장점을 서비스의 개발과 배포 과정에 잘 활용하는 방식이라는 생각이 들었다. 오…
React Native가 실행 성능이 느린 이유
내용을 함께 찾아보면서, React Native의 성능이 Flutter 보다 느릴 수 밖에 없는 이유를 찾을 수 있었다.
React Native는 기본적으로 JavaScript를 기반으로 작동하고 있으며, JavaScript는 매우 dynamic한 타입을 가지고 있다. 사실 변수 등의 타입이 정해져있지 않고, 런타임 중에 들어오는 값에 따라서 타입이 결정되고, 이에 따른 함수의 실행이 결정된다. 따라서, 타입과 실행 흐름 등을 컴파일 타임에 미리 예측하기가 매우 어렵다!! 즉, JS는 Just In Time 방식에 많은 기능들을 의존하고 있고, 이로 인해 미리 네이티브 언어로 컴파일을 해두지 못해 런타임에 코드를 번역하느라 리액트의 성능이 낮아질 수 밖에 없다.
반면 Dart는 AOT 컴파일러를 사용할 수 있기 때문에 네이티브 언어로 직접 컴파일이 가능하고, 이로 인해 네이티브 급의 성능을 뽑아낼 수 있다고 한다.
이론적으로는 JS를 네이티브 코드로 (AOT 방식으로) 컴파일 하는게 가능하겠지만 그렇게 할 경우 JS의 많은 기능들을 제한적으로 사용해야 하거나 변환된 코드가 너무 비대해져 장점을 잃게 된다고 한다.
흠. 난 크로스플랫폼이면 각자의 엔진 위에서 코드들이 동작하기 때문에 당연히 리액트나 플러터나 모두 실행 성능이 네이티브에 비해 많이 떨어질 수 밖에 없을 것이라 생각했었는데, 요런 부분들을 플러터는 다트를 네이티브 코드로 컴파일이 가능한 언어로 만들어서 해결하려고 했다는 점이 흥미로웠다. 호오오... 또 JS가 가지고 있는 "타입 없이 자유롭게 변수를 사용하는 코드"가 개발의 편의성을 위해서라고 단순하게 생각했었는데, JIT와 AOT 2가지 타입의 컴파일러가 존재하며 AOT가 아닌 JIT를 사용하였기에 가능한 것이며, 이런 이유로 AOT 컴파일러를 채택한 언어들에서 JS같은 dynamic type을 적극적으로 사용하기 힘들다는 것을 배웠다. 오...
ㅤ
Shout Out
'Develop > Flutter 개발' 카테고리의 다른 글
[Flutter] 이모지 불꽃놀이 애니메이션 만들기 (1) | 2023.10.31 |
---|---|
[Flutter] 이펙트 버튼과 Animation Controller (0) | 2023.10.28 |
[Flutter] 클린 아키텍처스럽게 Riverpod 쓰려는 고민s (0) | 2023.10.15 |
[Flutter] Riverpod 상태관리 방법 정리 (0) | 2023.10.14 |
[Flutter] MVC, MVVM (0) | 2023.10.09 |