, October 02, 2022

0 kết quả được tìm thấy

Flutter 2.8 có gì mới?

  • Đăng bởi  Chau Le
  •  Dec 22, 2021

  •   24 min reads
Flutter 2.8 có gì mới?

Chào mừng bạn đến với Flutter 2.8!

Ở bản phát hành này, sẽ có những cập nhật nổi bật sau:

  • Cải tiến về hiệu năng.
  • Cập nhật và bổ sung các tính năng mới cho Firebase.
  • WebView 3.0.
  • Nâng cấp Dev Tools.

Mới đây, bản cập nhật mới nhất cho Flutter vừa được công bố với một số tính năng và cải tiến mới giúp cải thiện trải nghiệm cho các mobile và web developer, đồng thời cũng sẽ hỗ trợ ổn định hơn dành cho desktop. Hãy cùng nhau tìm hiểu xem bản phát hành này có gì hay ho nhé.

Hiệu năng

Đối với Flutter, ưu số 1 luôn là chất lượng hoạt động của ứng dụng vì họ muốn đem đến trải nghiệm tuyệt vời nhất cho người dùng. Đội ngũ phát triển đã dành nhiều thời gian để đảm bảo rằng Flutter chạy trơn tru và mạnh mẽ nhất có thể trên nhiều loại thiết bị được hỗ trợ.

App Startup

Bản phát hành này bao gồm các cải tiến đối với vấn đề khởi động ứng dụng (App Startup) bị chậm. Nhóm phát triển Flutter đã thử nghiệm những cải tiến này dựa trên Google Pay, một ứng dụng lớn phổ biến với hơn 1 triệu dòng code để đảm bảo rằng những thay đổi sẽ có tác động hiệu quả với một ứng dụng đang chạy thực tế. Tất cả những cải tiến này kết hợp với nhau đã giúp giảm 50% vấn đề khởi động chậm cho Google Pay khi chạy trên thiết bị Android cấp thấp và cải thiện 10% trên các thiết bị cao cấp.

