Özellik Sunumlarının Performans İzlemesi

Koleksiyonlar ile düzeninizi koruyun İçeriği tercihlerinize göre kaydedin ve kategorilere ayırın.

1. Genel Bakış

Bu codelab'de, bir özelliğin kullanıma sunulması sırasında uygulamanızın performansını nasıl izleyeceğinizi öğreneceksiniz. Örnek uygulamamız temel işlevlere sahip olacak ve Firebase Remote Config bayrağına dayalı olarak farklı bir arka plan görüntüsü gösterecek şekilde ayarlandı. Uygulamanın performansını izlemek, uygulamada bir yapılandırma değişikliği yapmak, etkiyi izlemek ve performansı nasıl iyileştirebileceğimizi görmek için izleme izlerini gözden geçireceğiz.

ne öğreneceksin

  • Kullanıma hazır metrikler (uygulama başlangıç ​​zamanı ve yavaş veya donmuş kareler gibi) elde etmek için mobil uygulamanıza Firebase Performance Monitoring nasıl eklenir?
  • Kullanıcı yolculuklarınızın kritik kod yollarını anlamak için özel izlemeler nasıl eklenir?
  • Metriklerinizi anlamak ve bir özelliğin kullanıma sunulması gibi önemli değişiklikleri izlemek için Performans İzleme panosu nasıl kullanılır?
  • Temel ölçümlerinizi izlemek için performans uyarıları nasıl ayarlanır?
  • Firebase Remote Config değişikliği nasıl kullanıma sunulur?

Önkoşullar

  • Android Studio 4.0 veya üstü
  • API düzeyi 16 veya üzeri olan bir Android öykünücüsü.
  • Java sürüm 8 veya üzeri
  • Firebase Remote Config hakkında temel bir anlayış

2. Örnek projeyi kurun

Kodu indirin

Bu codelab için örnek kodu klonlamak için aşağıdaki komutu çalıştırın. Bu, makinenizde codelab-perf-rc-android adlı bir klasör oluşturacaktır:

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

Makinenizde Git yoksa, kodu doğrudan GitHub'dan da indirebilirsiniz.

firebase-perf-rc-android-start klasörü altındaki projeyi Android Studio'ya aktarın. Muhtemelen bazı çalışma zamanı istisnaları veya eksik bir google-services.json dosyası hakkında bir uyarı göreceksiniz. Bunu bir sonraki bölümde düzelteceğiz.

Bu kod laboratuvarında, Android uygulamanızı bir Firebase projesine kaydetmek ve gerekli Firebase yapılandırma dosyalarını, eklentileri ve bağımlılıkları Android projenize eklemek için Firebase Assistant eklentisini kullanacaksınız - hepsi Android Studio içinden !

Uygulamanızı Firebase'e bağlayın

  1. Android Studio'nun ve Firebase Assistant'ın en son sürümlerini kullandığınızdan emin olmak için Android Studio / Yardım > Güncellemeleri kontrol et seçeneğine gidin.
  2. Asistan bölmesini açmak için Araçlar > Firebase'i seçin.

c0e42ef063d21eab.png

  1. Uygulamanıza eklemek için Performans İzleme'yi seçin ve ardından Performans İzleme'yi kullanmaya başlayın ' ı tıklayın.
  2. Android projenizi Firebase'e bağlamak için Firebase'e Bağlan'a tıklayın (bu, tarayıcınızda Firebase konsolunu açacaktır) .
  3. Firebase konsolunda Proje ekle 'yi tıklayın, ardından bir Firebase proje adı girin (zaten bir Firebase projeniz varsa, bunun yerine mevcut projeyi seçebilirsiniz) . Firebase projesi ve yeni bir Firebase Uygulaması oluşturmak için Devam et ve şartları kabul et'i tıklayın.

Ardından, yeni Firebase Uygulamanızı Android Studio projenize bağlamak için bir iletişim kutusu görmelisiniz.

