Performance Monitoring dalam Peluncuran Fitur

1. Ringkasan

Dalam codelab ini, Anda akan mempelajari cara memantau performa aplikasi selama peluncuran fitur. Aplikasi contoh kita akan memiliki fungsi dasar, dan disiapkan untuk menampilkan gambar latar yang berbeda berdasarkan flag Firebase Remote Config. Kita akan membahas pelacakan instrumentasi untuk memantau performa aplikasi, meluncurkan perubahan konfigurasi pada aplikasi, memantau efeknya, dan melihat bagaimana kita dapat meningkatkan performa.

Yang akan Anda pelajari

  • Cara menambahkan Firebase Performance Monitoring ke aplikasi seluler untuk mendapatkan metrik siap pakai (seperti waktu mulai aplikasi dan periode lambat atau periode frozen)
  • Cara menambahkan trace kustom untuk memahami jalur kode penting dalam perjalanan pengguna Anda
  • Cara menggunakan dasbor Performance Monitoring untuk memahami metrik dan melacak perubahan penting seperti peluncuran fitur
  • Cara menyiapkan notifikasi performa untuk memantau metrik utama
  • Cara meluncurkan perubahan Firebase Remote Config

Prasyarat

  • Android Studio 4.0 atau yang lebih baru
  • Emulator Android dengan API level 16 atau yang lebih tinggi.
  • Java versi 8 atau yang lebih baru
  • Pemahaman dasar tentang Firebase Remote Config

2. Menyiapkan project contoh

Mendownload kode

Jalankan perintah berikut untuk meng-clone kode contoh untuk codelab ini. Tindakan ini akan membuat folder bernama codelab-perf-rc-android di komputer Anda:

$ git clone https://github.com/FirebaseExtended/codelab-feature-rollout-performance.git

Jika tidak memiliki Git di komputer, Anda juga dapat mendownload kodenya langsung dari GitHub.

Impor project di folder firebase-perf-rc-android-start ke Android Studio. Anda mungkin akan melihat beberapa pengecualian runtime atau mungkin peringatan tentang file google-services.json yang tidak ada. Kami akan memperbaikinya di bagian berikutnya.

Dalam codelab ini, Anda akan menggunakan plugin Firebase Assistant untuk mendaftarkan aplikasi Android Anda ke project Firebase dan menambahkan file konfigurasi, plugin, serta dependensi Firebase yang diperlukan ke project Android Anda — semuanya dari dalam Android Studio.

Menghubungkan aplikasi ke Firebase

  1. Buka Android Studio/Help > Check for updates untuk memastikan Anda menggunakan Android Studio dan Firebase Assistant versi terbaru.
  2. Pilih Tools > Firebase untuk membuka panel Assistant.

c0e42ef063d21eab.png

  1. Pilih Performance Monitoring untuk ditambahkan ke aplikasi Anda, lalu klik Mulai menggunakan Performance Monitoring.
  2. Klik Connect to Firebase untuk menghubungkan project Android Anda dengan Firebase (tindakan ini akan membuka Firebase console di browser Anda).
  3. Di Firebase console, klik Tambahkan project, lalu masukkan nama project Firebase (jika sudah memiliki project Firebase, Anda dapat memilih project yang sudah ada tersebut). Klik Continue dan setujui persyaratan untuk membuat project Firebase dan Aplikasi Firebase baru.

Selanjutnya Anda akan melihat dialog untuk Menghubungkan Aplikasi Firebase baru ke project Android Studio Anda.

51a549ebde2fe57a.png

  1. Klik Hubungkan.
  2. Buka Android Studio. Di panel Assistant, Anda akan melihat konfirmasi bahwa aplikasi telah terhubung ke Firebase.

40c24c4a56a45990.png

Menambahkan Performance Monitoring ke aplikasi Anda

Di panel Assistant di Android Studio, klik Add Performance Monitoring to your app.

Anda akan melihat dialog Accept Changes setelah Android Studio harus menyinkronkan aplikasi untuk memastikan bahwa semua dependensi yang diperlukan telah ditambahkan.

3046f3e1f5fea06f.pngS

