Pemantauan Kinerja Peluncuran Fitur

Tetap teratur dengan koleksi Simpan dan kategorikan konten berdasarkan preferensi Anda.

1. Ikhtisar

Dalam codelab ini, Anda akan mempelajari cara memantau kinerja aplikasi Anda selama peluncuran fitur. Aplikasi sampel kami akan memiliki fungsionalitas dasar, dan disiapkan untuk menampilkan gambar latar belakang yang berbeda berdasarkan flag Firebase Remote Config. Kami akan membahas pelacakan instrumentasi untuk memantau kinerja aplikasi, meluncurkan perubahan konfigurasi ke 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 siap pakai (seperti waktu mulai aplikasi dan frame yang lambat atau beku)
  • Cara menambahkan jejak khusus untuk memahami jalur kode penting dari perjalanan pengguna Anda
  • Cara menggunakan dasbor Performance Monitoring untuk memahami metrik Anda dan melacak perubahan penting seperti peluncuran fitur
  • Cara menyiapkan lansiran 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 sampel 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 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 Anda dengan 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 versi terbaru dan Firebase Assistant.
  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 konsol Firebase, klik Tambahkan proyek , lalu masukkan nama proyek Firebase (jika Anda sudah memiliki proyek Firebase, Anda dapat memilih proyek yang ada sebagai gantinya) . Klik Lanjutkan dan setujui 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 AndroidStudio. 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 Pemantauan Kinerja ke aplikasi Anda .

Anda akan melihat dialog untuk Menerima 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 debug logging dengan mengikuti petunjuk di langkah "(Opsional) Aktifkan debug logging". Instruksi yang sama juga tersedia dalam dokumentasi publik .

3. Jalankan aplikasi

Anda sekarang akan melihat file google-services.json di direktori modul (level 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 bawah tenda?

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 di codelab ini.
  2. Dalam executeTasksBasedOnRC() , kita membaca nilai konfigurasi dari flag seasonal_image_url . Jika URL disediakan oleh nilai konfigurasi, kami mengunduh gambar secara sinkron.
  3. Setelah unduhan selesai, aplikasi menavigasi ke MainActivity dan memanggil finish() untuk mengakhiri SplashScreenActivity .

Di MainActivity , jika 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 (ditunjukkan di atas) akan ditampilkan.

4. Atur Remote Config

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

  1. Di panel kiri Firebase console , temukan bagian Engage , lalu klik Remote Config .
  2. Klik tombol Buat konfigurasi 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 -> Conditional value -> Create new condition .
  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 untuk meluncurkan di langkah berikutnya.)
  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 Nilai untuk peluncuran gambar Musiman . Masukkan URL tempat gambar musiman akan diunduh: https://images.unsplash.com/photo-1552691021-7043334e0b51
  2. Biarkan nilai default sebagai string kosong. Ini berarti gambar default dalam basis kode akan ditampilkan daripada gambar yang diunduh dari URL.
  3. Klik Simpan .

99e6cd2ebcdced.png

Anda dapat melihat bahwa konfigurasi baru dibuat sebagai konsep.

  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 sebelum menampilkan MainActivity dan menampilkan layar pembuka untuk menyembunyikan proses ini. Anda tidak ingin pengguna Anda menunggu terlalu lama di layar ini, jadi biasanya bermanfaat untuk memantau berapa lama layar pembuka ditampilkan.

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

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 jejak 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 jejak 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 mengunduh dan memproses gambar, Anda akan menambahkan jejak kode khusus kedua yang akan melacak waktu tambahan yang ditambahkan fitur Anda ke SplashScreenActivity .

  1. Inisialisasi, buat, dan mulai jejak 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() 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();

Sekarang setelah Anda menambahkan pelacakan kode khusus untuk melacak durasi layar splash ( 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 , diikuti dengan durasi trace. 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 log 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 pelacakan 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 gambar harus diunduh dari URL. Dan siapa tahu – Anda mungkin pada akhirnya memiliki URL yang berbeda dari tempat Anda mengunduh gambar.

Jadi, mari tambahkan atribut khusus yang mewakili URL gambar musiman ke pelacakan kode khusus ini. Dengan begitu, Anda dapat memfilter data durasi menurut 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);

    // ...
}