Trong các bản phát hành trước, Flutter đã chặn platform thread trong việc tạo ra platform views. Sau khi thử nghiệm cẩn thận, Flutter đã xác định được những thứ không cần thiết và loại bỏ chúng (tham khảo thêm thông tin ở link này: https://github.com/flutter/flutter/issues/91711), giúp cho quá trình khởi động Google Pay nhanh hơn trên thiết bị cấp thấp.

Trước đây, việc thiết lập font manager mặc định đã giới thiệu về artificial delay khi thiết lập Dart Isolate đầu tiên. Việc trì hoãn thiết lập font manager mặc định và chạy đồng thời với thiết lập Dart Isolate sẽ khắc phục được vấn đề khởi động chậm của ứng dụng.

Memory

Đối tượng mục tiêu mà các Flutter developer nhắm đến là những thiết bị hạn chế bộ nhớ đã gặp sự cố khi taking performance do Flutter đang tải "service isolate" của Dart VM. Đối với Android trong bản phát hành 2.8 này, service isolate của Dart VM được tách thành gói riêng để có thể tải riêng về, giúp tiết kiệm bộ nhớ lên đến 40 MB cho đến khi cần service isolate. Dung lượng bộ nhớ đã được giảm thêm tới 10% bởi Dart VM thông báo cho OS rằng các page trong bộ nhớ được chương trình AOT sử dụng sẽ được sao lưu bởi một tệp có khả năng không cần phát sinh mới mà tái sử dụng lại. Do đó, các page đã giữ bản sao của dữ liệu được sao lưu bằng tệp sau đó có thể được tái sử dụng cho các mục đích khác.

Profiling

Đôi khi các developer muốn xem performance trace từ ​​Flutter cùng với các dữ liệu tracing event từ native Android. Hơn nữa, họ thường muốn xem các trace event ngay cả trong các release mode build để hiểu rõ hơn về các vấn đề performance trong các ứng dụng đã triển khai của họ. Vì vậy, bản phát hành stable 2.8 hiện sẽ gửi các tracing event tới Android systrace recorder nếu nó được bật khi khởi động ứng dụng và những event này được gửi ngay cả khi ứng dụng Flutter được build ở release mode.

Các Flutter tracing event hiện được hiển thị (dưới cùng) trong công cụ Android systrace recording

Ngoài ra, để giúp cho Animation ít jank hơn, một số bạn muốn có thêm thông tin trong performance trace về các hoạt động trong raster cache - nơi mà Flutter xử lý các bước phức tạp để thực hiện Animation, được tái sử dụng thay vì phải vẽ lại chúng trên mỗi frame. Bạn có thể tham khảo thêm về New flow event trong performance trace vì giờ đây nó đã cho phép bạn theo dõi lifetime của các hình ảnh được lưu trong bộ nhớ cache raster.

Flutter DevTools

Để debug các vấn đề về performance, bản phát hành DevTools này bổ sung thêm tính năng “Enhance Tracing” mới để giúp bạn chẩn đoán lỗi giao diện người dùng bắt nguồn từ đâu, thông qua các hoạt động Flutter thực hiện để hiện UI bao gồm: expensive build, layout và paint.

Khi bất kỳ tính năng tracing nào được bật, timeline sẽ chứa các thông tin bao gồm: các event mới được record lại khi các widget được build hoặc rebuild, thông tin các render object được bố trí, được paint trên màn hình.

Ngoài ra, bản phát hành DevTools này bổ sung thêm tính năng xem profiling performance khi khởi động ứng dụng của bạn. Cấu hình này chứa các mẫu CPU từ khi Dart VM được khởi chạy cho đến khi frame đầu tiên của Flutter được hiển thị. Sau khi bạn nhấn nút “Profile app start up” và startup profile ứng dụng sẽ được tải lên, lúc đó bạn sẽ thấy user tag “AppStartUp” được chọn trong profile. Bạn cũng có thể tải startup profile ứng dụng bằng cách chọn bộ lọc user tag này.

Web platform views

Android và iOS không phải là những nền tảng duy nhất được cải thiện về hiệu năng. Bản phát hành này cũng cải thiện hiệu năng của các platform views cho web Flutter. Nếu bạn vẫn chưa biết về các view này, chúng là cách mà Flutter cho phép bạn host các native UI component từ các underlying platform trong ứng dụng của bạn. Flutter Web thực hiện điều này với HtmlElementView widget, cho phép bạn host các HTML element bên trong ứng dụng web Flutter của mình. Nếu bạn đang sử dụng các phiên bản web của google_maps_flutter plugin hoặc video_player plugin hoặc bạn đang làm theo chỉ dẫn của team Flutter về cách tối ưu hóa hình ảnh hiển thị trên web, thì mình tin chắc rằng bạn đã sử dụng qua các platform view này rồi.

Trong các phiên bản trước của Flutter, việc nhúng platform view ngay lập tức tạo ra một canvas mới và mỗi view sẽ là một canvas khác. Việc tạo thêm các canvas rất tốn kém, vì mỗi canvas có kích thước bằng toàn bộ window. Bản phát hành này sử dụng lại các canvas được tạo cho platform view trước đó. Vì vậy, thay vì phải chịu chi phí khá lớn, bạn sẽ chỉ còn tốn một lần tạo duy nhất trong suốt thời gian ứng dụng hoạt động. Điều này có nghĩa là bạn có thể có nhiều phiên bản HtmlElementView trong các ứng dụng web của mình mà không làm giảm hiệu suất, đồng thời giảm scrolling jank (giật lag khi scroll) khi các view nền tảng được sử dụng.

Ecosystem

Flutter không chỉ là framework, engine hoặc tool mà Flutter còn có hơn 20.000 package và plugin tương thích với Flutter đang hoạt động trên pub.dev cùngvới nhiều thứ khác được bổ sung mỗi ngày. Chưa kể còn có thêm một lượng tài nguyên to lớn mà các Flutter developer tương tác hàng ngày.Vì vậy hãy cùng xem những gì đang diễn ra trong hệ sinh thái Flutter kể từ bản phát hành trước.

GA của Flutter Ads

Đầu tiên và quan trọng nhất là việc phát hành Mobile SDK của Google giúp cho Flutter dễ ứng dụng chúng vào nhiều mục đích hơn vào tháng 11.

Google Mobile Ads SDK for Flutter

Bản phát hành này hỗ trợ 5 định dạng ad, tích hợp hỗ trợ cả AdMob và Ad Manager và bao gồm bản beta của mediation feature mới để giúp bạn tối ưu hóa hiệu suất quảng cáo. Để biết thêm thông tin về việc tích hợp Google Ads vào ứng dụng Flutter của bạn cũng như các monetization option khác, hãy xem monetization page mới trên Flutter.dev.

WebView 3.0

Một bản phát hành mới khác đi kèm với Flutter lần này là bản phát hành 3.0 của plugin webview_flutter . Flutter đã bổ sung rất nhiều tính năng mới. Tuy nhiên những thay đổi này có khả năng breaking change cách thức hoạt động của web hiển thị trên Android. Trong các phiên bản trước của webview_flutter, chế độ hybrid composition đã có sẵn nhưng không phải là chế độ mặc định. Hybrid composition khắc phục một số vấn đề mà chế độ hiển thị ảo (virtual display) mặc định trước đây mắc phải. Dựa trên phản hồi của người dùng và theo dõi vấn đề, đội ngũ phát triển Flutter nghĩ rằng đã đến lúc hybrid composition trở thành chế độ mặc định. Ngoài ra, webview_flutter cũng bổ sung một số tính năng được yêu cầu cao:

  • Hỗ trợ phương thức POST cũng như GET để hiển thị nội dung (4450, 4479, 4480, 4573)
  • Loading HTML từ các file và String (4446, 4486, 4544, 4558)
  • Transparent background support (3431, 4569, 4570)
  • Write prior cookie trước khi tải nội dung (4555, 4556, 4557)

Hơn nữa, trong bản phát hành mới này, webview_flutter cung cấp hỗ trợ sơ bộ cho một nền tảng mới, đó là web. Team Flutter đã nhận rất nhiều yêu cầu về khả năng host chế độ xem web trong ứng dụng web Flutter, cho phép tạo ứng dụng dành cho thiết bị di động hoặc web từ một code base duy nhất.

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:webview_flutter_web/webview_flutter_web.dart';

void main() {
  runApp(const MaterialApp(home: HomePage()));
}

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  void initState() {
    super.initState();

    // required while web support is in preview
    if (kIsWeb) WebView.platform = WebWebViewPlatform();
  }

  @override
  Widget build(BuildContext context) => Scaffold(
        appBar: AppBar(title: const Text('Flutter WebView example')),
        body: const WebView(initialUrl: 'https://flutter.dev'),
      );
}

