Stetho — এটি কী, Chrome DevTools-এর মাধ্যমে Android ডিবাগিং

Stetho কী এবং এটি কীভাবে কাজ করে

Stetho হল একটি Java লাইব্রেরি যা Android অ্যাপ্লিকেশনের ভেতরে একটি লোকাল WebSocket সার্ভার চালায়। Chrome DevTools adb-পোর্টের মাধ্যমে এই সার্ভারের সাথে সংযোগ করে, এবং অ্যাপের অভ্যন্তরীণ উপাদানগুলিতে প্রবেশাধিকার পায়: ডেটাবেস, নেটওয়ার্ক অনুরোধ, preferences এবং view-পদক্রম। পুরো যোগাযোগ Chrome DevTools Protocol প্রোটোকলের মাধ্যমে হয়, যা অতিরিক্ত সফ্টওয়্যার ইনস্টল না করেই ব্রাউজারের স্ট্যান্ডার্ড টুল ব্যবহার করতে দেয়।

আর্কিটেকচার এবং উপাদান

লাইব্রেরিতে মডিউল থাকে: stetho (কোর), stetho-okhttp (OkHttp-এর মাধ্যমে ট্রাফিক আটকানো), stetho-urlconnection (HttpURLConnection-এর মাধ্যমে আটকানো) এবং stetho-js-rhino (JavaScript প্লাগইনের সমর্থন)। কোর একটি UNIX-সকেট খোলে, যার সাথে Chrome adb forward-এর মাধ্যমে সংযোগ করে। প্রতিটি ইনস্পেক্টর একটি আলাদা প্লাগইন হিসেবে বাস্তবায়িত হয়, যা Stetho ইনিশিয়ালাইজেশনের সময় নিবন্ধিত হয়।

প্রয়োজনীয়তা এবং সীমাবদ্ধতা

Stetho Android 4.4+ (API 19) সমর্থন করে এবং শুধুমাত্র debug-বিল্ডে কাজ করে। Android 11+ ডিভাইসে ম্যানিফেস্টে স্পষ্ট INTERNET অনুমতি প্রয়োজন। 2020 সাল থেকে লাইব্রেরিটি Facebook-এর পক্ষ থেকে অফিসিয়ালিভাবে সমর্থিত নয়, কিন্তু কোড খোলা থাকে এবং legacy-প্রজেক্টে ব্যবহৃত হয়। নতুন প্রজেক্টের জন্য Google Android Studio Profiler এবং Network Inspector সুপারিশ করে।

Android প্রজেক্টে Stetho সংযোগ ও কনফিগারেশন

সংযোগ debugImplementation ফ্ল্যাগসহ Gradle-নির্ভরতার মাধ্যমে করা হয়, যাতে Stetho শুধুমাত্র debug-বিল্ডে কাজ করে। ইনিশিয়ালাইজেশন Application.onCreate() মেথডে একটি একক Stetho.initializeWithDefaults(this) কল দিয়ে হয়। Network Inspector-এর জন্য Interceptor-এর মাধ্যমে OkHttp-এর সাথে একীভূতকরণ প্রয়োজন।

// build.gradle (app) — Stetho যোগ করা
dependencies {
    debugImplementation 'com.facebook.stetho:stetho:1.6.0'
    debugImplementation 'com.facebook.stetho:stetho-okhttp3:1.6.0'
}

// Application ক্লাসে ইনিশিয়ালাইজেশন
public class App extends Application {
    @Override
    public void onCreate() {
        super.onCreate();
        Stetho.initializeWithDefaults(this);
    }
}

Network Interceptor কনফিগারেশন

OkHttp-এর মাধ্যমে নেটওয়ার্ক অনুরোধ আটকাতে ইন্টারসেপ্টর শৃঙ্খলে StethoInterceptor যোগ করুন। Stetho স্বয়ংক্রিয়ভাবে URL, অনুরোধ ও প্রতিক্রিয়ার হেডার, স্ট্যাটাস-কোড এবং নির্বাহের সময় লগ করে। chrome://inspect-এর মাধ্যমে ডিভাইসে সংযোগের পরে ডেটা Chrome DevTools-এর Network ট্যাবে প্রদর্শিত হয়।

Network Inspector: HTTP ট্রাফিক আটকানো

Stetho-র Network Inspector অ্যাপের সব HTTP অনুরোধ কালানুক্রমিক ক্রমে প্রদর্শন করে। প্রতিটি অনুরোধের জন্য পাওয়া যায়: পদ্ধতি, URL, স্ট্যাটাস-কোড, অনুরোধ ও প্রতিক্রিয়ার হেডার, অনুরোধ ও প্রতিক্রিয়ার বডি (JSON এবং বাইনারি ডেটাসহ)। Preview ট্যাব প্রতিক্রিয়ার বডি ফরম্যাটকৃত রূপে দেখায়।

অনুরোধ ফিল্টার ও খোঁজা