51a549ebde2fe57a.png

  1. Bağlan'ı tıklayın.
  2. Android Studio'yu açın. Asistan bölmesinde, uygulamanızın Firebase'e bağlı olduğuna dair onay göreceksiniz.

40c24c4a56a45990.png

Uygulamanıza Performans İzleme ekleyin

Android Studio'daki Asistan bölmesinde , uygulamanıza Performans İzleme Ekle'yi tıklayın.

Gerekli tüm bağımlılıkların eklendiğinden emin olmak için Android Studio'nun uygulamanızı senkronize etmesi gereken Değişiklikleri Kabul Et için bir iletişim kutusu görmelisiniz.

3046f3e1f5fea06f.png

Son olarak, Android Studio'daki Asistan bölmesinde tüm bağımlılıkların doğru şekilde kurulduğuna dair başarı mesajını görmelisiniz.

62e79fd18780e320.png

Ek bir adım olarak, "(İsteğe bağlı) Hata ayıklama günlüğünü etkinleştir" adımındaki talimatları izleyerek hata ayıklama günlüğünü etkinleştirin. Aynı talimatlar kamuya açık belgelerde de mevcuttur.

3. Uygulamayı çalıştırın

Artık uygulamanızın modül (uygulama düzeyi) dizininde google-services.json dosyasını görmelisiniz ve uygulamanız şimdi derlenmelidir. Android Studio'da, uygulamayı Android öykünücünüzde oluşturmak ve çalıştırmak için Çalıştır > 'uygulamayı çalıştır' seçeneğini tıklayın.

Uygulama çalışırken, önce aşağıdaki gibi bir açılış ekranı görmelisiniz:

ffbd413a6983b205.png

Ardından, birkaç saniye sonra varsayılan resmin bulunduğu ana sayfa görüntülenecektir:

d946cab0df319e50.png

Kaputun altında neler oluyor?

Açılış ekranı SplashScreenActivity'de uygulanır ve aşağıdakileri yapar:

  1. onCreate() 'de, Firebase Remote Config ayarlarını başlatıyoruz ve bu kod laboratuvarında daha sonra Remote Config panosunda ayarlayacağınız yapılandırma değerlerini getiriyoruz.
  2. executeTasksBasedOnRC() içinde, seasonal_image_url bayrağının yapılandırma değerini okuruz. Yapılandırma değeri tarafından bir URL sağlanıyorsa, görüntüyü eşzamanlı olarak indiririz.
  3. İndirme tamamlandığında, uygulama MainActivity'ye gider ve SplashScreenActivity sonlandırmak için finish() 'i çağırır.

MainActivity , Remote Config aracılığıyla seasonal_image_url tanımlanmışsa, özellik etkinleştirilecek ve indirilen görüntü ana sayfanın arka planı olarak görüntülenecektir. Aksi takdirde, varsayılan görüntü (yukarıda gösterilen) görüntülenecektir.

4. Remote Config'i kurun

Artık uygulamanız çalıştığına göre, yeni özellik bayrağını ayarlayabilirsiniz.

  1. Firebase konsolunun sol panelinde , Engage bölümünü bulun ve ardından Remote Config öğesini tıklayın.
  2. Yapılandırma formunu açmak için Yapılandırma oluştur düğmesini tıklayın ve parametre anahtarı olarak seasonal_image_url ekleyin.
  3. Açıklama ekle 'yi tıklayın, ardından bu açıklamayı girin: Shows a seasonal image (replaces default) in the main page when the restaurant list is empty.
  4. Yeni ekle -> Koşullu değer -> Yeni koşul oluştur öğesini tıklayın.
  5. Koşul adı için Seasonal image rollout girin.
  6. Şu durumda Applies if... bölümü için User in random percentile <= 0% . (Daha sonraki bir adımda kullanıma sunmaya hazır olana kadar özelliği devre dışı bırakmak istiyorsunuz.)
  7. Koşul oluştur 'u tıklayın. Bu koşulu daha sonra yeni özelliği kullanıcılarınıza sunmak için kullanacaksınız.

