Hello, Flutter 3.10
왜 Flutter 4.0이 아닐까 싶긴 하지만,
이번 Google I/O 2023에서는 Flutter 3.10이 Dart 3.0과 함께 발표 되었습니다.
이번 업데이트에서는 Web과 모바일 그리고 그래픽 업데이트와 더불어 보안 업데이트도 이루어졌습니다.
원 문서 링크 : https://medium.com/flutter/whats-new-in-flutter-3-10-b21db2c38c73
Material 3
Material 라이브러리는 이제 최신 Material Design spec와 일치합니다.
변경 사항에는 새로운 구성 요소 및 구성 요소 테마, 업데이트 된 구성 요소 시각화 등이 포함됩니다.
개발자는 useMaterial3 테마 플래그를 사용하여 이러한 변경 사항에 "옵트 인"해야 합니다. 다음 릴리스에서 useMaterial3는 true로 기본 설정됩니다.
Material 라이브러리의 M3 버전에 옵트 인하려면 MaterialApp 테마에서 useMaterial3 : true를 설정하세요. flutter create 명령은 새 앱을 생성할 때 이를 테마에 추가합니다.
이번 변경 사항을 미리보려면 데모 앱을 확인하세요.
데모에서는 useMaterial3을 켜고 끌 수 있습니다.
ColorScheme.fromImageProvider()
모든 M3 구성 요소는 테마의 ColorScheme의 기본 색상을 구성합니다.
기본 색상 체계는 보라색 계열을 사용합니다.
단일 "Seed" 색상 또는 이미지에서 사용자 지정 색상 체계를 만들 수 있습니다.
데모에서 두 가지 변형을 모두 시도해보세요.
생성된 색상 체계는 가시성과 접근성이 높아야 합니다.
NavigationBar
이 위젯은 BottomNavigationBar의 M3 버전을 제공합니다.
M3는 다른 색상, 하이라이팅 및 그림자를 사용하지만 이전과 같이 작동합니다. NavigationBars 의 기본 외관을 재정의하려면 NavigationBarTheme 를 사용하세요.
기존 앱을이 구성 요소로 마이그레이션 할 필요는 없지만 새 앱에서는 사용해야합니다.
NavigationDrawer
이것은 Drawer을 기반으로한 M3 위젯을 제공합니다. NavigationDrawer 는 NavigationDestinations 의 단일 선택 목록을 표시합니다.
이 목록에 다른 Widget도 포함시킬 수 있습니다. NavigationDrawer 는 필요할 때 스크롤 할 수 있으며, NavigationDrawers 의 기본 외형을 재정의하려면 NavigationDrawerTheme 을 사용하세요.
SearchBar and SearchAnchor
이러한 구성 요소는 검색 쿼리에 대한 예측 텍스트를 제공합니다.
사용자가 검색 쿼리를 입력하면 앱은 “Search View”에서 일치하는 응답 목록을 계산합니다.
사용자는 하나를 선택하거나 쿼리를 조정합니다.
이러한 구성 요소의 M3 디자인을 무시하려면 SearchBarTheme 및 SearchAnchorTheme 을 활용하세요.
보조 TabBar
M3를 사용하면 보조탭으로 구성된 콘텐츠를 만들 수 있습니다.
보조 TabBar를 구분하기 위해 TabBar.secondary를 사용합니다.
M3용 DatePicker / TimePicker가 업데이트되었습니다
M3 DatePicker와TimePicker 달력과 시계의 색상, 레이아웃 및 모양이 업데이트됩니다.
이것은 API를 변경하지 않지만 새로운 DatePickerTheme이나TimePickerTheme 추가합니다.
M3를 위한 BottomSheet 업데이트
M3 색상 및 모양 업데이트 이외에도, 이제 BottomSheet에는 showDragHandle 를 true로 설정할 경우 선택적인 상단 드래그 핸들이 추가되었습니다.
M3을 위한 ListTile 업데이트
M3 ListTile은 Widget의 위치 및 간격을 업데이트합니다.
이것은 Content Padding, 앞 / 뒤 Widget의 정렬, 최소 선행 폭 및 수직 간격을 포함합니다. API는 변경되지 않습니다.
TextField Update
M3은 모든 TextField 위젯을 원활한 제스처를 지원하도록 업데이트합니다. 마우스로 더블 클릭 또는 트리플 클릭하면 터치 기반 장치에서 더블 탭 또는 트리플 탭과 동일하게 작동합니다. 기본적으로 TextField 및 CupertinoTextField 위젯은 이러한 기능을 사용합니다.
TextField 더블 클릭/탭 제스처
- 더블 클릭 + 드래그: 단어 블록에서 선택 범위를 확장합니다.
- 더블 탭 + 드래그: 단어 블록에서 선택 범위를 확장합니다.
TextField 트리플 클릭/탭 제스처
트리플 클릭
- 멀티라인
TextField(Android/Fuchsia/iOS/macOS/Windows) 내에서 클릭한 위치의 문단 블록을 선택합니다. - 멀티라인
TextField(Linux) 내에서 클릭한 위치의 라인 블록을 선택합니다. - 싱글라인
TextField내의 모든 텍스트를 선택합니다.
트리플 탭
- 멀티라인
TextField내에서 클릭한 위치의 문단 블록을 선택합니다. - 싱글라인
TextField내의 모든 텍스트를 선택합니다.
트리플 클릭 + 드래그
- 문단 블록에서 선택을 확장합니다 (Android/Fuchsia/iOS/macOS/Windows).
- 라인 블록에서 선택을 확장합니다 (Linux).
Flutter는 SLSA 레벨 1을 지원합니다
Flutter 프레임워크는 이제 소프트웨어 아티팩트(SLSA) 레벨 1에 대한 공급망 수준과 함께 컴파일됩니다(SLSA).
이로 인해 많은 보안 기능이 구현되었음을 인정받았습니다.
- 스크립트 빌드 프로세스 : Flutter의 빌드 스크립트는 이제 신뢰할 수 있는 빌드 플랫폼에서 자동화된 빌드를 허용합니다.
보호된 아키텍처에서 빌드하는 것은 아티팩트 조작을 방지하여 공급망 보안을 향상시킵니다. - 다중 승인 및 감사 로깅 : Flutter 릴리스 워크플로는 여러 엔지니어가 승인한 후에 실행됩니다.
모든 실행은 감사 가능한 로그 레코드를 만듭니다.
이러한 변경 사항은 소스 코드와 아티팩트 생성 사이에 누구도 변경을 도입하지 못하도록 보장합니다. - 출처 : 베타 및 안정 버전은 이제 출처와 함께 빌드됩니다.
이것은 예상된 내용으로 신뢰할 수 있는 소스가 프레임워크 릴리스 아티팩트를 빌드했다는 것을 의미합니다.
각 릴리스는 SDK 아카이브에서 출처를 보고 검증할 수 있는 링크를 게시합니다.
이 작업은 팀이 SLSA L2 및 L3 규정으로 나아갈 수 있도록 합니다.
이 두 수준은 빌드 프로세스 중 및 이후 아티팩트 보호에 중점을 둡니다.
웹
플러터 웹 앱 로드 시간 개선
이번 릴리스에서는 아이콘 폰트의 파일 크기를 줄였습니다.
Material과 Cupertino에서 사용하지 않는 글리프를 제거했습니다.
모든 브라우저용 CanvasKit 크기 감소
Chromium 기반 브라우저는 더 작은 사용자 지정 CanvasKit “Flavor”를 사용할 수 있습니다.
호스팅된 CanvasKit은 Google 소유의 gstatic.com에서 제공됩니다.
이로 인해 성능이 더욱 개선됩니다.
Element 임베딩
이제 특정 요소에서 Flutter 웹 앱을 제공할 수 있습니다.
이전 릴리스에서는 앱이 전체 페이지 몸체를 채우거나 iframe 태그 내에 표시되는 방식만 가능했습니다.
샘플 코드는 GitHub에서 찾을 수 있습니다.
셰이더 지원
웹 앱에서는 Flutter의 프래그먼트 셰이더 지원을 사용할 수 있습니다.
Impeller
3.7 버전에서는 iOS에서 Impeller의 preview가 공개 되었었습니다.
이후 사용자들로부터 훌륭한 피드백을 받아 처리하였습니다.
이번 릴리스에서 Impeller에 250개 이상의 커밋을 반영하여,
iOS에서 Impeller를 기본 렌더러로 설정했습니다.
Flutter 3.10으로 iOS용 앱을 빌드하면 기본적으로 Impeller가 사용됩니다.
3.7 릴리스 이후 iOS에서 Impeller는 메모리 풋프린트를 개선했습니다. Impeller는 더 적은 렌더링 패스와 중간 렌더 타겟을 사용합니다.
새로운 아이폰에서는 손실 압축 텍스처를 활성화하면 정확도에 영향을 미치지 않으면서 메모리 풋프린트를 줄일 수 있습니다.
이러한 발전은 iPads에서 성능을 크게 향상시켰습니다.
“풀 쿼트(pull quote)” 화면과 같이 복잡한 화면을 고려해보세요.
이러한 개선으로 이러한 화면의 메모리 풋프린트가 거의 절반이 됩니다.
메모리 사용량의 감소는 GPU 및 CPU 부하에서 약간의 감소도 가져옵니다. Wondrous 앱은 이 부하 감소를 등록하지 않을 수 있습니다.
이 변경으로 배터리 수명이 연장됩니다.
Impeller는 팀이 인기있는 기능 요청을 더 빠르게 제공할 수 있도록합니다. 예를 들어, iOS에서 보다 넓은 P3 색 공간 지원을 제공합니다.
이 기능에 대한 설명은 이 글의 아래에서 찾을 수 있습니다.
커뮤니티 기여는 저희 진행을 가속화하는 데 기여했습니다.
특히 GitHub 사용자 ColdPaleLight 및 luckysmg가 관련 패치를 작성하여 충실도와 성능을 개선했습니다.
Impeller는 대부분의 Flutter 앱의 렌더링 요구 사항을 충족합니다.
Impeller에서 옵트 아웃할 수 있습니다.
옵트 아웃하는 경우 GitHub에 문제를 제기하여 이유를 알려주세요.
앱 사용자는 Skia와 Impeller이 약간 다르게 렌더링될 수 있다는 것을 알 수 있습니다.
이러한 차이는 버그일 수 있으므로 문제를 제기하지 마세요.
향후 릴리스에서는 iOS용 레거시 Skia 렌더러를 제거하여 Flutter의 크기를 줄일 예정입니다.
Impeller의 Vulkan 백엔드에 대한 진행이 계속되고 있습니다.
Android에서 Impeller는 활발히 개발 중이지만 미리보기용으로는 준비되지 않았습니다. 곧 더 많은 정보를 공유할 예정입니다.
진행 상황을 따라가려면 GitHub 프로젝트 보드를 확인하세요.
성능
이번 릴리스는 Impeller 외에도 더 많은 성능 개선과 수정 사항을 다룹니다.
Jank 제거
오픈 소스 기여자 luckysmg에게 감사의 말씀을 전합니다.
이번에 메탈 드라이버에서 다음 드로어블 레이어를 가져오는 데 걸리는 시간을 줄일 수 있다는 것을 발견했습니다.
이 보너스를 받으려면 FlutterViews의 배경색을 nil이 아닌 값으로 설정해야 합니다.
이 변경으로 인해 최근 iOS 120Hz 디스플레이에서 낮은 프레임 속도가 제거되었습니다.
경우에 따라 프레임 속도가 3배 증가합니다.
이 변경으로 인해 Flutter 팀은 상당수의 GitHub 이슈를 해결할 수 있었습니다.
이 변경은 3.7 릴리스에 핫픽스로 백포트되었습니다.
3.7 안정 버전에서는 로컬 이미지의 로딩을 플랫폼 스레드에서 Dart 스레드로 이동하여 플랫폼 스레드의 vsync 이벤트 지연을 피했습니다.
그러나 사용자들은 이러한 작업이 Dart 스레드에서 추가적인 작업을 유발해 일부 Jank을 일으킨다는 것을 알아차렸습니다.
이번 릴리스에서는 로컬 이미지의 열기와 디코딩을 백그라운드 스레드로 이동시켰습니다.
이 변경으로 인해 많은 로컬 이미지가 있는 화면에서 잠재적인 긴 일시 정지가 제거되었으며, vsync 이벤트의 지연이 없습니다. 이 업데이트는 로컬 테스트 및 자동화된 벤치마크에서 이 변경으로 인해 여러 이미지의 로드 시간이 절반으로 줄은 것을 확인 할 수 있었습니다.
플러터의 새로운 내부 DisplayList 구조 위에 최적화를 계속해서 구축하고 있습니다.
이번 릴리스에서는 R-Tree 기반의 culling 메커니즘을 추가했습니다.
이 메커니즘은 렌더러에서 그리기 작업을 훨씬 더 일찍 제거합니다.
이 최적화는 예를 들어 출력이 화면 밖으로 나가는 사용자 정의 painter의 가속화를 제공합니다.
마이크로벤치마크에서는 최대 50%까지 DisplayList 처리 시간이 감소했습니다.
클립된 사용자 정의 painter를 가진 앱은 다른 개선 사항을 볼 수 있습니다.
개선의 정도는 숨겨진 그리기 작업의 복잡성과 수에 따라 다릅니다.
iOS 시작 시간 지연 줄이기
앱 번들에서 식별자 검색의 비효율적 전략은 앱 시작 시간 지연을 증가시킵니다. 이 시작 시간 지연은 앱의 크기에 비례하여 증가합니다.
이번 릴리스에서 번들 식별자 검색을 수정하여, 대형 프로덕션 앱에서 시작 시간 지연을 30–50% 즉 100ms 줄일 수 있었습니다.
크기 줄이기
Flutter는 텍스트 shaping, layout 및 rendering을 위한 기본 라이브러리로 SkParagraph을 사용합니다.
이번 릴리스에서 libtxt와 minikin 라이브러리로 fallback 할 수 있는 플래그를 추가했습니다. SkParagraph에 대해 완전한 신뢰를 가지고 있기 때문에, 이번 릴리스에서 libtxt와 minikin 및 그들의 플래그를 제거했습니다.
이로 인해 Flutter의 압축 크기가 30KB 감소했습니다.
안정성
3.0 릴리스에서, rendering pipeline에서 Android 기능을 늦게 활성화했습니다. 이 Android 기능은 고급 GPU 드라이버 기능을 사용했습니다.
이 드라이버 기능은 하나의 “dirty” 영역이 변경될 때 화면의 일부만 다시 그리도록합니다.
벤치마크 결과는 고무적이었으나, 두 가지 문제가 발생했습니다.
첫째, 가장 개선된 벤치마크가 실제 사용 사례를 대표하지 않을 수 있습니다.
둘째, 이 GPU 드라이버 기능을 지원하는 디바이스 및 Android 버전의 집합이 찾기 어렵습니다.
제한된 개선과 지원을 고려하여, Android에서 부분적인 재그리기 기능을 비활성화했습니다.
이 기능은 Skia backend를 사용하는 iOS에서는 활성화된 상태로 유지됩니다. 추후 릴리스에서 Impeller와 함께 이를 활성화할 것으로 기대하고 있습니다.
APNG 디코더
이제 APNG 이미지를 디코딩할 수 있게 됩니다.
Flutter의 기존 이미지 로딩 API를 사용하여 APNG 이미지를 로드할 수 있습니다.
이미지 로딩 API 개선
Flutter의 존경 받는 엔지니어링 디렉터인 tvolkert 는 dart:ui의 이미지 로딩 API를 개선했습니다.
instantiateImageCodecWithSize라는 새로운 메서드를 추가했습니다.
이는 로드 시 알 수 없는 측면 비율, 경계 상자 제한 및 원래 측면 비율 제한이 있는 이미지를 로드하는 경우를 지원합니다.
예를 들어, 앱에서 네트워크에서 로드된 여러 이미지 중 하나를 표시하려고 할 때 해당 사항이 적용됩니다.
iOS
무선 디버깅
이제 케이블 없이 Flutter iOS 앱을 실행하고 핫 리로드할 수 있습니다!
Xcode에서 iOS 기기를 무선으로 페어링 한 후,
flutter run을 사용하여 해당 기기에 앱을 배포할 수 있습니다.
문제가 발생하면 Window > Devices 및 Simulators > Devices에서 기기 옆에 네트워크 아이콘이 나타나는지 확인하세요.
자세한 내용은 문서를 참조하세요.
와이드 감마 이미지 지원
iOS에서 Flutter 앱은 이제 와이드 감마 이미지에 대한 정확한 렌더링을 지원할 수 있습니다.
와이드 감마 지원을 사용하려면 앱은 Impeller를 사용해야 하며, Info.plist 파일에서 FLTEnableWideGamut플래그를 추가해야합니다.
스펠 체크 지원
SpellCheckConfiguration() 위젯은 이제 iOS에서 기본적으로 애플의 스펠 체크 서비스를 지원합니다.
이 위젯을 사용하려면 CupertinoTextField의 spellCheckConfiguration 매개 변수를 설정하세요.
적응형 체크박스 및 라디오
이번 릴리스에서는 Cupertino 라이브러리에 CupertinoCheckBox와 CupertinoRadio 위젯이 추가되었습니다.
이 위젯들은 애플의 스타일과 일치하는 체크박스 및 라디오 버튼 컴포넌트를 만듭니다.
Material 체크박스 및 라디오 위젯은 .adaptive 생성자를 추가했습니다.
iOS 및 macOS에서는 해당하는 Cupertino 위젯을 사용합니다.
다른 플랫폼에서는 Material 위젯을 사용합니다.
Cupertino 애니메이션, 전환 및 색상의 개선
Flutter 3.10은 SwiftUI와 일치하도록 일부 애니메이션, 전환 및 색상을 개선했습니다. 이러한 개선 사항은 다음과 같습니다.
CupertinoPageRoute전환을 업데이트합니다.CupertinoSliverNavigationBar에 타이틀 확대 애니메이션을 추가합니다.CupertinoColors에 새로운 iOS 시스템 색상을 추가합니다.
PlatformView 성능
화면에 PlatformViews 이 나타날 때,
Flutter는 iOS에서 간헐적인 끊김을 줄이기 위해 새로고침 속도를 조절합니다(참조).
앱 사용자는 애니메이션 또는 스크롤 가능한 PlatformViews 을 표시할 때 이를 알아차릴 수 있습니다.
macOS와 iOS는 플러그인에서 공유 코드를 사용할 수 있습니다.
Flutter는 이제 플러그인의 pubspec.yaml 파일에서 sharedDarwinSource키를 지원합니다.
이 키는 Flutter가 iOS 및 macOS 코드를 공유해야 함을 나타냅니다.
ios:
pluginClass: PathProviderPlugin
dartPluginClass: PathProviderFoundation
sharedDarwinSource: true
macos:
pluginClass: PathProviderPlugin
dartPluginClass: PathProviderFoundation
sharedDarwinSource: true앱 확장을 위한 새로운 리소스
우리는 iOS 앱 확장을 사용할 수 있는 Flutter 개발자를 위한 문서를 추가했습니다.
이 확장은 라이브 액티비티, 홈 스크린 위젯, 공유 확장을 포함합니다.
홈 스크린 위젯과 데이터 공유를 간소화하기 위해, 새로운 메서드를 path_provider 및 homescreen_widget 플러그인에 추가했습니다.
크로스 플랫폼 디자인을 위한 새로운 리소스
문서에는 이제 특정 UI 구성 요소에 대한 크로스 플랫폼 디자인 고려 사항이 포함되어 있습니다.
이러한 UI 구성 요소에 대해 자세히 알아보려면, Flutter UX GitHub 저장소의 토론을 확인하세요.
안드로이드
안드로이드 CameraX 지원
Camera X는 Jetpack 라이브러리로, 안드로이드 앱에 풍부한 카메라 기능을 간소화합니다.
이 기능은 다양한 안드로이드 카메라 하드웨어에서 적용됩니다.
이번 릴리스에서는 Flutter Camera 플러그인에 CameraX의 초기 지원을 추가했습니다. 이 지원은 다음 사용 사례를 다룹니다:
- 이미지 캡처
- 비디오 녹화
- 라이브 카메라 미리보기 표시
이를 시도해 보려면, CameraX 구현을 사용하도록 옵트인하세요.
옵트인하려면 다음 줄을 pubspec.yaml 파일에 추가하세요.
Dependencies:
camera: ^0.10.4 # Latest camera version
camera_android_camerax: ^0.5.0DevTools
Dart와 Flutter를 위한 성능 및 디버깅 도구인 DevTools를 계속 개선하고 있습니다.
- DevTools UI는 Material 3을 사용합니다.
이는 모던한 룩을 갖추고 접근성을 향상시킵니다. - DevTools 콘솔은 디버그 모드에서 실행 중인 앱에 대한 평가를 지원합니다. 이전 릴리스에서는 앱을 일시 중지 할 때만이 가능했습니다.
- 내장 된 Perfetto trace viewer가 이전 타임 라인 trace viewer를 대체합니다.
Perfetto는 대형 데이터 세트를 처리하고 이전의 trace viewer보다 더 나은 성능을 발휘합니다. Perfetto에는 다음과 같은 기능이 더 있습니다.
- 관심 스레드를 고정 할 수 있습니다.
- 여러 프레임에서 여러 타임 라인 이벤트를 선택하기 위해 클릭 및 드래그를 사용합니다.
- SQL 쿼리를 사용하여 타임 라인 이벤트에서 특정 데이터를 추출합니다.
Deprecated 및 중단 변경 사항
Deprecated API
이 릴리스에서의 중단 변경 사항에는 v3.7 릴리스 이후 만료 된 Deprecated 된 API가 포함됩니다.
영향을 받는 모든 API와 추가 컨텍스트 및 이전 버전 지침을 보려면 이 릴리스의 Deprecated 가이드를 확인하십시오.
Dart Fix 는 IDE에서 빠른 수정 및 dart fix 명령을 사용하여 대량 적용을 포함하여 이러한 문제를 해결 할 수 있습니다.
Android Studio Flamingo 업그레이드
Android Studio를 Flamingo로 업그레이드하면 Flutter Android 앱을 flutter run 또는 flutter build하려고 할 때 오류가 발생할 수 있습니다.
Android Studio Flamingo는 묶인 Java SDK를 11에서 17로 업데이트하기 때문에이 오류가 발생합니다. Java 17을 사용할 때 7.3보다 높은 Gradle 버전은 실행할 수 없습니다.
이 오류가 Java SDK와 Gradle 버전 간의 호환성 문제로 인한 것인지 여부를 확인하기 위해 flutter analyze --suggestions 를 업데이트했습니다.
이 오류를 수정하는 다양한 방법을 알아 보려면 마이그레이션 가이드를 확인하십시오.
Window 싱글톤 폐지
이번 릴리스에서는 창 싱글톤이 폐지되었습니다.
이를 사용하는 앱 및 라이브러리는 폐지해야합니다.