Terakhir, Anda akan melihat pesan berhasil di panel Assistant di Android Studio bahwa semua dependensi disiapkan dengan benar.

62e79fd18780e320.png

Sebagai langkah tambahan, aktifkan logging debug dengan mengikuti petunjuk pada langkah "(Opsional) Aktifkan logging debug". Petunjuk yang sama juga tersedia di dokumentasi publik.

3. Menjalankan aplikasi

Sekarang Anda seharusnya melihat file google-services.json di direktori modul (level aplikasi) aplikasi Anda, dan aplikasi Anda sekarang seharusnya sudah terkompilasi. Di Android Studio, klik Run > Run 'app' untuk membuat dan menjalankan aplikasi di emulator Android Anda.

Saat aplikasi berjalan, Anda akan melihat layar pembuka seperti ini terlebih dahulu:

ffbd413a6983b205.png

Kemudian, setelah beberapa detik, halaman utama dengan gambar default akan menampilkan:

d946cab0df319e50.png

Apa yang terjadi di balik layar?

Layar pembuka diterapkan di SplashScreenActivity dan melakukan hal berikut:

  1. Pada onCreate(), kita melakukan inisialisasi setelan Firebase Remote Config dan mengambil nilai konfigurasi yang akan Anda tetapkan di dasbor Remote Config nanti dalam codelab ini.
  2. Di executeTasksBasedOnRC(), kita membaca nilai konfigurasi dari flag seasonal_image_url. Jika URL disediakan oleh nilai konfigurasi, kita akan mendownload gambar secara sinkron.
  3. Setelah download selesai, aplikasi akan membuka MainActivity dan memanggil finish() untuk mengakhiri SplashScreenActivity.

Di MainActivity, jika seasonal_image_url ditentukan melalui Remote Config, fitur ini akan diaktifkan dan gambar yang didownload akan ditampilkan sebagai latar belakang halaman utama. Jika tidak, gambar default (ditampilkan di atas) akan ditampilkan.

4. Siapkan Remote Config

Setelah aplikasi berjalan, Anda dapat menyiapkan tombol fitur baru.

  1. Di panel kiri Firebase console, cari bagian Engage, lalu klik Remote Config.
  2. Klik tombol Create configuration untuk membuka formulir konfigurasi dan tambahkan seasonal_image_url sebagai kunci parameter.
  3. Klik Tambahkan deskripsi, lalu masukkan deskripsi ini: Shows a seasonal image (replaces default) in the main page when the restaurant list is empty.
  4. Klik Add new -> Nilai kondisional -> Buat kondisi baru.
  5. Untuk nama kondisi, masukkan Seasonal image rollout.
  6. Untuk bagian Applies if..., pilih User in random percentile <= 0%. (Anda ingin tetap menonaktifkan fitur ini hingga siap untuk meluncurkan pada langkah berikutnya.)
  7. Klik Buat condition. Anda akan menggunakan ketentuan ini nanti untuk meluncurkan fitur baru kepada pengguna.

7a07526eb9e81623.png

  1. Buka Buat formulir parameter pertama Anda, lalu cari kolom Nilai untuk Peluncuran gambar musiman. Masukkan URL tempat gambar musiman akan didownload: https://images.unsplash.com/photo-1552691021-7043334e0b51
  2. Biarkan nilai default berupa string kosong. Artinya, gambar default dalam codebase akan ditampilkan, bukan gambar yang didownload dari URL.
  3. Klik Save.

99e6cd2ebcdced.pngS

Anda dapat melihat bahwa konfigurasi baru dibuat sebagai draf.

  1. Klik Publish changes dan konfirmasi perubahan di bagian atas untuk mengupdate aplikasi Anda.

39cd3e96d370c7ce.pngS

5. Menambahkan pemantauan untuk waktu pemuatan data

Aplikasi Anda memuat beberapa data terlebih dahulu sebelum menampilkan MainActivity dan menampilkan layar pembuka untuk menyembunyikan proses ini. Anda tidak ingin pengguna menunggu terlalu lama di layar ini, jadi biasanya ada baiknya memantau berapa lama layar pembuka akan ditampilkan.