7a07526eb9e81623.png

  1. İlk parametrenizi oluşturun formunuzu açın ve Sezonluk görüntü sunumu için Değer alanını bulun. Sezonluk resmin indirileceği URL'yi girin: https://images.unsplash.com/photo-1552691021-7043334e0b51
  2. Varsayılan değeri boş bir dize olarak bırakın. Bu, bir URL'den indirilen bir resim yerine kod tabanındaki varsayılan resmin gösterileceği anlamına gelir.
  3. Kaydet'i tıklayın .

99e6cd2ebcdced.png

Yeni yapılandırmanın taslak olarak oluşturulduğunu görebilirsiniz.

  1. Uygulamanızı güncellemek için Değişiklikleri yayınla'yı tıklayın ve üst kısımdaki değişiklikleri onaylayın.

39cd3e96d370c7ce.png

5. Veri yükleme süresi için izleme ekleyin

Uygulamanız, MainActivity göstermeden önce bazı verileri önceden yükler ve bu işlemi gizlemek için bir açılış ekranı görüntüler. Kullanıcılarınızın bu ekranda çok uzun süre beklemesini istemezsiniz, bu nedenle normalde açılış ekranının ne kadar süreyle görüntülendiğini izlemek faydalıdır.

Firebase Performance Monitoring, tam da bunu yapmanın bir yolunu sunar. Verilerin yüklenme süresi ve yeni özelliğinizin işlem süresi gibi, uygulamanızdaki belirli kodun performansını izlemek için özel kod izlerini kullanabilirsiniz.

Açılış ekranının ne kadar süreyle görüntülendiğini izlemek için, açılış ekranını uygulayan Activity olan SplashScreenActivity özel bir kod izi ekleyeceksiniz.

  1. splash_screen_trace adlı özel bir kod izlemeyi başlatın, oluşturun ve başlatın:

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. onDestroy() yönteminde SplashScreenActivity :

SplashScreenActivity.java

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

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

Yeni özelliğiniz bir görüntüyü indirip işlediğinden, özelliğinizin SplashScreenActivity eklediği ek süreyi izleyecek ikinci bir özel kod izlemesi ekleyeceksiniz.

  1. splash_seasonal_image_processing adlı özel bir kod izini başlatın, oluşturun ve başlatın:

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. RequestListener öğesinin hem onLoadFailed() hem de onResourceReady onResourceReady() yöntemlerinde 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();

Artık açılış ekranı süresini ( splash_screen_trace) ve yeni özelliğin ( splash_seasonal_image_processing ) işlem süresini izlemek için özel kod izleri eklediğinize göre , uygulamayı Android Studio'da tekrar çalıştırın . Logging trace metric: splash_screen_trace , ardından izlemenin süresi. Yeni özelliği henüz etkinleştirmediğiniz için splash_seasonal_image_processing için bir günlük mesajı görmeyeceksiniz.

6. İzlemeye özel bir öznitelik ekleyin

Özel kod izlemeleri için Performans İzleme, varsayılan öznitelikleri (uygulama sürümü, ülke, cihaz vb. ortak meta veriler) otomatik olarak günlüğe kaydeder; böylece, Firebase konsolunda izleme için verileri filtreleyebilirsiniz. Ayrıca özel nitelikler ekleyebilir ve izleyebilirsiniz.

Uygulamanıza, açılış ekranı süresini ve yeni özelliğin işlem süresini izlemek için iki özel kod izi eklediniz. Bu süreleri etkileyebilecek bir faktör, görüntülenen resmin varsayılan resim olup olmadığı veya resmin bir URL'den indirilmesi gerekip gerekmediğidir. Ve kim bilir - sonunda bir resim indirdiğiniz farklı URL'leriniz olabilir.

