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 belakang yang berbeda berdasarkan tanda Firebase Remote Config. Kita akan membahas pelacakan instrumentasi untuk memantau performa aplikasi, meluncurkan perubahan konfigurasi ke aplikasi, memantau efeknya, dan melihat cara meningkatkan performa.

Yang akan Anda pelajari

  • Cara menambahkan Firebase Performance Monitoring ke aplikasi seluler Anda untuk mendapatkan metrik siap pakai (seperti waktu mulai aplikasi dan periode lambat atau periode frozen)
  • Cara menambahkan rekaman aktivitas kustom untuk memahami jalur kode penting dari perjalanan pengguna Anda
  • Cara menggunakan dasbor Performance Monitoring untuk memahami metrik dan memantau perubahan penting seperti peluncuran fitur
  • Cara menyiapkan pemberitahuan 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 kode langsung dari GitHub.

Impor project pada 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 hilang. Kami akan memperbaikinya di bagian berikutnya.

Dalam codelab ini, Anda akan menggunakan plugin Firebase Assistant untuk mendaftarkan aplikasi Android 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/Bantuan > Periksa update untuk memastikan Anda menggunakan Android Studio dan Firebase Assistant versi terbaru.
  2. Pilih Tools > Firebase untuk membuka panel Assistant.

c0e42ef063d21eab.pngS

  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 ada). 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.pngS

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

40c24c4a56a45990.png

Menambahkan Performance Monitoring ke aplikasi Anda

Di panel Assistant di Android Studio, klik Add Performance Monitoring ke aplikasi Anda.

Anda akan melihat dialog untuk Menerima Perubahan, setelah itu Android Studio akan menyinkronkan aplikasi Anda untuk memastikan bahwa semua dependensi yang diperlukan telah ditambahkan.

3046f3e1f5fea06f.pngS

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

62e79fd18780e320.pngS

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 akan melihat file google-services.json di direktori modul (level aplikasi) aplikasi, dan aplikasi Anda sekarang akan dikompilasi. Di Android Studio, klik Run > Jalankan '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 ditampilkan:

d946cab0df319e50.pngS

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 flag seasonal_image_url. Jika URL diberikan oleh nilai konfigurasi, kami akan mendownload image 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 tersebut akan diaktifkan dan gambar yang didownload akan ditampilkan sebagai latar belakang halaman utama. Jika tidak, gambar default (yang ditampilkan di atas) akan ditampilkan.

4. Siapkan Remote Config

Setelah aplikasi berjalan, Anda dapat menyiapkan flag 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 menambahkan 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 Tambahkan baru -> Nilai bersyarat -> Buat kondisi baru.
  5. Untuk nama kondisi, masukkan Seasonal image rollout.
  6. Untuk bagian Applies if..., pilih User in random percentile <= 0%. (Anda ingin menonaktifkan fitur ini hingga Anda siap untuk meluncurkannya di langkah berikutnya.)
  7. Klik Buat condition. Anda akan menggunakan kondisi 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 sebagai string kosong. Artinya, gambar default di codebase akan ditampilkan, bukan gambar yang didownload dari URL.
  3. Klik Save.

99e6cd2ebcdced.png

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 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 untuk memantau berapa lama layar pembuka ditampilkan.

Firebase Performance Monitoring menyediakan cara untuk melakukannya. Anda dapat memanfaatkan trace kode kustom untuk memantau performa kode tertentu di aplikasi Anda – seperti waktu pemuatan untuk data dan waktu pemrosesan fitur baru Anda.

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

  1. Lakukan inisialisasi, buat, dan mulai trace kode kustom 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 pelacakan kode kustom kedua yang akan melacak waktu tambahan yang telah ditambahkan fitur Anda ke SplashScreenActivity.

  1. Lakukan inisialisasi, buat, dan mulai trace kode kustom 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 di 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 menambahkan trace kode kustom untuk melacak durasi layar pembuka (splash_screen_trace) dan waktu pemrosesan fitur baru (splash_seasonal_image_processing), jalankan kembali aplikasi di Android Studio. Anda akan melihat pesan logging yang berisi Logging trace metric: splash_screen_trace, 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 kustom 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 trace 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, Anda mungkin akhirnya memiliki URL yang berbeda untuk mendownload gambar.

Jadi, mari kita tambahkan atribut kustom yang mewakili URL gambar musiman ke trace kode kustom ini. Dengan begitu, Anda bisa 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 kustom 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 kustom (seasonal_image_url_attribute) untuk kedua rekaman aktivitas kustom (splash_screen_trace dan splash_seasonal_image_processing), jalankan aplikasi lagi di Android Studio. 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, dan itulah mengapa nilai atributnya adalah unset.

Performance Monitoring SDK akan mengumpulkan data rekaman aktivitas dan mengirimkannya ke Firebase. Anda dapat melihat data di dasbor Performance Firebase console, yang akan kami jelaskan secara mendetail di langkah berikutnya dalam codelab ini.

7. Mengonfigurasi dasbor Performance Monitoring Anda

Mengonfigurasi dasbor untuk memantau fitur

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

Di panel kiri, cari tombol Rilis & Pantau, lalu klik Performa.

Anda akan melihat dasbor Performa dengan titik data pertama pada 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 Pilih metrik yang kosong.
  2. Di jendela dialog, pilih jenis rekaman aktivitas Custom traces dan nama rekaman aktivitas splash_screen_trace.