Firebase Performance Monitoring menyediakan cara untuk melakukan semua hal tersebut. Anda dapat menggunakan trace kode kustom untuk memantau performa kode tertentu di aplikasi Anda – seperti waktu pemuatan data dan waktu pemrosesan fitur baru Anda.

Untuk melacak berapa lama layar pembuka akan ditampilkan, Anda harus menambahkan trace kode kustom ke SplashScreenActivity, yaitu Activity yang menerapkan layar pembuka.

  1. Lakukan inisialisasi, buat, dan mulai trace kode kustom yang bernama splash_screen_trace:

SplashScreenActivity.java

// ...
import com.google.firebase.perf.FirebasePerformance;
import com.google.firebase.perf.metrics.Trace;
// ...

public class SplashScreenActivity extends AppCompatActivity {

    private static final String TAG = "SplashScreenActivity";
    private static final String SEASONAL_IMAGE_URL_RC_FLAG = "seasonal_image_url";

    // TODO: Initialize splash_screen_trace
    private final Trace splashScreenTrace = FirebasePerformance.startTrace("splash_screen_trace");
    
    // ...
}
  1. Akhiri rekaman aktivitas dalam metode onDestroy() dari SplashScreenActivity:

SplashScreenActivity.java

@Override
protected void onDestroy() {
    super.onDestroy();

    // TODO: Stop the splash_screen_trace here
    splashScreenTrace.stop();
}

Karena fitur baru Anda mendownload dan memproses gambar, Anda akan menambahkan trace kode kustom kedua yang akan melacak waktu tambahan yang ditambahkan fitur Anda ke SplashScreenActivity.

  1. Lakukan inisialisasi, buat, dan mulai trace kode kustom yang bernama splash_seasonal_image_processing:

SplashScreenActivity.java

private void executeTasksBasedOnRC(FirebaseRemoteConfig rcConfig) {
    String seasonalImageUrl = rcConfig.getString(SEASONAL_IMAGE_URL_RC_FLAG);
    Log.d(TAG, SEASONAL_IMAGE_URL_RC_FLAG + ": " + seasonalImageUrl);

    if (!seasonalImageUrl.isEmpty()) {
        // TODO: Start the splash_seasonal_image_processing here
        final Trace seasonalImageProcessingTrace = FirebasePerformance
            .startTrace("splash_seasonal_image_processing");

        // ...
    }
}
  1. Akhiri rekaman aktivitas dalam metode onLoadFailed() dan onResourceReady() dari RequestListener:

SplashScreenActivity.java

Glide.with(SplashScreenActivity.this.getApplicationContext())
    .asBitmap()
    .load(seasonalImageUrl)
    .signature(new ObjectKey(Utils.getCacheUUID()))
    .listener(new RequestListener<Bitmap>() {
        @Override
        public boolean onLoadFailed(
            @Nullable GlideException e,
            Object model, Target<Bitmap> target,
            boolean isFirstResource) {

            // TODO: Stop the splash_seasonal_image_processing here
            seasonalImageProcessingTrace.stop();

            launchMainActivity();
            return true;
        }

        @Override
        public boolean onResourceReady(Bitmap resource, Object model,
            Target<Bitmap> target, DataSource dataSource,
            boolean isFirstResource) {

            // TODO: Stop the splash_seasonal_image_processing here
            seasonalImageProcessingTrace.stop();

            launchMainActivity();
            return true;
        }
     })
     .preload();

Setelah Anda menambahkan trace kode kustom untuk melacak durasi layar pembuka (splash_screen_trace) dan waktu pemrosesan fitur baru (splash_seasonal_image_processing), jalankan aplikasi di Android Studio lagi. Anda akan melihat pesan logging yang berisi Logging trace metric: splash_screen_trace, yang diikuti dengan durasi rekaman aktivitas. Anda tidak akan melihat pesan log untuk splash_seasonal_image_processing karena Anda belum mengaktifkan fitur baru.

6. Menambahkan atribut khusus ke rekaman aktivitas