Bu nedenle, bu özel kod izlerine sezonluk resim URL'sini temsil eden özel bir özellik ekleyelim. Bu şekilde, süre verilerini daha sonra bu değerlere göre filtreleyebilirsiniz.

  1. executeTasksBasedOnRC yönteminin başına splash_screen_trace için özel özniteliği ( seasonal_image_url_attribute ) ekleyin:

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. startTrace("splash_seasonal_image_processing") çağrısından hemen sonra splash_seasonal_image_processing için aynı özel özniteliği ekleyin:

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);

    // ...
}

Artık her iki özel izlemeniz ( splash_screen_trace ve splash_seasonal_image_processing ) için özel bir öznitelik ( seasonal_image_url_attribute ) eklediğinize göre , uygulamayı Android Studio'da tekrar çalıştırın . Setting attribute 'seasonal_image_url_attribute' to 'unset' on trace 'splash_screen_trace'. Remote Config parametresi mevsimlikImageUrl'yi henüz etkinleştirmediniz, bu nedenle öznitelik değeri unset .

Performans İzleme SDK'sı, izleme verilerini toplayacak ve bunları Firebase'e gönderecektir. Verileri, codelab'in sonraki adımında ayrıntılı olarak açıklayacağımız Firebase konsolunun Performans panosunda görüntüleyebilirsiniz.

7. Performans İzleme panonuzu yapılandırın

Özelliğinizi izlemek için kontrol panelinizi yapılandırın

Firebase konsolunda , Friendly Eats uygulamanızın bulunduğu projeyi seçin.

Sol panelde, Yayınla ve İzle bölümünü bulun ve ardından Performans öğesini tıklayın.

Performans panonuzu, metrik panonuzdaki ilk veri noktalarınızla birlikte görmelisiniz! Performance Monitoring SDK, uygulamanızdan performans verilerini toplar ve toplandıktan sonra dakikalar içinde görüntüler.

f57e5450b70034c9.png

Bu metrik panosu, uygulamanız için temel metrikleri takip edebileceğiniz yerdir. Varsayılan görünüm, uygulamanızın başlangıç ​​zamanı izleme süresini içerir, ancak en çok önem verdiğiniz ölçümleri ekleyebilirsiniz. Eklediğiniz yeni özelliği takip ettiğiniz için, özel kod splash_screen_trace süresini görüntülemek için kontrol panelinizi özelleştirebilirsiniz.

  1. Boş bir metrik seçin kutularından birine tıklayın.
  2. İletişim penceresinde, Özel izlemelerin izleme türünü ve splash_screen_trace izleme adını seçin.

1fb81f4dba3220e0.png

  1. Metrik seç 'i tıklayın ve gösterge tablonuza eklenen splash_screen_trace süresini görmelisiniz!

Aynı adımları, önem verdiğiniz diğer metrikleri eklemek için de kullanabilirsiniz; böylece performanslarının zaman içinde ve hatta farklı sürümlerde nasıl değiştiğini hızlıca görebilirsiniz.

1d465c021e58da3b.png

Metrik panosu, kullanıcılarınızın deneyimlediği temel metriklerin performansını izlemek için güçlü bir araçtır . Bu codelab için, dar bir zaman aralığında küçük bir veri kümeniz vardır, bu nedenle, özelliğin kullanıma sunulmasının performansını anlamanıza yardımcı olacak diğer pano görünümlerini kullanacaksınız.

8. Özelliğinizi ortaya çıkarın

Artık izlemenizi kurduğunuza göre, daha önce kurduğunuz Firebase Remote Config değişikliğini ( seasonal_image_url) kullanıma sunmaya hazırsınız.

