27/11/2025
১০টি ফ্লাটার টিপস: যা একজন বিগিনারকে প্রফেশনাল বানিয়ে দেয় 🚀
অনেক সময় দেখবেন অ্যাপ দেখতে বেশ চকচকে, কোডও হয়তো ঠিকঠাক রান করছে—তবুও ব্যবহারের সময় কেমন যেন একটা "সস্তা" ভাব (Cheap feel) থেকে যায়। স্ক্রল করলে মনে হয় আটকে যাচ্ছে, কিংবা এক ট্যাব থেকে অন্য ট্যাবে গেলে পেজ আবার নতুন করে লোড হচ্ছে।
ডিবাগার আপনাকে হয়তো ফিসফিস করে বলছে, "ভাই, তুমি তো পুরো ব্রহ্মাণ্ড আবার রিবিল্ড করছো!" কিন্তু আমরা সেটা খেয়াল করি না।
সত্যি বলতে, এই ছোট ছোট বিষয়গুলোই একজন বিগিনার এবং একজন প্রফেশনাল ডেভেলপারের মধ্যে পার্থক্য গড়ে দেয়। প্রফেশনালরা কোনো জাদুর কাঠি দিয়ে অ্যাপ বানায় না; তারা শুধু কিছু "বোরিং" কিন্তু অত্যন্ত শক্তিশালী নিয়ম মেনে চলে।
আজ এমন ১০টি প্র্যাকটিক্যাল টিপস শেয়ার করছি, যা আপনার অ্যাপকে শুধু ফাস্টই করবে না, ব্যবহারকারীকে দেবে এক প্রিমিয়াম অভিজ্ঞতা।
👇 টিপসগুলো একবার দেখে নিন:
১. ভারী কাজ মেইন থ্রেডে নয় (Isolates): বিশাল কোনো JSON ফাইল পার্স বা ভারী ক্যালকুলেশন মেইন UI থ্রেডে করবেন না। এতে অ্যাপ জমে (Freeze) যায়। compute() বা Isolate ব্যবহার করে কাজটা ব্যাকগ্রাউন্ডে পাঠান। আপনার অ্যাপ মাখনের মতো চলবে।
২. লিস্ট অপ্টিমাইজেশন: লিস্ট ভিউ ল্যাগ করার জন্য ফ্লাটার দায়ী নয়, দায়ী আমাদের কোড। যদি সম্ভব হয় itemExtent ফিক্স করে দিন। ফ্লাটারকে আগেই জানিয়ে দিন প্রতিটি আইটেমের সাইজ কত, তাহলে তাকে আর কষ্ট করে বারবার মাপজোখ করতে হবে না।
৩. অপ্রয়োজনীয় রি-পেইন্ট বন্ধ করুন: স্ক্রিনে হয়তো শুধু একটা ছোট লোডিং বার ঘুরছে, কিন্তু তার জন্য পুরো পেজ রি-পেইন্ট হচ্ছে! যে উইজেটটি ঘন ঘন আপডেট হয়, তাকে RepaintBoundary দিয়ে মুড়িয়ে দিন।
৪. ছবির সাইজ ঠিক রাখুন: থাম্বনেইলের জন্য (৬০x৬০) সাইজের জায়গায় বিশাল 4K ইমেজ লোড করবেন না। cacheWidth/Height ব্যবহার করে মেমরি বাঁচান। এটি র্যামের ওপর চাপ কমায়।
৫. SVG ক্যাশ করুন: SVG দেখতে সুন্দর, কিন্তু ফ্লাটারের জন্য এটি রেন্ডার করা একটু কঠিন। তাই অ্যাপ লোড হওয়ার সময়ই precachePicture দিয়ে এটি লোড করে রাখুন।
৬. স্মার্ট রিবিল্ড (Fine-Grained Rebuilds): শপিং কার্টে একটা আইটেম বাড়লে পুরো শপ পেজ কেন রিবিল্ড হবে? Selector বা ValueListenableBuilder ব্যবহার করে শুধুমাত্র নির্দিষ্ট টেক্সটটুকু আপডেট করুন।
৭. Intrinsic উইজেট এড়িয়ে চলুন: IntrinsicHeight বা IntrinsicWidth ব্যবহার করা মানে ফ্লাটারকে দিয়ে ডাবল খাটাশ খাটানো। লেআউট ক্যালকুলেশন দুইবার হয়। এর বদলে SizedBox বা Expanded ব্যবহার করার চেষ্টা করুন।
৮. অ্যানিমেশন টিপস: অ্যানিমেশন চলার সময় পুরো উইজেট ট্রি যেন রিবিল্ড না হয়। AnimatedBuilder-এ child প্রপার্টি ব্যবহার করে স্ট্যাটিক অংশগুলো আলাদা রাখুন।
৯. সার্ভারকে রেহাই দিন (Debounce): সার্চ বারে প্রতিটা অক্ষর টাইপ করার সাথে সাথে API কল পাঠাবেন না। Debounce ব্যবহার করুন, যাতে ইউজার টাইপ করা থামালে কেবল তখনই রিকোয়েস্ট যায়।
১০. ট্যাব বাঁচিয়ে রাখুন: এক ট্যাব থেকে অন্য ট্যাবে গিয়ে ফিরে আসলে যদি দেখেন পেজ রিলোড হচ্ছে—এটা খুব বাজে ইউজার এক্সপেরিয়েন্স। AutomaticKeepAliveClientMixin ব্যবহার করে পেজটিকে জীবিত রাখুন।
💡 শেষ কথা:
অন্ধের মতো কোড করবেন না। DevTools ব্যবহার করে দেখুন কোথায় ল্যাগ হচ্ছে। বিশ্বাস করুন, এই ১০টির মধ্যে মাত্র ৩টিও যদি আপনি ঠিকঠাক অ্যাপ্লাই করেন, আপনার অ্যাপের কোয়ালিটি রাতারাতি বদলে যাবে। অ্যাপ তখন আর 'ল্যাগি' মনে হবে না, মনে হবে 'এক্সপেনসিভ'।
আপনার প্রোজেক্টে এর কয়টি আপনি মেনে চলেন? কমেন্টে জানাতে পারেন।
💙