Flutter란 무엇인가?

Byungwoo Choi·2023년 8월 7일
0

Flutter

목록 보기
1/1
post-thumbnail

Flutter란?

  • Flutter는 고성능, 고품질의 IOS, Android 앱과 웹을 단일 코드 베이스로 개발할 수 있는 구글의 모바일 UI 프레임 워크
  • 스크롤 동작, 글씨, 아이콘과 같이 플랫폼 별로 달라지는 부분들을 아울러서 서로 다른 플랫폼에서도 자연스럽게 동작하는 고성능의 앱을 개발할 수 있게 하는 것이 Flutter의 목표

단일 코드 베이스로 개발을 할 수 있다는 것은?

  • 한 번 코딩으로 IOS, Android앱을 만들 수 있다는 뜻
  • 하나의 앱을 만들기 위해서 IOS와 Android를 위한 2개의 코드(Java, Swift)가 필요
  • 하지만 플러터는 하나의 코드베이스로 크로스 플랫폼 개발을 가능하게 함

UI 프레임워크란?

  • UI란 User Interface의 줄임말
  • 사용자와 애플리케이션이 커뮤니케이션을 할 수 있도록 도움을 주는 매개체 역할
  • 그 매체의 역할을 하는 종류는 다양하게 존재
  • 휴대폰 화면의 터치 이벤트, 리모콘의 버튼 이벤트 등 . . .

프레임워크란?

  • Frame(틀)과 Work(일)의 합성어
  • 어떤 틀 안에서 일을 할 수 있게 도움을 주는 환경

플러터의 특징

  • 구글이 지원하는 무료 오픈소스
  • 네이티브앱으로 컴파일이 가능하여 네이티브 수준의 성능을 자랑(AOT 지원 / Skia엔진 보유)
  • 크로스플랫폼용 앱을 구현할 수 있도록 도움
  • 플러터의 모든 것은 위젯이기 때문에 위젯에 대해서만 개념을 숙지하면 쉽게 개발 가능
  • Dart라는 프로그래밍 언어 사용 (Kotlin, Swift, Java, Typescript를 알고 있으면 쉬움)
  • Dart를 네이티브 코드로 컴파일하여 앱에 빌드 가능
  • 앱 개발시 핫 리로드라는 특수 기능이 있는 가상 머신 (VM)을 사용
  • 코드를 업데이트하고 다시 배포하지 않고도 코드를 저장하면 변경 사항을 실시간으로 확인 가능

Dart언어의 특징

  • C#, Javascript, Java 어떤 언어든 숙지가 되어 있다면 배우기 쉬움
  • Type을 지원하는 언어
  • Type 추론을 지원
  • 단일 스레드로 비동기 방식 지원
  • UI에 최적화된 언어
  • 동시성을 지원하지만 완벽하게 격리됨(isolate)을 보장
  • 스프레드 연산자를 지원
  • 배열은 없고 컬렉션만 존재

Skia 엔진

  • 2D 그래픽 라이브러리(엔진)

  • React의 경우
    - React는 CSS로 버튼을 만듦
    - Android / IOS 에서 버튼과 동일한 것을 찾아냄
    - 해당 버튼을 휴대폰에 그림
    - 이러한 것들을 브릿지(bridge)라 함
    image

  • Flutter의 경우
    - 버튼을 만듦
    - 자체 내장되어 있는 Skia 엔진 이라는 곳에서 바로 그리고 휴대폰에 저장
    image

AOT와 JIT 지원

  • AOT(Ahead of time) : 프로덕션 모드
    • Dart언어로 개발한 코드를 휴대폰에 빌드하기 전에 해당 핸드폰의 기계어 코드(네이티브 코드)로 사전 컴파일하여 코드를 빌드
    • 즉, 네이티브 성능을 낼 수 있음
    • Dart Code -> IOS Native Code(사전 컴파일) -> IOS
    • Dart Code -> Android Native Code(사전 컴파일) -> Android
  • JIT(Just in time) : 개발 모드
    • 런타임에서 실행할 수 있는 중간언어로 변환 후 Dart의 가상머신(VM)을 통해서 중간언어를 실시간으로 번역
  • 해당 기계에 맞게 번역을 하고 즉시 실행
  • AOT에 비해 런타임시 실행이 느림
  • 이 방식은 개발 모드에서만 사용
  • 프로덕션 모드에서는 AOT를 사용
  • Dart Code(코드 생성) -> Dart 가상머신이 이해할 수 있는 중간언어로 변환(컴파일) -> Dart가상머신 -> 실행(해당 휴대폰에 맞게 컴파일 및 실행)
profile
코린이는 코린코린 하고 울지요.

1개의 댓글

comment-user-thumbnail
2023년 8월 7일

유익한 글이었습니다.

답글 달기