[Daily Contents] 플러터로 앱 개발해보기


성능테스트

IOS용 CPU 집약적 테스트

  • Gauss-Legendre 알고리즘
    • React Native는 Flutter나 native에 비해서 25배 정도 CPU 사용률이 높음
  • Borwein 알고리즘
    • React Native는 물론 Flutter의 CPU 사용률도 높음

Android용 CPU 집약적 테스트

  • Gauss-Legendre 알고리즘
    • 마찬가지로 React Native의 CPU 사용률이 압도적으로 높음

기타 성능비교

  • React Native의 성능이 가장 하위

Flutter

  • 공식 문서에 React Native 사용자를 위한 Flutter 소개, JS 개발자를 위한 Dart 소개 등이 기재되어 있음


ex) List 출력

child: Column(
  children: [
    Expanded(child: ListView.builder(
      itemCount: Images.length,
      itemBuilder: (context, index){
        return InkWell(
          onTap: (){
            print("$indtex clikced");
          },
          child: Padding(
            padding: const EdgeInsets.only(top: 20),
            child: Stack(
              children: <Widget>[
                Material(
                  child: Container(
                    height: 300,
                    width: double.infinity,
                    child: Images[Index].isEmpty ? null
                    : CachedNetworkImage(
                    imageUrl: Images[index],
                      imageBuilder: (context, imageProvider) => Container(
                        decoratrion: BoxDecoration(
                          image: Decoration(
                            image: imageProvider,
                            fit: BoxFit.cover
                          )
                        )
                      )
                    )
                  )
                ]
              )
            )
          )
        }
      )
    )
  ]
)

위는 정적인 코드. 동적인 코드를 원한다면 StringBuilder를 사용.

Q&A

Q. 최신 버전을 Flutter가 자동으로 설정해 주는지?
A. 버전이 기입되지 않은 경우 Flutter 자체적으로 버전을 설정.
Q. Flutter는 state 변경을 어떻게 감지하나요?
A. 자식 트리가 변경이 되면 부모 트리에게 통지함.
Q. 플러터가 안드로이드에 비해 갖는 강점은?
A. IOS 개발도 동시에 가능하기에 비용 절감. 다만 성능 저하의 단점은 있음.
Q. Flutter 공부는 어떤 방식으로?
A. 구글이 만든 것이기에 공식 문서 참고.

댓글남기기