Bir değişikliği kullanıma sunmak için, hedefleme durumunuzun kullanıcı yüzdelik dilimini artırmak için Firebase konsolundaki Remote Config sayfasına geri dönersiniz. Normalde, kullanıcıların küçük bir bölümüne yeni özellikler sunar ve yalnızca bununla ilgili herhangi bir sorun olmadığından emin olduğunuzda artırırsınız. Ancak bu codelab'de uygulamanın tek kullanıcıları sizsiniz, bu nedenle yüzdeyi %100 olarak değiştirebilirsiniz.

  1. Sayfanın üst kısmındaki Koşullar sekmesine tıklayın.
  2. Daha önce eklediğiniz Seasonal image rollout koşulunu tıklayın.
  3. Yüzdeyi %100 olarak değiştirin.
  4. Koşulu kaydet 'i tıklayın.
  5. Değişiklikleri yayınla'ya tıklayın ve değişiklikleri onaylayın.

70f993502b27e7a0.png

Android Studio'ya döndüğünüzde, yeni özelliği görmek için öykünücünüzdeki uygulamayı yeniden başlatın. Açılış ekranından sonra yeni boş durum ana ekranını görmelisiniz!

b0cc91b6e48fb842.png

9. Performans değişikliklerini kontrol edin

Şimdi Firebase konsolundaki Performans panosunu kullanarak açılış ekranı yükleme performansını kontrol edelim. Codelab'ın bu adımında, performans verilerini görüntülemek için panonun farklı bölümlerini kullanacaksınız.

  1. Ana Pano sekmesinde, izler tablosuna gidin ve ardından Özel izler sekmesine tıklayın. Bu tabloda, daha önce eklediğiniz özel kod izlerini ve bazı kullanıma hazır izleri göreceksiniz.
  2. Artık yeni özelliği etkinleştirdiğinize göre, görüntünün indirilmesi ve işlenmesi için geçen süreyi splash_seasonal_image_processing özel kod izini arayın. İzlemenin Süre değerinden, bu indirme ve işlemenin önemli miktarda zaman aldığını görebilirsiniz.

439adc3ec71805b7.png

  1. splash_seasonal_image_processing için verileriniz olduğundan, bu izlemenin süresini Gösterge Tablosu sekmesinin üst kısmındaki metrik panonuza ekleyebilirsiniz.

Daha önce olduğu gibi, boş Bir metrik seçin kutularından birine tıklayın. İletişim penceresinde, Özel izlemeler izleme türünü ve splash_seasonal_image_processing izleme adını seçin. Son olarak, bu metriği metrik panosuna eklemek için Metrik seç'i tıklayın.

7fb64d2340410576.png

  1. Farklılıkları daha da doğrulamak için, splash_screen_trace için verilere daha yakından bakabilirsiniz. Metrik panosundaki splash_screen_trace kartını ve ardından Metrik ayrıntılarını görüntüle 'yi tıklayın.

b1c275c30679062a.png

  1. Ayrıntılar sayfasında, daha önce oluşturduğunuz özel öznitelik de dahil olmak üzere sol altta bir öznitelik listesi göreceksiniz. Sağdaki her bir sezonluk resim URL'si için açılış ekranı süresini görüntülemek için seasonal_image_url_attribute özel özelliğini tıklayın:

8fa1a69019bb045e.png

  1. Açılış ekranı süre değerleriniz muhtemelen yukarıdaki ekran görüntüsündekilerden biraz farklı olacaktır, ancak resim bir URL'den indirildiğinde, varsayılan resmi ("ayarlanmamış" ile temsil edilir) kullanmaya kıyasla daha uzun bir süreye sahip olmanız gerekir.