Untuk trace kode kustom, Performance Monitoring otomatis mencatat atribut default (metadata umum seperti versi aplikasi, negara, perangkat, dll.) ke dalam log sehingga Anda dapat memfilter data untuk trace tersebut di Firebase console. Anda juga dapat menambahkan dan memantau atribut khusus.

Di aplikasi, Anda baru saja menambahkan dua trace kode kustom untuk memantau durasi layar pembuka dan waktu pemrosesan fitur baru. Faktor yang mungkin memengaruhi durasi ini adalah apakah gambar yang ditampilkan adalah gambar default atau apakah gambar harus didownload dari URL. Dan siapa tahu – pada akhirnya Anda mungkin memiliki URL yang berbeda tempat Anda mendownload gambar.

Jadi, mari kita tambahkan atribut khusus yang mewakili URL gambar musiman ke trace kode kustom ini. Dengan demikian, Anda dapat memfilter data durasi berdasarkan nilai ini nanti.

  1. Tambahkan atribut khusus (seasonal_image_url_attribute) untuk splash_screen_trace di awal metode executeTasksBasedOnRC:

SplashScreenActivity.java

private void executeTasksBasedOnRC(FirebaseRemoteConfig rcConfig) {
    String seasonalImageUrl = rcConfig.getString(SEASONAL_IMAGE_URL_RC_FLAG);
    Log.d(TAG, SEASONAL_IMAGE_URL_RC_FLAG + ": " + seasonalImageUrl);

    // TODO: Add a custom attribute "seasonal_image_url_attribute" to splash_screen_trace
    if (seasonalImageUrl.isEmpty()) {
        splashScreenTrace.putAttribute("seasonal_image_url_attribute", "unset");
    } else {
        splashScreenTrace.putAttribute("seasonal_image_url_attribute", seasonalImageUrl);
    }

    // ...
}
  1. Tambahkan atribut khusus yang sama untuk splash_seasonal_image_processing tepat setelah panggilan startTrace("splash_seasonal_image_processing"):

SplashScreenActivity.java

if (!seasonalImageUrl.isEmpty()) {
    // TODO: Start the splash_seasonal_image_processing here
    final Trace seasonalImageProcessingTrace = FirebasePerformance
        .startTrace("splash_seasonal_image_processing");

    // TODO: Add a custom attribute "seasonal_image_url_attribute" to splash_seasonal_image_processing
    seasonalImageProcessingTrace
        .putAttribute("seasonal_image_url_attribute", seasonalImageUrl);

    // ...
}

Setelah menambahkan atribut khusus (seasonal_image_url_attribute) untuk kedua trace kustom (splash_screen_trace dan splash_seasonal_image_processing), jalankan aplikasi di Android Studio lagi. Anda akan melihat pesan logging yang berisi Setting attribute 'seasonal_image_url_attribute' to 'unset' on trace 'splash_screen_trace'.. Anda belum mengaktifkan parameter Remote Config seasonalImageUrl. Itulah sebabnya nilai atribut ini adalah unset.

Performance Monitoring SDK akan mengumpulkan data trace dan mengirimkannya ke Firebase. Anda dapat melihat data tersebut di dasbor Performance di Firebase console, yang akan kami jelaskan secara mendetail pada langkah codelab berikutnya.

7. Mengonfigurasi dasbor Performance Monitoring Anda

Mengonfigurasi dasbor untuk memantau fitur

Di Firebase console, pilih project yang memiliki aplikasi Friendly Eats.

Di panel kiri, cari bagian Release & Monitor, lalu klik Performance.

Anda akan melihat dasbor Performa dengan titik data pertama di bagan metrik. Performance Monitoring SDK mengumpulkan data performa dari aplikasi Anda dan menampilkannya dalam hitungan menit setelah pengumpulan.

f57e5450b70034c9.png

Bagan metrik ini adalah tempat Anda dapat melacak metrik utama untuk aplikasi Anda. Tampilan default menyertakan durasi pelacakan waktu mulai aplikasi, tetapi Anda dapat menambahkan metrik yang paling penting bagi Anda. Karena Anda melacak fitur baru yang ditambahkan, Anda dapat menyesuaikan dasbor untuk menampilkan durasi trace kode kustom splash_screen_trace.

  1. Klik salah satu kotak Select a metric yang kosong.
  2. Di jendela dialog, pilih jenis trace Custom trace dan nama trace splash_screen_trace.

