Pemantauan Kinerja Peluncuran Fitur

1. Ikhtisar

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

Apa yang akan Anda pelajari

  • Cara menambahkan Firebase Performance Monitoring ke aplikasi seluler Anda untuk mendapatkan metrik yang unik (seperti waktu mulai aplikasi dan frame yang lambat atau terhenti)
  • Cara menambahkan pelacakan khusus untuk memahami jalur kode penting perjalanan pengguna Anda
  • Cara menggunakan dasbor Performance Monitoring untuk memahami metrik Anda dan melacak perubahan penting seperti peluncuran fitur
  • Cara menyiapkan pemberitahuan kinerja untuk memantau metrik utama Anda
  • Cara meluncurkan perubahan Firebase Remote Config

Prasyarat

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

2. Siapkan proyek sampel

Unduh kodenya

Jalankan perintah berikut untuk mengkloning kode contoh untuk codelab ini. Ini akan membuat folder bernama codelab-perf-rc-android di mesin Anda:

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

Jika Anda tidak memiliki Git di mesin Anda, Anda juga dapat mengunduh kodenya langsung dari GitHub.

Impor proyek di bawah folder firebase-perf-rc-android-start ke Android Studio. Anda mungkin akan melihat beberapa pengecualian waktu proses atau mungkin peringatan tentang file google-services.json yang hilang. Kami akan memperbaikinya di bagian selanjutnya.

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

Hubungkan aplikasi Anda ke Firebase

  1. Buka Android Studio / Bantuan > Periksa pembaruan untuk memastikan Anda menggunakan Android Studio dan Firebase Assistant versi terbaru.
  2. Pilih Alat > Firebase untuk membuka panel Asisten .

c0e42ef063d21eab.png

  1. Pilih Performance Monitoring untuk ditambahkan ke aplikasi Anda, lalu klik Mulai dengan Performance Monitoring .
  2. Klik Hubungkan ke Firebase untuk menghubungkan proyek Android Anda dengan Firebase (ini akan membuka konsol Firebase di browser Anda) .
  3. Di Firebase console, klik Tambahkan proyek , lalu masukkan nama proyek Firebase (jika Anda sudah memiliki proyek Firebase, Anda dapat memilih proyek yang sudah ada tersebut) . Klik Lanjutkan dan terima persyaratan untuk membuat proyek Firebase dan Aplikasi Firebase baru.

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

51a549ebde2fe57a.png

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

40c24c4a56a45990.png

Tambahkan Pemantauan Kinerja ke aplikasi Anda

Di panel Asisten di Android Studio, klik Tambahkan Performance Monitoring ke aplikasi Anda .

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

3046f3e1f5fea06f.png

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

62e79fd18780e320.png

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

3. Jalankan aplikasinya

Anda sekarang akan melihat file google-services.json di direktori modul (tingkat aplikasi) aplikasi Anda, dan aplikasi Anda sekarang harus dikompilasi. Di Android Studio, klik Jalankan > Jalankan 'aplikasi' untuk membangun dan menjalankan aplikasi di emulator Android Anda.

Saat aplikasi sedang berjalan, pertama-tama Anda akan melihat layar splash seperti ini:

ffbd413a6983b205.png

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

d946cab0df319e50.png

Apa yang terjadi di balik terpal?

Layar splash diimplementasikan di SplashScreenActivity dan melakukan hal berikut:

  1. Di onCreate() , kami menginisialisasi setelan Firebase Remote Config dan mengambil nilai konfigurasi yang akan Anda tetapkan di dasbor Remote Config nanti dalam codelab ini.
  2. Dalam executeTasksBasedOnRC() , kita membaca nilai konfigurasi dari seasonal_image_url . Jika URL disediakan oleh nilai konfigurasi, kami mengunduh gambar secara sinkron.
  3. Setelah pengunduhan selesai, aplikasi menavigasi ke MainActivity dan memanggil finish() untuk mengakhiri SplashScreenActivity .

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

4. Siapkan Konfigurasi Jarak Jauh