Chrome DevTools প্রকার (XHR, JS, CSS, Doc), স্ট্যাটাস-কোড এবং ডোমেইন অনুসারে অনুরোধ ফিল্টারিং সমর্থন করে। খোঁজ ক্ষেত্র URL ও বিষয়বস্তু অনুযায়ী ফিল্টার করে। মোবাইল ডেভেলপমেন্টের জন্য অনুরোধগুলিকে API ডোমেইন অনুসারে গ্রুপ করা এবং অ্যাপের স্ক্রিন পরীক্ষার সময় কলের ক্রম যাচাই করা উপকারী।

// Stetho interceptor সহ OkHttp ক্লায়েন্ট
OkHttpClient client = new OkHttpClient.Builder()
    .addNetworkInterceptor(new StethoInterceptor())
    .build();

// অনুরোধ চালানো
Request request = new Request.Builder()
    .url("https://api.example.com/users")
    .build();
client.newCall(request).enqueue(callback);

Database Inspector: SQLite নিয়ে কাজ

Stetho-র Database Inspector Chrome DevTools-এর মাধ্যমে অ্যাপের SQLite ডেটাবেসে সংযোগ করে। Resources → Web SQL ট্যাবে সব খোলা ডেটাবেস, তাদের টেবিল এবং বিষয়বস্তু প্রদর্শিত হয়। টেবিলের গঠন, ইনডেক্স দেখা এবং ইচ্ছামতো SQL-কোয়েরি চালানো যায়।

DevTools-এর মাধ্যমে SQL-কোয়েরি চালানো

Chrome DevTools কনসোলে আপনি সরাসরি অ্যাপের ডেটাবেসে SQL-কোয়েরি চালাতে পারেন: SELECT, INSERT, UPDATE, DELETE। এটি পরীক্ষার আগে ডেটা পরিষ্কার করতে, মাইগ্রেশনের সঠিকতা যাচাই করতে এবং অ্যাপ পুনর্নির্মাণ ছাড়াই ভুল রেকর্ড ম্যানুয়ালি ঠিক করতে উপকারী। সব পরিবর্তন ডিভাইসে সঙ্গে সঙ্গেই দৃশ্যমান হয়।

Dumpapp এবং কাস্টম প্লাগইন

Dumpapp হল Stetho-র শেল ইন্টারফেস, যা adb-এর মাধ্যমে কাস্টম কমান্ড চালাতে দেয়। Dumpapp প্লাগইন Stetho ইনিশিয়ালাইজেশনের সময় নিবন্ধিত হয় এবং অ্যাপের যেকোনো অবস্থা রপ্তানি করতে পারে: ক্যাশ, সেটিংস, DI-কন্টেইনারের অবস্থা। কমান্ড adb forward tcp:12345 localabstract:stetho_dumpapp আকারে চালানো হয়।

কাস্টম Dumpapp প্লাগইন তৈরি

প্লাগইন DumperContext ইন্টারফেস বাস্তবায়ন করে এবং কাস্টম InspectorModules সহ Stetho.initialize-এর মাধ্যমে নিবন্ধিত হয়। নিচের উদাহরণটি SharedPreferences ডাম্পের জন্য প্লাগইন দেখায়: ডেটা JSON-এ সিরিয়ালাইজ হয়ে adb-কমান্ডের মাধ্যমে টার্মিনালে আউটপুট হয়।

// SharedPreferences-এর জন্য কাস্টম Dumpapp প্লাগইন
public class PrefsDumper implements DumperContext {
    @Override
    public String getName() {
        return "prefs";
    }
    @Override
    public void dump(DumperContext ctx) {
        SharedPreferences sp = ctx.getContext()
            .getSharedPreferences("app_prefs", Context.MODE_PRIVATE);
        ctx.getStdout().println(sp.getAll().toString());
    }
}

Stetho বনাম Android Studio Inspector: তুলনা

Android Studio বিল্ট-ইন প্রোফাইলিং টুল প্রদান করে: Network Profiler, Database Inspector এবং View Inspector, যা Android Studio 4.1+ এ এসেছে। এই টুল আসার আগে Stetho জনপ্রিয় ছিল এবং OkHttp ব্যবহার করা ও Chrome DevTools-এর সাথে একীভূতকরণ প্রয়োজন এমন প্রজেক্টের জন্য প্রাসঙ্গিক থেকে যায়।

কখন Stetho বেছে নেবেন

Stetho legacy-প্রজেক্টে যুক্তিসঙ্গত, যেখানে OkHttp আগে থেকেই ব্যবহৃত হয় এবং দল Chrome DevTools-এ অভ্যস্ত। নতুন প্রজেক্টের জন্য Android Studio Inspector বেশিরভাগ ডিবাগিং পরিস্থিতি কভার করে। তবে, SQLite-কোয়েরির জন্য Chrome DevTools এখনও বেশি সুবিধাজনক: SQL অটোকমপ্লিশনসহ বিল্ট-ইন কনসোল IDE-তে ধারাবাহিক ক্লিকের চেয়ে দ্রুত।