1fb81f4dba3220e0.png

  1. Klik Select metric, dan Anda akan melihat durasi splash_screen_trace ditambahkan ke dasbor.

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

1d465c021e58da3b.pngS

Papan metrik adalah alat yang efektif untuk melacak performa metrik utama yang dialami pengguna Anda. Untuk codelab ini, Anda memiliki kumpulan data kecil dalam rentang waktu yang sempit, sehingga Anda akan menggunakan tampilan dasbor lain yang akan membantu Anda memahami performa peluncuran fitur.

8. Meluncurkan fitur

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 jika Anda yakin bahwa tidak ada masalah dengan fitur tersebut. Namun, dalam codelab ini, Anda adalah satu-satunya pengguna aplikasi 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.

70f993502b27e7a0.pngS

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

b0cc91b6e48fb842.png

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 trace. Dalam tabel ini, Anda akan melihat trace kode kustom yang Anda tambahkan sebelumnya serta beberapa trace siap pakai.
  2. Setelah mengaktifkan fitur baru, cari pelacakan kode kustom splash_seasonal_image_processing, yang mengukur waktu yang diperlukan untuk mendownload dan memproses gambar. Dari nilai Durasi rekaman aktivitas, Anda dapat melihat bahwa download dan pemrosesan ini memerlukan waktu yang cukup lama.

439adc3ec71805b7.png

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

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

7fb64d2340410576.png

  1. Untuk mengonfirmasi perbedaannya lebih lanjut, Anda dapat mempelajari lebih lanjut data untuk splash_screen_trace. Klik kartu splash_screen_trace di papan metrik, lalu klik Lihat detail metrik.

b1c275c30679062a.png

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

8fa1a69019bb045e.png

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

Dalam codelab ini, alasan durasi yang lebih lama ini mungkin mudah, tetapi dalam aplikasi sebenarnya, alasan tersebut mungkin tidak terlalu jelas. Data durasi yang dikumpulkan akan berasal dari berbagai perangkat, yang menjalankan aplikasi dalam berbagai kondisi koneksi jaringan, dan kondisi ini mungkin lebih buruk dari perkiraan Anda. Mari kita lihat bagaimana Anda akan menyelidiki masalah ini jika ini adalah situasi dunia nyata.

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

6f92ce0f23494507.png

Temuan performa

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

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

Pada langkah berikutnya, Anda akan mengurangi dampak pada performa dengan melakukan roll back fitur dan mengidentifikasi cara meningkatkan implementasi fitur tersebut.

10. Roll back fitur

Meningkatkan waktu tunggu selama layar pembuka tidak diinginkan. Salah satu manfaat utama Remote Config adalah kemampuan untuk menjeda dan membatalkan peluncuran tanpa harus merilis versi lain kepada pengguna. Hal ini memungkinkan Anda bereaksi dengan cepat terhadap masalah (seperti masalah performa yang Anda temukan di 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.

18c4f1cbac955a04.png

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 menemukan bahwa mendownload gambar untuk layar pembuka menyebabkan aplikasi melambat. Dengan melihat lebih dekat gambar yang didownload, Anda melihat bahwa Anda menggunakan resolusi asli gambar, yang berukuran lebih dari 2 MB. Satu perbaikan cepat untuk masalah kinerja Anda adalah mengurangi kualitas ke resolusi yang lebih sesuai sehingga gambar membutuhkan lebih sedikit waktu untuk diunduh.

Meluncurkan 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 Publish changes.

12. Menguji perbaikan dan menyiapkan pemberitahuan

Menjalankan aplikasi secara lokal

Dengan nilai konfigurasi baru yang ditetapkan untuk menggunakan URL gambar download yang berbeda, jalankan aplikasi lagi. Kali ini, Anda akan 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 metrik.

  1. Kali ini, Anda akan menggunakan tabel trace untuk membuka halaman detail. Di bawah tabel trace, di tab Custom traces, klik trace kustom splash_seasonal_image_processing untuk melihat kembali tampilan yang lebih mendetail tentang metrik durasinya.

2d7aaca03112c062.png

  1. Klik atribut khusus seasonal_image_url_attribute untuk melihat lagi pengelompokan atribut khusus. Jika mengarahkan kursor ke URL, Anda akan melihat nilai yang cocok dengan URL baru untuk gambar berukuran 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 dapat diterima oleh pengguna Anda.

10e30c037a4237a2.pngS

  1. Setelah meningkatkan performa layar pembuka, Anda dapat menyiapkan peringatan yang memberi tahu Anda saat pelacakan melampaui batas yang ditetapkan. Buka dasbor Performa, lalu klik ikon menu tambahan (tiga titik) untuk splash_screen_trace, lalu klik Setelan pemberitahuan.

4bd0a2a1faa14479.png

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

2bb93639e2218d1.pngS

13. Selamat!

Selamat! Anda telah mengaktifkan Firebase Performance Monitoring SDK dan mengumpulkan rekaman aktivitas untuk mengukur performa fitur baru. Anda memantau metrik performa utama untuk peluncuran fitur baru dan bereaksi dengan cepat saat ditemukan masalah performa. Semua ini dapat dilakukan 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 Remote Config dan nilai kondisional untuk mengontrol/meluncurkan fitur baru
  • Memahami cara menggunakan dasbor pemantauan performa untuk mengidentifikasi masalah selama peluncuran
  • Menyiapkan pemberitahuan performa untuk memberi tahu Anda saat performa aplikasi melampaui batas yang Anda tetapkan

Pelajari lebih lanjut