Sekarang setelah aplikasi Anda berjalan, Anda dapat menyiapkan tanda fitur baru.

  1. Di panel kiri Firebase console , cari bagian Engage , lalu klik Remote Config .
  2. Klik tombol Buat konfigurasi untuk membuka formulir konfigurasi dan 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 Tambah 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 membiarkan fitur ini dinonaktifkan hingga Anda siap meluncurkannya di langkah selanjutnya.)
  7. Klik Buat kondisi . Anda akan menggunakan ketentuan ini nanti untuk meluncurkan fitur baru kepada pengguna Anda.

7a07526eb9e81623.png

  1. Buka formulir Buat parameter pertama Anda dan temukan bidang peluncuran gambar Nilai untuk Musiman . Masukkan URL tempat gambar musiman akan diunduh: https://images.unsplash.com/photo-1552691021-7043334e0b51
  2. Biarkan nilai default sebagai string kosong. Artinya, gambar default di basis kode akan ditampilkan, bukan gambar yang diunduh dari URL.
  3. Klik Simpan .

99e6cd2ebcdced.png

Anda dapat melihat bahwa konfigurasi baru dibuat sebagai draf.

  1. Klik Publikasikan perubahan dan konfirmasikan perubahan di bagian atas untuk memperbarui aplikasi Anda.

39cd3e96d370c7ce.png

5. Tambahkan 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 Anda menunggu terlalu lama di layar ini, jadi biasanya akan bermanfaat untuk memantau berapa lama layar splash ditampilkan.

Firebase Performance Monitoring menyediakan cara untuk melakukan hal tersebut. Anda dapat melengkapi pelacakan kode khusus untuk memantau performa kode tertentu di aplikasi Anda – seperti waktu pemuatan data dan waktu pemrosesan fitur baru.

Untuk melacak berapa lama layar pembuka ditampilkan, Anda akan menambahkan jejak kode khusus ke SplashScreenActivity , yang merupakan Activity yang mengimplementasikan layar pembuka.

  1. Inisialisasi, buat, dan mulai pelacakan kode khusus 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 pelacakan dalam metode onDestroy() pada SplashScreenActivity :

SplashScreenActivity.java

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

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

Karena fitur baru Anda mengunduh dan memproses gambar, Anda akan menambahkan jejak kode khusus kedua yang akan melacak waktu tambahan fitur Anda ditambahkan ke SplashScreenActivity .

  1. Inisialisasi, buat, dan mulai pelacakan kode khusus 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 pelacakan dalam metode onLoadFailed() dan onResourceReady() pada 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();

Kini setelah Anda menambahkan jejak kode khusus 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 pelacakan. Anda tidak akan melihat pesan log untuk splash_seasonal_image_processing karena Anda belum mengaktifkan fitur baru.

6. Tambahkan atribut khusus ke jejak

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

Di aplikasi Anda, Anda baru saja menambahkan dua jejak kode khusus untuk memantau durasi layar pembuka dan waktu pemrosesan fitur baru. Faktor yang mungkin mempengaruhi durasi ini adalah apakah gambar yang ditampilkan adalah gambar default atau apakah gambar tersebut harus diunduh dari URL. Dan siapa tahu – pada akhirnya Anda mungkin memiliki URL berbeda untuk mengunduh gambar.

Jadi, mari tambahkan atribut khusus yang mewakili URL gambar musiman ke jejak kode khusus 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 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);

    // ...
}

Kini setelah Anda menambahkan atribut khusus ( seasonal_image_url_attribute ) untuk kedua jejak khusus Anda ( splash_screen_trace dan splash_seasonal_image_processing ), jalankan kembali aplikasi 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 musimanImageUrl , itulah sebabnya nilai atributnya unset .

Performance Monitoring SDK akan mengumpulkan data pelacakan dan mengirimkannya ke Firebase. Anda dapat melihat datanya di dasbor Performa Firebase console, yang akan kami jelaskan secara detail pada langkah codelab berikutnya.

7. Konfigurasikan dasbor Pemantauan Kinerja Anda

Konfigurasikan dasbor Anda untuk memantau fitur Anda

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

Di panel kiri, cari bagian Rilis & Monitor , lalu klik Kinerja .

Anda akan melihat dasbor Kinerja dengan titik data pertama di papan metrik Anda! Performance Monitoring SDK mengumpulkan data kinerja dari aplikasi Anda dan menampilkannya dalam beberapa menit setelah pengumpulan.

f57e5450b70034c9.png