Stetho-র মাধ্যমে View Hierarchy পরীক্ষা

Stetho-তে View Hierarchy Chrome DevTools-এর Elements ট্যাবে DOM-সদৃশ গাছ হিসেবে প্রদর্শিত হয়। প্রতিটি View বৈশিষ্ট্যসহ একটি HTML-এলিমেন্ট হিসেবে উপস্থাপিত হয়: id, layout_width, layout_height, padding, margin, visibility এবং টেক্সট। পর্দা ঘোরানো বা UI আপডেটের সময় গাছে পরিবর্তনগুলো রিয়েল টাইমে সিংক্রোনাইজ হয়।

বৈশিষ্ট্য দেখা ও পরিবর্তন

গাছে একটি এলিমেন্ট নির্বাচন করে, আপনি Styles প্যানেলে এর বৈশিষ্ট্য দেখতে পারেন — ওয়েব পেজ পরীক্ষার মতোই। Stetho গণনাকৃত আকার, প্যাডিং, পেছনের রং এবং অবস্থা (pressed, focused, enabled) প্রদর্শন করে। DevTools-এ কিছু বৈশিষ্ট্য পরিবর্তন সঙ্গে সঙ্গে অ্যাপে প্রযোজ্য হয়, যা পুনর্নির্মাণ ছাড়াই UI প্যারামিটার বেছে নেওয়াকে দ্রুত করে।

View Inspector-এর মাধ্যমে মেমরি লিক খোঁজা

Stetho View-সম্পর্কিত মেমরি লিক খুঁজতে সাহায্য করে: যদি Activity finish()-এর পরে ধ্বংস না হয়, তবে তার রুট View গাছে থেকে যায়। Elements ট্যাব নিয়মিত যাচাই করে আপনি ভুতুড়ে Activity লক্ষ্য করতে পারেন এবং লিকের উৎস খুঁজতে পারেন — সাধারণত Context-এর স্ট্যাটিক রেফারেন্স বা বন্ধ না হওয়া ডায়ালগ।

ব্যবহারিক ডিবাগিং কৌশল

Stetho সার্ভারে পাঠানোর আগে JSON-সিরিয়ালাইজেশন যাচাইয়ের জন্য কার্যকর। Network Inspector খুলুন, অনুরোধ খুঁজে নিন এবং ডেটার গঠন ও ফিল্ডের সঠিকতা যাচাই করতে বডি Raw-মোডে দেখুন।

SQLiteOpenHelper ডিবাগিং

Stetho SQLiteOpenHelper-এর মাধ্যমে তৈরি সব ডেটাবেস প্রদর্শন করে। যদি ডেটাবেস Chrome DevTools-এ না আসে — যাচাই করুন যে অ্যাপ কোডে getWritableDatabase() অন্তত একবার কল হয়েছে।

OkHttp-এ Interceptor-এর ক্রম

পরিবর্তিত অনুরোধ দেখতে Stetho-কে OkHttp শৃঙ্খলে শেষ interceptor হতে হবে। সঠিক ক্রম: প্রথমে AuthInterceptor, তারপর LoggingInterceptor, তারপর শেষে StethoInterceptor।

Stetho দিয়ে ব্যবহারিক ডিবাগিং কৌশল

Stetho সার্ভারে পাঠানোর আগে JSON-সিরিয়ালাইজেশনের সঠিকতা যাচাইয়ের জন্য কার্যকর। Network Inspector খুলুন, অনুরোধ খুঁজে নিন এবং ফিল্ডের গঠন ও ডেটা প্রকারের সঠিকতা নিশ্চিত করতে অনুরোধের বডি Raw-মোডে দেখুন।

SQLiteOpenHelper ও ContentProvider ডিবাগিং

Stetho SQLiteOpenHelper-এর মাধ্যমে তৈরি সব ডেটাবেস প্রদর্শন করে। যদি ডেটাবেস Chrome DevTools-এ না আসে — যাচাই করুন যে অ্যাপ কোডে getWritableDatabase() মেথড অন্তত একবার কল হয়েছে। মাইগ্রেশনের জন্য SQL কনসোল দিয়ে ALTER TABLE চালান এবং SELECT কোয়েরি দিয়ে ফলাফল যাচাই করুন।

OkHttp শৃঙ্খলে Interceptor-এর ক্রম

চূড়ান্ত পরিবর্তিত অনুরোধ প্রদর্শনের জন্য Stetho-কে OkHttp শৃঙ্খলে শেষ interceptor হতে হবে। সঠিক অনুক্রম: সঠিক লগিংয়ের জন্য AuthInterceptor প্রথমে, তারপর LoggingInterceptor, তারপর শেষে StethoInterceptor।