Khi chạy trên web, nó sẽ hoạt động như bạn mong đợi:

Hãy lưu ý rằng việc triển khai webview_flutter hiện tại cho web có một số hạn chế. Vì trong thực tế nó được xây dựng bằng iframe, chỉ hỗ trợ tải URL đơn giản và không có khả năng kiểm soát hoặc tương tác với nội dung đã tải (để biết thêm thông tin, hãy xem webview_flutter_web README).

Tuy nhiên, Flutter cũng đang cung cấp webview_flutter_web do nhu cầu phổ biến sử dụng. Nếu bạn muốn dùng thử, hãy thêm dòng sau vào pubspec.yaml của bạn:

dependencies:
  webview_flutter: ^3.0.0
  webview_flutter_web: ^0.1.0 # add unendorsed plugin explicitly

Flutter Favorites

Flutter Ecosystem Committee đã họp lại để định ra những package sau là Flutter Favorite package:

Ứng dụng Flexfold được build với flex_color_scheme

Các package dành riêng cho nền tảng (Platform-specific Packages)

Nếu bạn là package author, bạn phải đưa ra quyết định là bạn sẽ hỗ trợ nền tảng nào. Nếu bạn đang tạo một plugin dành riêng cho nền tảng mà bạn hướng tới, bạn có thể làm điều đó bằng cách sử dụng pluginClass property trong pubspec.yaml:

flutter:
  plugin:
    platforms:
      android:
        package: com.example.hello
        pluginClass: HelloPlugin
      ios:
        pluginClass: HelloPlugin