Papan metrik ini adalah tempat Anda dapat melacak metrik utama untuk aplikasi Anda. Tampilan default mencakup durasi pelacakan waktu mulai aplikasi, namun Anda dapat menambahkan metrik yang paling penting bagi Anda. Karena Anda melacak fitur baru yang Anda tambahkan, Anda dapat menyesuaikan dasbor untuk menampilkan durasi pelacakan kode khusus splash_screen_trace .

  1. Klik pada salah satu kotak Pilih metrik yang kosong.
  2. Di jendela dialog, pilih jenis jejak Jejak khusus dan nama jejak splash_screen_trace .

1fb81f4dba3220e0.png

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

Anda dapat menggunakan langkah-langkah yang sama untuk menambahkan metrik lain yang Anda minati sehingga Anda dapat dengan cepat melihat bagaimana kinerjanya berubah seiring waktu dan bahkan dengan rilis yang berbeda.

1d465c021e58da3b.png

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

8. Luncurkan fitur Anda

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

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

  1. Klik tab Ketentuan 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 konfirmasikan perubahannya.

70f993502b27e7a0.png

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

b0cc91b6e48fb842.png

9. Periksa perubahan kinerja

Sekarang mari kita periksa performa pemuatan splash screen menggunakan Performance dashboard di Firebase console. Pada langkah codelab ini, Anda akan menggunakan berbagai bagian dasbor untuk melihat data performa.

  1. Pada tab Dasbor utama, gulir ke bawah ke tabel jejak, lalu klik tab Jejak khusus . Dalam tabel ini, Anda akan melihat jejak kode khusus yang Anda tambahkan sebelumnya ditambah beberapa jejak bawaan .
  2. Sekarang setelah Anda mengaktifkan fitur baru, cari jejak kode khusus splash_seasonal_image_processing , yang mengukur waktu yang diperlukan untuk mengunduh dan memproses gambar. Dari nilai Durasi pelacakan, Anda dapat melihat bahwa pengunduhan dan pemrosesan ini memerlukan banyak waktu.

439adc3ec71805b7.png

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

Mirip dengan sebelumnya, klik salah satu kotak Pilih metrik yang kosong. Di jendela dialog, pilih jenis jejak Jejak khusus dan nama jejak splash_seasonal_image_processing . Terakhir, klik Pilih metrik untuk menambahkan metrik ini ke papan metrik.

7fb64d2340410576.png

  1. Untuk mengonfirmasi lebih lanjut perbedaannya, Anda dapat melihat lebih dekat data 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 Anda buat sebelumnya. Klik atribut seasonal_image_url_attribute untuk melihat durasi layar pembuka untuk setiap URL gambar musiman di sebelah kanan:

8fa1a69019bb045e.png

  1. Nilai durasi layar splash Anda mungkin akan sedikit berbeda dari yang ada pada tangkapan layar di atas, namun Anda akan memiliki durasi yang lebih lama saat gambar diunduh dari URL dibandingkan menggunakan gambar default (diwakili oleh "tidak disetel").

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

  1. Klik Performance di bagian atas halaman untuk kembali ke tab utama Dashboard : 640b696b79d90103.png
  2. Pada tabel jejak 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 keseluruhan waktu yang diperlukan untuk mengunduh dan memproses gambar (yaitu, durasi jejak splash_seasonal_image_processing ), Anda dapat melihat bahwa banyak waktu yang dihabiskan untuk mengunduh gambar.

6f92ce0f23494507.png

Temuan kinerja

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

  1. Waktu yang dihabiskan di SplashScreenActivity telah meningkat.
  2. Durasi splash_seasonal_image_processing sangat lama.
  3. Penundaan ini disebabkan oleh waktu respons untuk pengunduhan gambar dan waktu pemrosesan terkait yang diperlukan untuk gambar tersebut.

Pada langkah berikutnya, Anda akan memitigasi dampak terhadap performa dengan mengembalikan fitur tersebut dan mengidentifikasi bagaimana Anda dapat meningkatkan penerapan fitur tersebut.

10. Kembalikan fitur tersebut

Menambah waktu tunggu pengguna selama layar splash tidak diinginkan. Salah satu manfaat utama Remote Config adalah kemampuan untuk menjeda dan membalikkan peluncuran tanpa harus merilis versi lain kepada pengguna Anda. Hal ini memungkinkan Anda bereaksi dengan cepat terhadap masalah (seperti masalah kinerja yang Anda temukan pada langkah terakhir) dan meminimalkan jumlah pengguna yang tidak puas.

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

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