1fb81f4dba3220e0.pngS

  1. Klik Pilih metrik, dan Anda akan melihat durasi splash_screen_trace ditambahkan ke dasbor.

Anda dapat menggunakan langkah-langkah yang sama untuk menambahkan metrik lain yang penting bagi Anda sehingga dapat dengan cepat melihat perubahan performanya dari waktu ke waktu dan bahkan dengan rilis yang berbeda.

1d465c021e58da3b.png

Bagan metrik adalah alat canggih untuk melacak performa metrik utama yang dialami oleh pengguna Anda. Untuk codelab ini, Anda memiliki set data kecil dalam rentang waktu yang terbatas, jadi Anda akan menggunakan tampilan dasbor lain yang akan membantu Anda memahami performa peluncuran fitur.

8. Luncurkan fitur Anda

Setelah menyiapkan pemantauan, Anda siap meluncurkan perubahan Firebase Remote Config (seasonal_image_url) yang Anda siapkan sebelumnya.

Untuk meluncurkan perubahan, Anda akan kembali ke halaman Remote Config di Firebase console untuk meningkatkan persentil pengguna kondisi penargetan Anda. Biasanya, Anda akan meluncurkan fitur baru kepada sebagian kecil pengguna dan meningkatkannya hanya ketika Anda yakin bahwa tidak ada masalah dengan fitur tersebut. Namun, dalam codelab ini, Anda adalah satu-satunya pengguna aplikasi tersebut, sehingga Anda dapat mengubah persentil menjadi 100%.

  1. Klik tab Kondisi di bagian atas halaman.
  2. Klik kondisi Seasonal image rollout yang Anda tambahkan sebelumnya.
  3. Ubah persentil menjadi 100%.
  4. Klik Simpan kondisi.
  5. Klik Publikasikan perubahan dan konfirmasi perubahan tersebut.

70f993502b27e7a0.png

Kembali ke Android Studio, mulai ulang aplikasi di emulator untuk melihat fitur baru. Setelah layar pembuka, Anda akan melihat layar utama status kosong yang baru.

b0cc91b6e48fb842.pngS

9. Memeriksa perubahan performa

Sekarang mari kita lihat performa pemuatan layar pembuka menggunakan dasbor Performance di Firebase console. Pada langkah codelab ini, Anda akan menggunakan berbagai bagian dasbor untuk melihat data performa.

  1. Di tab Dashboard utama, scroll ke bawah ke tabel trace, lalu klik tab Custom traces. Dalam tabel ini, Anda akan melihat trace kode kustom yang Anda tambahkan sebelumnya serta beberapa trace siap pakai.
  2. Setelah Anda mengaktifkan fitur baru ini, cari trace kode kustom splash_seasonal_image_processing, yang mengukur waktu yang diperlukan untuk mendownload dan memproses gambar. Dari nilai Duration rekaman aktivitas, Anda dapat melihat bahwa download dan pemrosesan ini memerlukan waktu yang cukup lama.

439adc3ec71805b7.pngS

  1. Karena Anda memiliki data untuk splash_seasonal_image_processing, Anda dapat menambahkan durasi trace ini ke bagan metrik di bagian atas tab Dasbor.

Serupa dengan sebelumnya, klik salah satu kotak Select a metric yang kosong. Di jendela dialog, pilih jenis trace Custom trace dan nama trace splash_seasonal_image_processing. Terakhir, klik Pilih metrik untuk menambahkan metrik ini ke bagan metrik.

7fb64d2340410576.png

  1. Untuk mengonfirmasi perbedaan lebih lanjut, Anda dapat melihat lebih dekat data untuk splash_screen_trace. Klik kartu splash_screen_trace di bagan metrik, lalu klik Lihat detail metrik.