Tuy nhiên, khi Dart FFI trở nên hoàn thiện hơn, bạn hoàn toàn có thể triển khai chức năng dành riêng cho nền tảng bạn mong muốn chỉ bằng ngôn ngữ Dart, giống như path_provider_windows package bằng cách sử dụng dartPluginClass property để thay thế:

flutter:
  plugin:
    implements: hello
    platforms:
      windows:
        dartPluginClass: HelloPluginWindows

Như vậy, bạn đã chỉ định rõ package của mình chỉ hỗ trợ một số nền tảng nhất định ngay cả khi bạn không có bất kỳ native code nào. Bạn có thể tìm hiểu thêm trong các tài liệu trên flutter.dev.

Firebase

Một phần lớn khác của hệ sinh thái Flutter là FlutterFire. Bản phát hành này bổ sung một loạt các tính năng mới giúp tạo ứng dụng dễ dàng hơn bằng Flutter và Firebase:

  • Tất cả các plugin FlutterFire đang chuyển từ giai đoạn beta sang phiên bản stable.
  • Giờ đây, bạn có thể sử dụng DartPad để "test" cách sử dụng Firebase.
  • Thêm một bộ UI mới hỗ trợ bạn trong việc quản lý xác thực người dùng và query dữ liệu trực tiếp.
  • Firestore Object/Document Mapping mới cho Flutter, có sẵn trong phiên bản Alpha.

Production Quality

Các FlutterFire plugin đã (gần như) chuyển từ bản beta sang stable.

Các plugin chuyển sang stable cho Android, iOS và web bao gồm Analytics, Dynamic Links, In-App Messaging, Performance Monitoring, Realtime Database, Remote ConfigInstallations. Plugin App Check và support macOS platform vẫn đang trong giai đoạn thử nghiệm do bản thân các thư viện Firebase cũng đang trong giai đoạn thử nghiệm.

Khởi tạo Firebase trên bất kỳ các nền tảng

Flutter đã thêm khả năng khởi chạy Firebase trên bất kỳ nền tảng nào được hỗ trợ từ ngôn ngữ Dart:

import 'package:firebase_core/firebase_core.dart';
import 'firebase_options.dart'; // generated via `flutterfire` CLI

Future<void> main() async {
  // initialize firebase across all supported platforms
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);

  runApp(MyApp());
}

Code dưới dây khởi chạy ứng dụng Firebase bằng cách sử dụng các tùy chọn thích hợp cho từng nền tảng như được xác định trong file firebase_options.dart, file này chứa cấu trúc dữ liệu của mỗi nền tảng trông giống như sau:

static const FirebaseOptions web = FirebaseOptions(
  apiKey: 'AIzaSyCZFKryCEiKhD0JMPeq_weJguspf09h7Cg',
  appId: '1:111079797892:web:b9195888086158195ffed1',
  messagingSenderId: '111079797892',
  projectId: 'flutterfire-fun',
  authDomain: 'flutterfire-fun.firebaseapp.com',
  storageBucket: 'flutterfire-fun.appspot.com',
  measurementId: 'G-K029Y6KJDX',
);

Để thu thập dữ liệu theo từng nền tảng, hãy tham khảo công cụ flutterfire CLI mới.

Công cụ này đào sâu vào dữ liệu có trong các thư mục con dành riêng cho nền tảng của bạn để tìm bundle ID và sau đó sử dụng ID đó để tra cứu các chi tiết cụ thể của dự án Firebase cho các ứng dụng dành riêng cho nền tảng phù hợp của bạn. Điều này có nghĩa là bạn không cần tải xuống và thêm tệp json vào dự án Android của bạn, tải xuống và thêm tệp plist vào các dự án iOS và macOS của bạn hoặc dán code vào index.html của dự án web của bạn - bất kể nền tảng nào bạn sử dụng được Firebase hỗ trợ nào mà bạn đang nhắm tới, đoạn single Dart code này sẽ khởi chạy Firebase cho ứng dụng của bạn.