Bu kod laboratuvarında, bu daha uzun sürenin nedeni basit olabilir, ancak gerçek bir uygulamada çok açık olmayabilir. Toplanan süre verileri, uygulamayı çeşitli ağ bağlantısı koşullarında çalıştıran farklı cihazlardan gelir ve bu koşullar beklentinizden daha kötü olabilir. Bu gerçek bir dünya durumu olsaydı, bu konuyu nasıl araştıracağınıza bakalım.

  1. Gösterge Tablosu ana sekmesine geri dönmek için sayfanın üst kısmındaki Performans'ı tıklayın: 640b696b79d90103.png
  2. Sayfanın altındaki izleme tablosunda Ağ istekleri sekmesine tıklayın. Bu tabloda, images.unsplash.com/** URL kalıbı dahil olmak üzere, uygulamanızdan gelen tüm ağ isteklerinin URL kalıplarında toplandığını göreceksiniz. Bu yanıt süresinin değerini, görüntünün indirilmesi ve işlenmesi için geçen toplam süreyle (yani, splash_seasonal_image_processing izinin süresi) karşılaştırırsanız, görüntünün indirilmesi için büyük miktarda zaman harcandığını görebilirsiniz.

6f92ce0f23494507.png

Performans bulguları

Firebase Performance Monitoring'i kullanarak, yeni özelliğin etkinleştirilmesiyle son kullanıcılar üzerinde aşağıdaki etkiyi gördünüz:

  1. SplashScreenActivity harcanan süre arttı.
  2. splash_seasonal_image_processing süresi çok uzundu.
  3. Gecikme, görüntünün indirilmesi için yanıt süresinden ve görüntü için gereken ilgili işlem süresinden kaynaklandı.

Sonraki adımda, özelliği geri alarak ve özelliğin uygulanmasını nasıl iyileştirebileceğinizi belirleyerek performans üzerindeki etkiyi azaltacaksınız.

10. Özelliği geri alın

Açılış ekranı sırasında kullanıcılarınızın bekleme süresini artırmak istenmez. Remote Config'in en önemli avantajlarından biri, kullanıcılarınıza başka bir sürüm yayınlamak zorunda kalmadan sunumunuzu duraklatma ve geri alma yeteneğidir. Bu, sorunlara (son adımda keşfettiğiniz performans sorunları gibi) hızla tepki vermenize ve mutsuz kullanıcı sayısını en aza indirmenize olanak tanır.

Hızlı bir azaltma olarak, tüm kullanıcılarınızın varsayılan resmi tekrar görebilmesi için kullanıma sunma yüzdelik dilimini tekrar 0 sıfırlarsınız:

  1. Firebase konsolundaki Remote Config sayfasına geri dönün.
  2. Sayfanın üst kısmındaki Koşullar'a tıklayın.
  3. Daha önce eklediğiniz Seasonal image rollout koşuluna tıklayın.
  4. Yüzdeyi %0 olarak değiştirin.
  5. Koşulu kaydet 'i tıklayın.
  6. Değişiklikleri yayınla'ya tıklayın ve değişiklikleri onaylayın.

18c4f1cbac955a04.png

Uygulamayı Android Studio'da yeniden başlatın ve orijinal boş durum ana ekranını görmelisiniz:

d946cab0df319e50.png

11. Performans sorunlarını düzeltin

Daha önce codelab'de, açılış ekranınız için bir resim indirmenin uygulamanızın yavaşlamasına neden olduğunu keşfettiniz. İndirilen resme daha yakından baktığınızda, 2MB'ın üzerinde olan resmin orijinal çözünürlüğünü kullandığınızı görüyorsunuz! Performans sorununuz için hızlı bir düzeltme, görüntünün indirilmesinin daha az zaman alması için kaliteyi daha uygun bir çözünürlüğe düşürmektir.

Remote Config değerini tekrar kullanıma alın

  1. Firebase konsolundaki Remote Config sayfasına geri dönün.
  2. seasonal_image_url parametresi için Düzenle simgesini tıklayın.
  3. Sezonluk görüntü sunumunun Değerini https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640 olarak güncelleyin, ardından Kaydet 'i tıklayın.

828dd1951a2ec4a4.png

  1. Sayfanın üst kısmındaki Koşullar sekmesine tıklayın.
  2. Sezonluk görsel sunumu'nu tıklayın, ardından yüzdeyi tekrar %100'e ayarlayın.
  3. Koşulu kaydet 'i tıklayın.

1974fa3bb789f36c.png

  1. Değişiklikleri yayınla düğmesine tıklayın.

12. Düzeltmeyi test edin ve uyarıları ayarlayın

Uygulamayı yerel olarak çalıştırın

Yeni yapılandırma değeri farklı bir indirme resmi URL'si kullanacak şekilde ayarlandığında uygulamayı yeniden çalıştırın. Bu sefer, açılış ekranında geçirilen sürenin eskisinden daha kısa olduğunu fark etmelisiniz.

b0cc91b6e48fb842.png

Değişikliklerin performansını görüntüleyin

Metriklerin nasıl göründüğünü görmek için Firebase konsolundaki Performans panosuna dönün.

  1. Bu sefer ayrıntılar sayfasına gitmek için izleme tablosunu kullanacaksınız. İzler tablosunun aşağısında, Özel izler sekmesinde, süre metriğinin daha ayrıntılı bir görünümünü tekrar görmek için özel iz splash_seasonal_image_processing tıklayın.

2d7aaca03112c062.png

  1. Özel özelliklerin dökümünü tekrar görmek için seasonal_image_url_attribute özel özelliğini tıklayın. URL'lerin üzerine gelirseniz, küçültülmüş boyutlu görüntünün yeni URL'siyle eşleşen bir değer görürsünüz: https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640 ( ?w=640 ile sonunda). Bu görselle ilişkilendirilen süre değeri, önceki görselin değerinden çok daha kısa ve kullanıcılarınız için daha kabul edilebilir!

10e30c037a4237a2.png

  1. Artık açılış ekranınızın performansını iyileştirdiğinize göre, bir iz belirlediğiniz eşiği aştığında sizi bilgilendirmek için uyarılar ayarlayabilirsiniz. Performans panosunu açın ve splash_screen_trace için taşma menüsü (üç nokta) simgesine tıklayın ve Uyarı ayarları 'na tıklayın.

4bd0a2a1faa14479.png

  1. Süre uyarısını etkinleştirmek için düğmeyi tıklayın. Eşik değerini, gördüğünüz değerin biraz üzerinde olacak şekilde ayarlayın, böylece splash_screen_trace'iniz eşiği aşarsa bir e-posta alırsınız.
  1. Uyarınızı oluşturmak için Kaydet'e tıklayın. İzler tablosuna ilerleyin, ardından uyarınızın etkinleştirildiğini görmek için Özel izler sekmesine tıklayın!

2bb93639e2218d1.png

13. Tebrikler!

Tebrikler! Firebase Performance Monitoring SDK'yı etkinleştirdiniz ve yeni bir özelliğin performansını ölçmek için izler topladınız! Yeni bir özelliğin kullanıma sunulması için temel performans ölçümlerini izlediniz ve bir performans sorunu keşfedildiğinde hızla tepki verdiniz. Tüm bunlar, Remote Config ile yapılandırma değişiklikleri yapma ve performans sorunlarını gerçek zamanlı olarak izleme yeteneğiyle mümkün oldu.

Neyi kapsadık

  • Firebase Performance Monitoring SDK'sını uygulamanıza ekleme
  • Belirli bir özelliği ölçmek için kodunuza özel bir kod izi ekleme
  • Yeni bir özelliği kontrol etmek/kullanmak için bir Remote Config parametresi ve koşullu değer ayarlama
  • Kullanıma sunma sırasında sorunları belirlemek için performans izleme panosunun nasıl kullanılacağını anlama
  • Uygulamanızın performansı belirlediğiniz bir eşiği aştığında sizi bilgilendirmek için performans uyarıları ayarlama

Daha fazla bilgi edin