Sekarang setelah Anda menambahkan atribut khusus ( seasonal_image_url_attribute ) untuk kedua jejak khusus Anda ( 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 musimanImageUrl , itulah sebabnya nilai atribut tidak unset .

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

7. Konfigurasikan dasbor Pemantauan Kinerja Anda

Konfigurasikan dasbor Anda untuk memantau fitur Anda

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

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

Anda akan melihat dasbor Performa Anda 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 menyertakan durasi pelacakan waktu mulai aplikasi Anda, tetapi Anda dapat menambahkan metrik yang paling Anda pedulikan. Karena Anda melacak fitur baru yang Anda tambahkan, Anda dapat menyesuaikan dasbor untuk menampilkan durasi pelacakan kode khusus splash_screen_trace .

  1. Klik salah satu kotak Pilih metrik yang kosong.
  2. Di jendela dialog, pilih jenis jejak Custom traces dan nama trace 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 yang sama ini untuk menambahkan metrik lain yang penting bagi Anda 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, jadi Anda akan menggunakan tampilan dasbor lain yang akan membantu Anda memahami kinerja peluncuran fitur.

8. Luncurkan fitur Anda

Sekarang setelah Anda 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 dari kondisi penargetan Anda. Biasanya, Anda akan meluncurkan fitur baru ke sebagian kecil pengguna dan meningkatkannya hanya jika Anda yakin tidak ada masalah dengannya. Namun, di codelab ini, Anda adalah satu-satunya pengguna aplikasi, 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 perubahan.

70f993502b27e7a0.png

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

b0cc91b6e48fb842.png

9. Periksa perubahan kinerja

Sekarang mari kita periksa kinerja pemuatan layar splash menggunakan dasbor Kinerja di konsol Firebase. Pada langkah codelab ini, Anda akan menggunakan berbagai bagian dasbor untuk melihat data kinerja.

  1. Pada tab Dasbor utama, gulir ke bawah ke tabel jejak, lalu klik tab Jejak khusus . Di 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 jejak, Anda dapat melihat bahwa unduhan dan pemrosesan ini membutuhkan 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 lebih mengkonfirmasi perbedaannya, Anda dapat melihat lebih dekat pada 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 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 splash screen Anda mungkin akan sedikit berbeda dari yang ada di tangkapan layar di atas, tetapi Anda harus 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 mudah, tetapi dalam aplikasi nyata, mungkin tidak begitu 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 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.png
  2. Di tabel pelacakan 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 sebagian besar waktu dihabiskan untuk mengunduh gambar.

6f92ce0f23494507.png

Temuan kinerja

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

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

Pada langkah berikutnya, Anda akan mengurangi dampak pada kinerja dengan memutar kembali fitur tersebut dan mengidentifikasi bagaimana Anda dapat meningkatkan penerapan fitur tersebut.

10. Putar kembali fiturnya

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

18c4f1cbac955a04.png

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

d946cab0df319e50.png

11. Perbaiki masalah kinerja

Anda menemukan sebelumnya di codelab bahwa mengunduh gambar untuk layar pembuka Anda menyebabkan pelambatan untuk aplikasi Anda. Melihat lebih dekat pada gambar yang diunduh, Anda melihat bahwa Anda menggunakan resolusi asli gambar, yang lebih dari 2MB! Satu perbaikan cepat untuk masalah kinerja Anda adalah mengurangi kualitas ke resolusi yang lebih tepat sehingga gambar membutuhkan waktu lebih sedikit untuk diunduh.

Luncurkan nilai Remote Config lagi

  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 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 pada 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 disetel untuk menggunakan URL gambar unduhan yang berbeda, jalankan aplikasi lagi. Kali ini, Anda harus memperhatikan bahwa waktu yang dihabiskan di layar splash lebih pendek dari sebelumnya.

b0cc91b6e48fb842.png

Lihat kinerja perubahan

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

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

2d7aaca03112c062.png

  1. Klik atribut khusus 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 ukurannya 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 daripada nilai untuk gambar sebelumnya dan lebih dapat diterima oleh pengguna Anda!

10e30c037a4237a2.png

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

4bd0a2a1faa14479.png

  1. Klik sakelar untuk mengaktifkan peringatan Durasi . Tetapkan nilai ambang menjadi sedikit di atas nilai yang Anda lihat sehingga jika splash_screen_trace Anda melebihi ambang batas, Anda akan menerima email.
  1. Klik Simpan untuk membuat lansiran Anda. Gulir ke bawah ke tabel pelacakan , 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 kinerja fitur baru! Anda memantau metrik kinerja utama untuk peluncuran fitur baru dan bereaksi dengan cepat ketika masalah kinerja ditemukan. Ini semua dimungkinkan dengan kemampuan untuk membuat perubahan konfigurasi dengan Remote Config dan memantau masalah kinerja secara real time.

Apa yang telah kita 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 peringatan kinerja untuk memberi tahu Anda ketika kinerja aplikasi Anda melewati ambang batas yang Anda tetapkan

Belajarlah lagi