Lưu ý rằng đây chỉ là phần kết nối ứng dụng của bạn với Flutter. Nếu bạn xài thêm các chức năng khác hơi riêng biệt kiểu như Crashlytics thì bạn phải thêm 1 số cấu hình riêng nữa để sử đụng được chức năng này.

Sử dụng Firebase với DartPad

Với việc khởi tạo FlutterFire bằng ngôn ngữ Dart thì giờ đây bạn có thể sử dụng Firebase từ bên trong DartPad.

Ví dụ này là một ứng dụng chat đơn giản sử dụng Flutter, Firebase và DartPad, tất cả những thứ bạn có thể sử dụng ngay bây giờ mà không cần cài đặt. Ngày nay, việc support Firebase của DartPad đã bao gồm các core API, Authentication và Firestore. Mong rằng sẽ có nhiều Firebase service hơn nữa xuất hiện trong DartPad vào thời gian tới.

Ngoài ra, bạn còn có thể bỏ các code demo FlutterFire vào DartPad rồi nhúng vào trang tài liệu của cộng đồng hoặc riêng bạn

Firebase UI

Khi bạn tích hợp Firebase vào một ứng dụng, hầu như bạn sẽ sử dụng ít nhất một hình thức hỗ trợ xác thực thông tin người dùng của Firebase . Điển hình dễ thấy bao gồm việc cho phép người dùng đăng nhập bằng email và mật khẩu hoặc với social auth provider như provider mà Google cung cấp (Gmail).

Firebase Authentication cũng cho phép tạo tài khoản mới nhanh chóng, xác thực email, đặt lại mật khẩu và thậm chí có thể xác minh 2 bước bằng SMS, đăng nhập bằng số điện thoại hoặc thậm chí hợp nhất nhiều tài khoản người dùng thành một tài khoản. Firebase Authentication hỗ trợ tất cả các chức năng trên, cái duy nhất bạn cần phải làm đó là hiển thị các nút để người dùng nhấn đăng nhập hoặc các form để điền thông tin email, password.

flutterfire_ui  giúp bạn tạo ra các UI hỗ trợ việc xác thực người dùng với một số ít code. Ví dụ: giả sử rằng bạn đã thiết lập xác thực Email và Google trong dự án Firebase của mình:

Với cấu hình này, bạn có thể kích hoạt "authentication experience" như sau:

import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutterfire_ui/auth.dart';
import 'firebase_options.dart';

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) => MaterialApp(
        home: AuthenticationGate(),
      );
}

class AuthenticationGate extends StatelessWidget {
  const AuthenticationGate({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) => StreamBuilder<User?>(
        stream: FirebaseAuth.instance.authStateChanges(),
        builder: (context, snapshot) {
          // User is not signed in - show a sign-in screen
          if (!snapshot.hasData) {
            return SignInScreen(
              providerConfigs: [
                EmailProviderConfiguration(),
                GoogleProviderConfiguration(
                  clientId: 'xxxx-xxxx.apps.googleusercontent.com',
                ),
              ],
            );
          }

          return HomePage(); // show your app’s home page after login
        },
      );
}

Thao tác này khởi chạy Firebase và nhận thấy rằng người dùng chưa đăng nhập, sẽ hiển thị màn hình đăng nhập. SigninScreen widget được định cấu hình với các authentication provider của Email và Google. Code cũng nghe theo authentication state của người dùng bằng cách sử dụng firebase_auth package. Vì vậy khi người dùng đăng nhập, bạn có thể hiển thị phần còn lại của ứng dụng. Với code này, bạn sẽ có thông tin đăng nhập hoạt động cho tất cả các nền tảng được Firebase hỗ trợ: Android, iOS, web và macOS.

Với cấu hình cao hơn một chút, bạn có thể dễ dàng thêm hình ảnh và custom text (thông tin chi tiết có sẵn trong tài liệu), mang lại cho bạn trải nghiệm đăng nhập đầy đủ tính năng:

Screenshot này hiển thị mobile version nhưng vì flutterfire_ui screens có thể responsize nên đây là những gì bạn thấy được trên desktop:

Nếu người dùng đã thực hiện việc đăng nhập, họ có thể vào thẳng màn hình Home chính luôn mà không cần phải xác thực nữa. Nếu họ sử dụng Google auth, họ sẽ được hiển thị flow thông thường của Google auth, cho dù họ đang ở trên mobile, web hay desktop. Nếu họ chưa có tài khoản, họ có thể nhấn nút trên màn hình đăng nhập và đến màn hình đăng ký.

Sau khi họ đã đăng nhập hoặc đăng ký, sẽ có các quy trình xác thực địa chỉ email, đặt lại mật khẩu, đăng xuất và liên kết các tài khoản xã hội. Đăng nhập bằng email hoạt động trên tất cả các nền tảng cùng với social auth support cho Google, Facebook và Twitter, với hỗ trợ một phần cho Apple (tính năng này không hoạt động trên Android). Authentication support trong flutterfire_ui  hỗ trợ một số scenarios và navigation scheme, cùng với các tùy chọn customization và localization. Tham khảo các tài liệu và sample chi tiết trong firebase.flutter.dev docs.

Firebase còn hỗ trợ hiển thị danh sách dữ liệu infinite scroll trực tiếp từ Firebase query, bản phát hành này bao gồm FirestoreListView, bạn có thể drop vào ứng dụng của mình bằng live query như sau:

class UserListView extends StatelessWidget {
  UserListView({Key? key}) : super(key: key);