18c4f1cbac955a04.png

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

d946cab0df319e50.png

11. Perbaiki masalah kinerja

Anda mengetahui sebelumnya di codelab bahwa mendownload gambar untuk layar pembuka menyebabkan pelambatan pada aplikasi Anda. Melihat lebih dekat pada gambar yang diunduh, Anda melihat bahwa Anda menggunakan resolusi asli gambar tersebut, yaitu lebih dari 2 MB! Salah satu perbaikan cepat untuk masalah kinerja Anda adalah dengan mengurangi kualitas ke resolusi yang lebih sesuai sehingga gambar memerlukan waktu lebih sedikit untuk diunduh.

Luncurkan kembali nilai Remote Config

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

828dd1951a2ec4a4.png

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

1974fa3bb789f36c.png

  1. Klik tombol Publikasikan perubahan .

12. Uji perbaikan dan atur peringatan

Jalankan aplikasi secara lokal

Dengan nilai konfigurasi baru yang ditetapkan untuk menggunakan URL gambar unduhan yang berbeda, jalankan kembali aplikasi. Kali ini, Anda akan menyadari bahwa waktu yang dihabiskan di layar splash lebih singkat dari sebelumnya.

b0cc91b6e48fb842.png

Lihat kinerja perubahannya

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

  1. Kali ini Anda akan menggunakan tabel jejak untuk menavigasi ke halaman detail. Di bawah tabel jejak, di tab Jejak khusus , klik jejak khusus splash_seasonal_image_processing untuk melihat tampilan metrik durasi yang lebih detail lagi.

2d7aaca03112c062.png

  1. Klik atribut seasonal_image_url_attribute untuk melihat pengelompokan atribut khusus lagi. Jika Anda mengarahkan kursor ke URL, Anda akan melihat nilai yang cocok dengan URL baru untuk gambar yang diperkecil: https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640 (dengan ?w=640 pada akhirnya). Nilai durasi yang terkait dengan gambar ini jauh lebih pendek dibandingkan nilai gambar sebelumnya dan lebih dapat diterima oleh pengguna Anda!

10e30c037a4237a2.png

  1. Sekarang setelah Anda meningkatkan kinerja layar pembuka, Anda dapat mengatur peringatan untuk memberi tahu Anda ketika jejak melebihi ambang batas yang Anda tetapkan. Buka dasbor Performance dan klik ikon menu luapan (tiga titik) untuk splash_screen_trace dan klik Alert settings .

4bd0a2a1faa14479.png

  1. Klik tombol untuk mengaktifkan peringatan Durasi . Tetapkan nilai ambang batas sedikit di atas nilai yang Anda lihat sehingga jika splash_screen_trace melebihi ambang batas, Anda akan menerima email.
  1. Klik Simpan untuk membuat peringatan Anda. Gulir ke bawah ke tabel jejak , lalu klik tab Jejak khusus untuk melihat bahwa lansiran Anda diaktifkan!

2bb93639e2218d1.png

13. Selamat!

Selamat! Anda mengaktifkan Firebase Performance Monitoring SDK dan mengumpulkan jejak untuk mengukur performa fitur baru! Anda memantau metrik kinerja utama untuk peluncuran fitur baru dan bereaksi dengan cepat ketika masalah kinerja ditemukan. Semua ini dimungkinkan dengan kemampuan untuk membuat perubahan konfigurasi dengan Remote Config dan memantau masalah kinerja secara real-time.

Apa yang telah kami bahas

  • Menambahkan Firebase Performance Monitoring SDK ke aplikasi Anda
  • Menambahkan jejak kode khusus ke kode Anda untuk mengukur fitur tertentu
  • Menyiapkan parameter Remote Config dan nilai kondisional untuk mengontrol/meluncurkan fitur baru
  • Memahami cara menggunakan dasbor pemantauan kinerja untuk mengidentifikasi masalah selama peluncuran
  • Menyiapkan pemberitahuan kinerja untuk memberi tahu Anda ketika kinerja aplikasi Anda melewati ambang batas yang Anda tetapkan

Belajarlah lagi