অ্যাডভান্সড ফ্লাটার অ্যাপ অপ্টিমাইজেশন

ফ্লাটার অ্যাপের পারফরম্যান্স অপ্টিমাইজেশনের আরও এডভান্সে যেতে হলে আপনাকে গভীরভাবে অ্যাপের আর্কিটেকচার, ডেটা ম্যানেজমেন্ট, স্টেট ম্যানেজমেন্ট, এবং রেন্ডারিং অপ্টিমাইজেশনের দিকে খেয়াল করতে হবে। এখানে কিছু পদ্ধতি আলোচনা করা হলো যা আপনার ফ্লাটার অ্যাপের পারফর্মেন্স বাড়াতে সাহায্য করবে।

১. FPS এবং রেন্ডারিং পারফরম্যান্স

আপনার অ্যাপের ফ্রেম পার সেকেন্ড (FPS) যদি কম হয়, তবে তা রেন্ডারিং-এর সময় ল্যাগ বা স্টাটার তৈরি করতে পারে। রেন্ডারিং সঠিকভাবে কাজ করছে কি না তা চেক করতে পারেন Performance Overlay টুল ব্যবহার করে। যদি দেখেন রেন্ডারিং লেটেন্সি হচ্ছে, তাহলে আপনার UI-কে ছোট ছোট উইজেটে ভাগ করুন, যাতে বড় এবং জটিল UI একবারে রেন্ডার না হয়।

// Performance Overlay ব্যবহার করে FPS এবং রেন্ডারিং চেক করতে
void main() {
 runApp(
 MaterialApp(
 debugShowCheckedModeBanner: false,
 home: MyApp(),
 ),
 );
}
class MyApp extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
 return Scaffold(
 appBar: AppBar(title: Text('Performance Overlay')),
 body: Center(child: Text('Check FPS and Rendering')),
 );
 }
}

flutter run --profile --trace-systrace --cache-sksl

২. শেডার কম্পাইলেশনের সমস্যা সমাধান করা

ফ্লাটারে প্রথমবার কোনো এডভান্স গ্রাফিক্যাল কিছু লোড করতে গেলে শেডার কম্পাইলেশনের কারণে অ্যাপ স্লো হয়ে যেতে পারে। এই সমস্যার সমাধানে আপনি Skia Shader Language (SKSL) ক্যাশিং ব্যবহার করতে পারেন, যা গ্রাফিক্সের শেডার কম্পাইলেশনের সময় কমিয়ে দেয় এবং অ্যাপকে ফাস্ট করে।

# Profile মোডে রান করুন এবং ক্যাশ ডাম্প করুন
flutter run --profile --cache-sksl
flutter screenshot --sksl-file=sksl.json

৩. ব্যাকগ্রাউন্ড টাস্কের জন্য ডার্ট আইসোলেটস ব্যবহার

যদি আপনার অ্যাপে বড় কোনো ডেটা প্রসেসিং বা জটিল কাজ করতে হয়, সেক্ষেত্রে আপনি Dart Isolates ব্যবহার করতে পারেন। এটি মেইন থ্রেডকে ব্যাকগ্রাউন্ড টাস্ক থেকে সেপারেট রাখে, ফলে আপনার UI আরও স্মুথ থাকে।

import 'dart:isolate';

void backgroundTask(String message) {
  print('Running in background: $message');
}

void startBackgroundTask() async {
  Isolate.spawn(backgroundTask, 'Background Task Running');
}

void main() {
  startBackgroundTask();
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Dart Isolate Example')),
        body: Center(child: Text('Check console for background task')),
      ),
    );
  }
}

৪. অ্যাসেট ম্যানেজমেন্ট

আপনার অ্যাপে যদি অনেক ইমেজ, ফন্ট বা অন্যান্য মিডিয়া ফাইল থাকে, তাহলে অ্যাসেটগুলোকে একসাথে না লোড করে ধাপে ধাপে প্রয়োজন অনুযায়ী লোড করা ভালো। এতে করে অ্যাপের মেমোরি কম ব্যবহৃত হবে এবং লোডিং টাইম কমে আসবে।