b1c275c30679062a.png

  1. Di halaman detail, Anda akan melihat daftar atribut di kiri bawah, termasuk atribut khusus yang Anda buat sebelumnya. Klik atribut khusus seasonal_image_url_attribute untuk melihat durasi layar pembuka untuk setiap URL gambar musiman di sebelah kanan:

8fa1a69019bb045e.pngS

  1. Nilai durasi layar pembuka Anda mungkin akan sedikit berbeda dengan yang ada di screenshot di atas, tetapi Anda akan memiliki durasi yang lebih lama ketika gambar didownload dari URL dibandingkan menggunakan gambar default (ditunjukkan dengan "unset").

Dalam codelab ini, alasan durasi yang lebih lama ini mungkin mudah dipahami, tetapi dalam aplikasi yang sebenarnya, hal ini mungkin tidak terlalu jelas. Data durasi yang dikumpulkan akan berasal dari perangkat yang berbeda, menjalankan aplikasi dalam berbagai kondisi koneksi jaringan, dan kondisi ini bisa lebih buruk dari yang Anda harapkan. Mari kita lihat bagaimana Anda akan menyelidiki masalah ini jika terjadi di dunia nyata.

  1. Klik Performa di bagian atas halaman untuk kembali ke tab utama Dasbor: 640b696b79d90103.png
  2. Pada tabel trace di bagian bawah halaman, klik tab Permintaan jaringan. Dalam tabel ini, Anda akan melihat semua permintaan jaringan dari aplikasi Anda digabungkan ke dalam pola URL, termasuk pola URL images.unsplash.com/**. Jika Anda membandingkan nilai waktu respons ini dengan waktu keseluruhan yang diperlukan untuk mendownload dan memproses gambar (yaitu, durasi rekaman aktivitas splash_seasonal_image_processing), Anda dapat melihat bahwa sejumlah besar waktu dihabiskan untuk mendownload gambar.

6f92ce0f23494507.png

Temuan performa

Dengan menggunakan Firebase Performance Monitoring, Anda melihat dampak berikut pada pengguna akhir yang mengaktifkan fitur baru:

  1. Waktu yang dihabiskan di SplashScreenActivity telah meningkat.
  2. Durasi untuk splash_seasonal_image_processing sangat lama.
  3. Keterlambatan ini disebabkan oleh waktu respons untuk download gambar dan waktu pemrosesan yang sesuai yang diperlukan untuk gambar.

Pada langkah berikutnya, Anda akan mengurangi dampaknya terhadap performa dengan melakukan roll back fitur dan mengidentifikasi cara meningkatkan penerapan fitur tersebut.

10. Roll back fitur

Meningkatkan waktu tunggu pengguna selama layar pembuka tidak diinginkan. Salah satu manfaat utama Remote Config adalah kemampuannya untuk menjeda dan membalikkan peluncuran tanpa harus merilis versi lain kepada pengguna. Hal ini memungkinkan Anda menanggapi masalah dengan cepat (seperti masalah performa yang ditemukan pada langkah terakhir) dan meminimalkan jumlah pengguna yang tidak puas.

Sebagai mitigasi cepat, Anda akan mereset persentil peluncuran kembali ke 0, sehingga semua pengguna akan melihat gambar default lagi:

  1. Kembali ke halaman Remote Config di Firebase console.
  2. Klik Kondisi di bagian atas halaman.
  3. Klik kondisi Seasonal image rollout yang Anda tambahkan sebelumnya.
  4. Ubah persentil menjadi 0%.
  5. Klik Simpan kondisi.
  6. Klik Publikasikan perubahan dan konfirmasi perubahan tersebut.

18c4f1cbac955a04.pngS

Mulai ulang aplikasi di Android Studio, dan Anda akan melihat layar utama status kosong yang asli:

d946cab0df319e50.png

11. Memperbaiki masalah performa

Sebelumnya di codelab, Anda telah menemukan bahwa mendownload gambar untuk layar pembuka menyebabkan pelambatan aplikasi Anda. Setelah memperhatikan gambar yang didownload, Anda akan melihat bahwa Anda menggunakan resolusi asli gambar, yaitu lebih dari 2 MB. Satu perbaikan cepat untuk masalah performa adalah mengurangi kualitas ke resolusi yang lebih sesuai sehingga gambar membutuhkan waktu lebih sedikit untuk didownload.

Luncurkan kembali nilai Remote Config

  1. Kembali ke halaman Remote Config di Firebase console.
  2. Klik ikon Edit untuk parameter seasonal_image_url.
  3. Perbarui Nilai untuk peluncuran gambar Musiman menjadi https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640, lalu klik Simpan.

828dd1951a2ec4a4.png

  1. Klik tab Kondisi di bagian atas halaman.
  2. Klik Peluncuran gambar musiman, lalu tetapkan persentil kembali ke 100%.
  3. Klik Simpan kondisi.

1974fa3bb789f36c.pngS

  1. Klik tombol Publikasikan perubahan.

12. Menguji perbaikan dan menyiapkan pemberitahuan

Menjalankan aplikasi secara lokal

Dengan nilai konfigurasi baru yang ditetapkan untuk menggunakan URL gambar download yang berbeda, jalankan lagi aplikasi. Kali ini, Anda harus melihat bahwa waktu yang dihabiskan di layar pembuka lebih singkat daripada sebelumnya.

b0cc91b6e48fb842.pngS

Melihat performa perubahan

Kembali ke dasbor Performance di Firebase console untuk melihat tampilan metriknya.

  1. Kali ini, Anda akan menggunakan tabel trace untuk membuka halaman detail. Di tabel trace, di tab Trace kustom, klik trace kustom splash_seasonal_image_processing untuk melihat tampilan metrik durasi yang lebih mendetail.

2d7aaca03112c062.pngs

  1. Klik atribut khusus seasonal_image_url_attribute untuk melihat lagi perincian atribut khusus tersebut. Jika mengarahkan kursor ke URL, Anda akan melihat nilai yang cocok dengan URL baru untuk gambar berukuran yang lebih kecil: https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640 (dengan ?w=640 di bagian akhir). Nilai durasi yang terkait dengan gambar ini jauh lebih pendek daripada nilai untuk gambar sebelumnya dan lebih sesuai bagi pengguna Anda!

10e30c037a4237a2.png

  1. Setelah meningkatkan performa layar pembuka, Anda dapat menyiapkan pemberitahuan untuk memberi tahu Anda saat trace melebihi batas yang telah ditetapkan. Buka dasbor Performance dan klik ikon menu tambahan (tiga titik) untuk splash_screen_trace, lalu klik Alert settings.

4bd0a2a1faa14479.png

  1. Klik tombol untuk mengaktifkan pemberitahuan Durasi. Tetapkan nilai minimum sedikit di atas nilai yang Anda lihat, sehingga jika splash_screen_trace melebihi nilai minimum tersebut, Anda akan menerima email.
  1. Klik Simpan untuk membuat pemberitahuan. Scroll ke bawah ke tabel trace, lalu klik tab Trace kustom untuk melihat bahwa pemberitahuan Anda diaktifkan.

2bb93639e2218d1.pngS

13. Selamat!

Selamat! Anda telah mengaktifkan Firebase Performance Monitoring SDK dan mengumpulkan trace untuk mengukur performa fitur baru. Anda telah memantau metrik performa utama untuk peluncuran fitur baru dan bereaksi dengan cepat saat masalah performa ditemukan. Ini semua dimungkinkan dengan kemampuan untuk membuat perubahan konfigurasi dengan Remote Config dan memantau masalah performa secara real time.

Yang telah kita bahas

  • Menambahkan Firebase Performance Monitoring SDK ke aplikasi Anda
  • Menambahkan trace kode kustom ke kode Anda untuk mengukur fitur tertentu
  • Menyiapkan parameter dan value kondisional Remote Config untuk mengontrol/meluncurkan fitur baru
  • Memahami cara menggunakan dasbor pemantauan performa untuk mengidentifikasi masalah selama peluncuran
  • Menyiapkan notifikasi performa untuk memberi tahu Anda saat performa aplikasi melampaui batas yang telah Anda tetapkan

Pelajari lebih lanjut