  // live Firestore query
  final usersCollection = FirebaseFirestore.instance.collection('users');

  @override
  Widget build(BuildContext context) => Scaffold(
        appBar: AppBar(title: const Text('Contacts')),
        body: FirestoreListView<Map>(
          query: usersCollection,
          pageSize: 15,
          primary: true,
          padding: const EdgeInsets.all(8),
          itemBuilder: (context, snapshot) {
            final user = snapshot.data();

            return Column(
              children: [
                Row(
                  children: [
                    CircleAvatar(
                      child: Text((user['firstName'] ?? 'Unknown')[0]),
                    ),
                    const SizedBox(width: 8),
                    Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.center,
                      mainAxisSize: MainAxisSize.min,
                      children: [
                        Text(
                          '${user['firstName'] ?? 'unknown'} '
                          '${user['lastName'] ?? 'unknown'}',
                          style: Theme.of(context).textTheme.subtitle1,
                        ),
                        Text(
                          user['number'] ?? 'unknown',
                          style: Theme.of(context).textTheme.caption,
                        ),
                      ],
                    ),
                  ],
                ),
                const Divider(),
              ],
            );
          },
        ),
      );
}

Và nó trông giống như thế này:

Hoặc nếu bạn muốn cung cấp cho user của mình khả năng tạo, đọc, cập nhật và xóa các mục trong table, bạn chỉ cần thực hiện như sau:

class FirestoreTableStory extends StatelessWidget {
  FirestoreTableStory({Key? key}) : super(key: key);

  // live Firestore query
  final usersCollection = FirebaseFirestore.instance.collection('users');

  @override
  Widget build(BuildContext context) {
    return FirestoreDataTable(
      query: usersCollection,
      columnLabels: const {
        'firstName': Text('First name'),
        'lastName': Text('Last name'),
        'prefix': Text('Prefix'),
        'userName': Text('User name'),
        'email': Text('Email'),
        'number': Text('Phone number'),
        'streetName': Text('Street name'),
        'city': Text('City'),
        'zipCode': Text('Zip code'),
        'country': Text('Country'),
      },
    );
  }
}

Chúng sẽ hoạt động như thế này:

Để biết thêm thông tin về authentication, list views và data tables, hãy xem các tài liệu của flutterfire_ui.

Firestore Object/Document Mapping

Và cuối cùng nhưng không kém phần quan trọng, một tính năng mới để tích hợp giữa Firebase và Flutter mà bạn nên biết: bản phát hành alpha cho tính năng Firestore Object/Document Mapper. Firestore ODM nhằm mục đích giúp các Flutter developer làm việc hiệu quả hơn bằng cách đơn giản hóa việc sử dụng Firestore thông qua các khai báo biên type-safe quen thuộc, cấu trúc object và method hay dùng. Với việc sử dụng code generation, Firestore ODM hỗ trợ bạn các syntax để tương tác với document và collection bằng cách cho phép bạn lập mô hình dữ liệu của mình theo cách type-safe:

@JsonSerializable()
class Person {
  Person({required this.name, required this.age});

  final String name;
  final int age;
}

@Collection<Person>(‘/persons’)
final personsRef = PersonCollectionReference();

Với các type này, bây giờ bạn có thể thực hiện các type-safe query:

personsRef.whereName(isEqualTo: 'Bob');
personsRef.whereAge(isGreaterThan: 42);

ODM cũng hỗ trợ định nghĩa các strongly-type cho sub-collections và cung cấp các  tùy chọn tích hợp (built-in) để tối ưu hóa việc rebuild widget với select feature của nó. Bạn có thể đọc về tất cả những điều này và nhiều hơn thế nữa trong tài liệu ODM của Firestore.

Desktop

Flutter 2.8 sẽ có một bước tiến lớn khác trên con đường dẫn đến bản phát hành stable của Windows, macOS và Linux. Bản mới bao gồm internationalization support và localization support như hỗ trợ IME tiếng Trung, hỗ trợ IME tiếng Hàn và hỗ trợ Kanji IME. Hoặc như tích hợp hỗ trợ trợ năng của Windows (Windows accessibility support). Flutter hiện tại chạy trên desktop chưa đủ tốt trên stable channel vì nó chưa hỗ trợ chạy tốt cho các ngôn ngữ và nền văn hóa trên thế giới cũng như cho những người thuộc nhiều loại khác nhau.

Ví dụ cho điều này là ở bản phát hành stable sẽ tái cấu trúc hoàn chỉnh cách Flutter xử lý các keyboard event cho phép phản hồi đồng bộ (synchronous response)). Điều này cho phép một widget xử lý một lần gõ phím và hủy quá trình lan truyền của nó qua phần còn lại của tree. Hoạt động ban đầu đã có trong Flutter 2.5 (xem thêm link) và Flutter 2.8 bổ sung các bản sửa lỗi cho các vấn đề và regression khi nó đạt đến chất lượng ổn định. Đây là hoạt động liên tục để tái thiết kế cách Flutter xử lý keyboard input dành riêng cho các thiết bị riêng biệt và cơ cấu lại cách Flutter xử lý soạn thảo văn bản, tất cả đều cần thiết cho các ứng dụng desktop chuyên sâu về nhập liệu bằng bàn phím.

Ngoài ra, Flutter cũng tiếp tục mở rộng hỗ trợ cho mật độ hình ảnh và hiển thị căn chỉnh cho hộp thoại để việc kích hoạt UI thân thiện với desktop hơn.

Và cuối cùng, team Flutter không phải là những người duy nhất làm việc trên Flutter desktop. Ví dụ như desktop team tại Canonical đang làm việc với Invertase trên Linux và Windows triển khai các plugin Firebase phổ biến nhất cho Flutter.

DartPad

Flutter release sẽ không hoàn chỉnh nếu thiếu đi các cải tiến về tool. Cải tiến lớn nhất trong DartPad lần này là hỗ trợ số lượng package lớn hơn. Hiện tại DartPad đã có sẵn 23 package để import. Ngoài một số Firebase service, danh sách còn bao gồm các package phổ biến như bloc, characters, collection, google_fontsflutter_riverpod. Team DartPad tiếp tục bổ sung các package mới, vì vậy nếu bạn muốn xem các package nào hiện đang được hỗ trợ, hãy làm quen với information icon ở góc dưới bên phải.

DartPad bổ sung một tính năng mới khác cũng khá tiện dụng. Trước đây, DartPad luôn chạy trên phiên bản stable mới nhất. Nhưng với bản phát hành này, bạn đã có thể chọn các bản phát hành trên beta channel mới nhất cũng như bản phát hành stable trước đó, bằng cách sử dụng menu Channel mới trên status bar.

Điều này rất hữu ích nếu chẳng hạn như bạn đang viết một bài blog post nhưng bản stable chưa được cập nhật mới nhất…

Loại bỏ dev channel