class AssetManagementExample extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Asset Management Example')),
      body: Center(
        child: Image.asset('assets/images/sample_image.png'),
      ),
    );
  }
}

৫. স্ট্রিম ও রিএক্টিভ স্টেট ম্যানেজমেন্ট অপ্টিমাইজ করা

Stream বা StreamBuilder ব্যবহারে সতর্ক থাকতে হবে। ঠিক মতো স্ট্রিম বন্ধ না করলে মেমোরি লিক হতে পারে এবং আপনার অ্যাপের পারফরম্যান্স কমে যেতে পারে।

class StreamExample extends StatefulWidget {
  @override
  _StreamExampleState createState() => _StreamExampleState();
}

class _StreamExampleState extends State<StreamExample> {
  StreamSubscription? _subscription;

  @override
  void initState() {
    super.initState();
    _subscription = Stream.periodic(Duration(seconds: 1), (i) => i).listen((data) {
      setState(() {
        print("Received: $data");
      });
    });
  }

  @override
  void dispose() {
    _subscription?.cancel(); // স্ট্রিম বন্ধ করা
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Stream Example')),
      body: Center(child: Text('Check Console for Stream Data')),
    );
  }
}

৬. স্টেট ম্যানেজমেন্ট ব্যবহার

আপনার অ্যাপে স্টেট ম্যানেজমেন্ট সিস্টেম যেমন Provider বা Riverpod ব্যবহার করতে পারেন। এর মাধ্যমে পুরো উইজেট বিল্ড না করে স্পেসিফিক উইজেট বিল্ড করাতে পারেন। স্টেট ম্যানেজমেন্ট এপ্রচ ব্যবহার করলে অ্যাপ রান টাইম এবং কোড ডুপ্লিকেশন কমে যাবে।

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

void main() {
  runApp(
    ChangeNotifierProvider(
      create: (context) => CounterModel(),
      child: MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Provider Example')),
        body: Center(child: CounterText()),
        floatingActionButton: FloatingActionButton(
          onPressed: () => context.read<CounterModel>().increment(),
          child: Icon(Icons.add),
        ),
      ),
    );
  }
}

class CounterText extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Text(
      '${context.watch<CounterModel>().counter}',
      style: TextStyle(fontSize: 24),
    );
  }
}

class CounterModel extends ChangeNotifier {
  int _counter = 0;
  int get counter => _counter;

  void increment() {
    _counter++;
    notifyListeners();
  }
}

৭. কোড স্প্লিটিং এবং লেজি লোডিং

আপনার অ্যাপের বিভিন্ন অংশের কোডকে আলাদা আলাদা কম্পোনেন্টে ভাগ করতে পারেন এবং যেখানে প্রয়োজন সেখানে লেজি লোডিং এড করার মাধ্যমে অ্যাপের মেমোরি ব্যবহার কমিয়ে আনা সম্ভব।

FutureBuilder(
  future: Future.delayed(Duration(seconds: 2), () => 'Data Loaded'),
  builder: (context, snapshot) {
    if (snapshot.connectionState == ConnectionState.waiting) {
      return CircularProgressIndicator();
    } else {
      return Text(snapshot.data.toString());
    }
  },
);

উপরের উদাহরণগুলোর মাধ্যমে আপনি আপনার ফ্লাটার অ্যাপের পারফর্মেন্স বাড়াতে পারবেন। জানার শেষ নেই। নতুন কিছু শিখতে বেশি বেশি বই পড়ুন।

বিঃদ্রঃ আর্টিকেল রাইটিং এ কিছু ক্ষেত্রে এআই এর সাহায্য নেওয়া হয়েছে।

কাভারঃ চ্যাটজিপিটি