LoginSignup
232
222

More than 5 years have passed since last update.

StethoでAndroidのNetwork Performanceを見る

Last updated at Posted at 2015-02-22

自己紹介

こんにちは @wasabeef_jp です。
あ、そういえば、2015/4/25(土)にDroidKaigiがありますね。
私も参加するので、こういう場で情報交換出来たらいいですね。

今回は、先日Facebookが公開したStethoについて紹介したいと思います。

Stetho

Stethoは、Android用のDebug Bridgeで、これを使うと
Chrome Developer Toolsの一部を利用して、Javascriptと同様にNetwork状況を確認できるツールです。

Usage

Download

まずは Stetho本体を指定します。

// Gradle dependency on Stetho
dependencies {
  compile 'com.facebook.stetho:stetho:1.0.0'
}

Network inspectionを有効にするために
OkHttpClientまたはUrlConnection用のフックライブラリも指定します。

dependencies {
  compile 'com.facebook.stetho:stetho-okhttp:1.0.0'
}

or

dependencies {
  compile 'com.facebook.stetho:stetho-urlconnection:1.0.0'
}

Setup

ProguardのShrink対象からstethoパッケージを外します。

-keep class com.facebook.stetho.** {*;}

Applicationクラスなどで、Stethoの初期化を行ないます。
DefaultのProviderを使う場合通りに以下のようにします、

public class MyApplication extends Application {
  public void onCreate() {
    super.onCreate();
    Stetho.initialize(
      Stetho.newInitializerBuilder(this)
        .enableDumpapp(Stetho.defaultDumperPluginsProvider(this))
        .enableWebKitInspector(Stetho.defaultInspectorModulesProvider(this))
        .build());
  }
}

OkHttpClientのnetworkInterceptorsに追加します。
例えば、Retrofit + Glide or Picassoなど複数でOkHttpClientを利用している場合は
それぞれのOkHttpClientインスタンスに指定しなければ正常に取得できません。

OkHttpClient client = new OkHttpClient();
client.networkInterceptors().add(new StethoInterceptor());
  • Retrofitの場合
return new RestAdapter.Builder()
  .setEndpoint("http://wasabeef.jp")
  .setClient(new OkClient(client))
  .build();
  • Glideの場合
OkHttpUrlLoader.Factory factory = new OkHttpUrlLoader.Factory(client);

// 3.4以下
Glide.get(this).register(GlideUrl.class, InputStream.class, factory);

// 3.5以上
public class MyGlideModule extends OkHttpGlideModule {
  @Override
  public void registerComponents(Context context, Glide glide) {
    glide.register(GlideUrl.class, InputStream.class, factory);
  }
}
  • Picassoの場合
Picasso picasso = new Picasso.Builder(this).downloader(new OkHttpDownloader(client)).build();
Picasso.setSingletonInstance(picasso);

カスタムダンプを利用する場合は、このように指定します。

標準のStethoが出力するデータでは、物足りない場合は、カスタムのProviderを作ります。
説明しきれないので、Sampleを確認して下さい。

Stetho.initialize(Stetho.newInitializerBuilder(context)
    .enableDumpapp(new MyDumperPluginsProvider(context))
    .build())

private static class MyDumperPluginsProvider implements DumperPluginsProvider {
  public Iterable<DumperPlugin> get() {
    ArrayList<DumperPlugin> plugins = new ArrayList<DumperPlugin>();
    for (DumperPlugin defaultPlugin : Stetho.defaultDumperPluginsProvider(mContext).get()) {
      plugins.add(defaultPlugin);
    }
    plugins.add(new MyDumperPlugin());
    return plugins;
  }
}

Features

Javascriptの開発をしてる方は、慣れ親しんだものだと思います
Chrome DevToolsで、確認していきます。

端末をPCに接続して、Chrome DevTools > inspectを起動します。
inspector-discovery.png

Networkを確認するとImage, Jsonデータは勿論で、データサイズ、レスポンス時間も確認できます。
inspector-network.png

Resourceを確認すると、例えばActiveAndroidのORMなどでSQLiteを利用している場合は
DBのデータ状況を素早く簡単に確認できます。
inspector-sqlite.png

雑感

便利すぎたので、皆様と分かち合えればと思います。
何かあれば@wasabeef_jpまで(੭ु๑•ૅω•´)੭ु⁾⁾

232
222
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
232
222