Do hạn chế về tài nguyên, có thể thấy gần đây Flutter đã ngừng cập nhật dev channel. Qua khảo sát, đội ngũ phát triển Flutter nhận thấy có ít hơn 3% Flutter developer sử dụng dev channel. Do đó, họ đã quyết định bắt đầu quá trình để chính thức ngừng hoạt động dev channel. Mặc dù rất ít developer sử dụng dev channel, nhưng các kỹ sư Flutter phải mất nhiều thời gian và nỗ lực để duy trì nó. Vậy nên thay vì thế, đội ngũ Flutter có thể dành thời gian và năng lượng để take care những việc khác.

Bạn có thể quyết định sử dụng bất kỳ channel nào mà bạn muốn bằng cách sử dụng flutter channel command.

Khi Flutter ngừng hoạt động trên dev channel trong những tháng tới, hãy cân nhắc beta channel hoặc master channel, tùy thuộc vào nhu cầu của bạn về những thứ mới nhất và tốt nhất.

Breaking changes

Như mọi khi, Flutter sẽ cố gắng giảm số lượng các breaking change trong mỗi bản phát hành. Trong bản phát hành này, Flutter 2.8 hoàn toàn không có các breaking change nào ngoài các API không dùng nữa, đã hết hạn và bị xóa theo chính sách breaking changes của Flutter.

  • 90292 loại bỏ autovalidate không dùng nữa
  • 90293 loại bỏ FloatingHeaderSnapConfiguration.vsync không dùng nữa
  • 90294 loại bỏ AndroidViewController.id không dùng nữa
  • 90295 loại bỏ BottomNavigationBarItem.title không dùng nữa
  • 90296 loại các class định dạng text input không dùng nữa

Nếu bạn vẫn đang sử dụng các API này và muốn biết chi tiết về cách cập nhật code của mình, bạn có thể đọc migration guidance trên flay.dev.

Kết

Như vậy, có thể thấy ở bản phát hành 2.8 mới nhất này, Flutter đã có nhiều cải thiện đáng kể đối với các tính năng. Đây sẽ là một phiên bản đáng để chúng ta trải nghiệm và tìm hiểu. Hãy thử và chờ xem những phát triển mới hơn của Flutter trong tương lai nhé!

Bài viết liên quan

Flutter Tutorial 2022: Giới thiệu Flutter Travel App

Trong series này, chúng ta sẽ cùng nhau thực hiện ứng dụng Travel App với một bản UI Design vô cùng đẹp mắt, thu hút có sẵn....

Flutter Tutorial 2022: Giới thiệu Flutter Travel App
So sánh StatelessWidget và StatefulWidget

Trong bài viết này, các bạn sẽ có cái nhìn tổng quát về hai loại widget lớn nhất là StatelessWidget và StatefulWidget....

So sánh StatelessWidget và StatefulWidget
Tổng hợp các Shortcuts, Extensions & Settings trong VSCode khi lập trình Flutter

Trong bài viết này, mình sẽ liệt kê cho bạn các shortcuts, extensions, setting mà bạn nên sử dụng để lập trình Flutter hàng ngày....

Tổng hợp các Shortcuts, Extensions & Settings trong VSCode khi lập trình Flutter
[Phần 1] Những extension cần thiết khi làm việc với Flutter trên VS Code

VS Code là 1 text editor tuyệt vời được phát triển bởi Mircosoft. Đây là một trong các công cụ được developer trên toàn thế giới yêu thích vì sự tiện lợi, dễ dùng và nó chứa hàng ngàn, thậm chí trăm ngàn các extension phục vụ cho bạn trong quá trình bạn phát triển phần mềm....

[Phần 1] Những extension cần thiết khi làm việc với Flutter trên VS Code
Fix lỗi Flutter 3 không thể build app trên iOS

Cách fix lỗi Flutter 3 không thể build và run được app trên iOS với video hướng dẫn chia tiết...

Fix lỗi Flutter 3 không thể build app trên iOS
You've successfully subscribed to 200Lab Blog
Great! Next, complete checkout for full access to 200Lab Blog
Xin chào mừng bạn đã quay trở lại
OK! Tài khoản của bạn đã kích hoạt thành công.
Success! Your billing info is updated.
Billing info update failed.
Your link has expired.