1. ภาพรวม
ใน Codelab นี้ คุณจะได้เรียนรู้วิธีตรวจสอบประสิทธิภาพของแอประหว่างการเปิดตัวฟีเจอร์ แอปตัวอย่างของเราจะมีฟังก์ชันการทำงานพื้นฐาน และมีการตั้งค่าให้แสดงภาพพื้นหลังที่แตกต่างกันตามแฟล็กการกำหนดค่าระยะไกลของ Firebase เราจะพูดถึงการใช้เครื่องมือการติดตามเพื่อตรวจสอบประสิทธิภาพของแอป การเปิดตัวการเปลี่ยนแปลงการกำหนดค่าในแอป ติดตามผลกระทบและดูว่าเราจะปรับปรุงประสิทธิภาพให้ดีขึ้นได้อย่างไร
สิ่งที่คุณจะได้เรียนรู้
- วิธีเพิ่มการตรวจสอบประสิทธิภาพของ Firebase ลงในแอปบนอุปกรณ์เคลื่อนที่เพื่อดูเมตริกที่พร้อมใช้งานทันที (เช่น เวลาเริ่มต้นของแอปและเฟรมที่ช้าหรือค้าง)
- วิธีเพิ่มการติดตามที่กำหนดเองเพื่อทำความเข้าใจเส้นทางโค้ดที่สำคัญในเส้นทางของผู้ใช้
- วิธีใช้หน้าแดชบอร์ดการตรวจสอบประสิทธิภาพเพื่อทำความเข้าใจเมตริกและติดตามการเปลี่ยนแปลงที่สำคัญ เช่น การเปิดตัวฟีเจอร์
- วิธีตั้งค่าการแจ้งเตือนประสิทธิภาพเพื่อตรวจสอบเมตริกหลัก
- วิธีเปิดตัวการเปลี่ยนแปลงการกำหนดค่าระยะไกลของ Firebase
ข้อกำหนดเบื้องต้น
- Android Studio 4.0 ขึ้นไป
- โปรแกรมจำลอง Android ที่มี API ระดับ 16 ขึ้นไป
- Java เวอร์ชัน 8 ขึ้นไป
- ความเข้าใจเบื้องต้นเกี่ยวกับการกำหนดค่าระยะไกลของ Firebase
2. ตั้งค่าโปรเจ็กต์ตัวอย่าง
ดาวน์โหลดโค้ด
เรียกใช้คำสั่งต่อไปนี้เพื่อโคลนโค้ดตัวอย่างสำหรับ Codelab นี้ การดำเนินการนี้จะสร้างโฟลเดอร์ชื่อ codelab-perf-rc-android
ในเครื่องของคุณ
$ git clone https://github.com/FirebaseExtended/codelab-feature-rollout-performance.git
หากไม่มี GitHub ในเครื่อง คุณยังสามารถดาวน์โหลดโค้ดจาก GitHub ได้โดยตรง
นำเข้าโปรเจ็กต์ในโฟลเดอร์ firebase-perf-rc-android-start
ไปยัง Android Studio คุณอาจเห็นข้อยกเว้นรันไทม์บางรายการหรือคำเตือนเกี่ยวกับไฟล์ google-services.json
ที่ขาดหายไป เราจะแก้ไขปัญหานี้ในส่วนถัดไป
ใน Codelab นี้ คุณจะใช้ปลั๊กอิน Firebase Assistant เพื่อลงทะเบียนแอป Android กับโปรเจ็กต์ Firebase และเพิ่มไฟล์การกำหนดค่า ปลั๊กอิน และทรัพยากร Dependency ที่จำเป็นของ Firebase ลงในโปรเจ็กต์ Android จากภายใน Android Studio
เชื่อมต่อแอปกับ Firebase
- ไปที่ Android Studio/ความช่วยเหลือ > ตรวจหาอัปเดตเพื่อให้แน่ใจว่าคุณกำลังใช้ Android Studio และ Firebase Assistant เวอร์ชันล่าสุด
- เลือกเครื่องมือ > Firebase เพื่อเปิดแผง Assistant
- เลือกการตรวจสอบประสิทธิภาพเพื่อเพิ่มในแอป แล้วคลิกเริ่มต้นใช้งานการตรวจสอบประสิทธิภาพ
- คลิกเชื่อมต่อกับ Firebase เพื่อเชื่อมต่อโปรเจ็กต์ Android กับ Firebase (ซึ่งจะเปิดคอนโซล Firebase ในเบราว์เซอร์)
- ในคอนโซล Firebase ให้คลิกเพิ่มโปรเจ็กต์ แล้วป้อนชื่อโปรเจ็กต์ Firebase (หากมีโปรเจ็กต์ Firebase อยู่แล้ว ก็เลือกโปรเจ็กต์ที่มีอยู่แทนได้) คลิกต่อไปและยอมรับข้อกำหนดเพื่อสร้างโปรเจ็กต์ Firebase และแอป Firebase ใหม่
จากนั้นคุณควรเห็นกล่องโต้ตอบสำหรับเชื่อมต่อแอป Firebase ใหม่กับโปรเจ็กต์ Android Studio
- คลิกเชื่อมต่อ
- เปิด Android Studio ในแผง Assistant คุณจะเห็นการยืนยันว่าแอปเชื่อมต่อกับ Firebase แล้ว
เพิ่มการตรวจสอบประสิทธิภาพลงในแอป
ในแผง Assistant ใน Android Studio ให้คลิกเพิ่มการตรวจสอบประสิทธิภาพลงในแอป
คุณควรเห็นกล่องโต้ตอบสำหรับยอมรับการเปลี่ยนแปลงหลังจากที่ Android Studio ควรซิงค์แอปเพื่อให้แน่ใจว่ามีการเพิ่มทรัพยากร Dependency ที่จำเป็นทั้งหมดแล้ว
สุดท้าย คุณควรเห็นข้อความดำเนินการสำเร็จในแผง Assistant ใน Android Studio ที่ระบุว่าทรัพยากร Dependency ทั้งหมดได้รับการตั้งค่าอย่างถูกต้อง
ขั้นตอนเพิ่มเติมคือเปิดใช้การบันทึกการแก้ไขข้อบกพร่อง โดยทำตามวิธีการในขั้นตอน "(ไม่บังคับ) เปิดใช้การบันทึกการแก้ไขข้อบกพร่อง" ดูวิธีการเดียวกันนี้ได้ในเอกสารประกอบที่เผยแพร่ต่อสาธารณะด้วย
3. เรียกใช้แอป
ตอนนี้คุณควรเห็นไฟล์ google-services.json
ในไดเรกทอรีโมดูล (ระดับแอป) ของแอป และระบบจะคอมไพล์แอปได้แล้ว ใน Android Studio คลิกเรียกใช้ > เรียกใช้ "แอป" เพื่อสร้างและเรียกใช้แอปในโปรแกรมจำลองของ Android
เมื่อแอปทำงานอยู่ คุณควรเห็นหน้าจอแนะนำดังนี้
จากนั้นหลังจากผ่านไป 2-3 วินาที หน้าหลักที่มีรูปภาพเริ่มต้นจะปรากฏขึ้นดังนี้
เกิดอะไรขึ้นในเบื้องหลัง
ระบบจะใช้หน้าจอแนะนําใน SplashScreenActivity และทำสิ่งต่อไปนี้
- ใน
onCreate()
เราจะเริ่มต้นการตั้งค่าการกำหนดค่าระยะไกลของ Firebase และดึงค่าที่จะตั้งค่าในแดชบอร์ดการกำหนดค่าระยะไกลภายหลังใน Codelab นี้ - ใน
executeTasksBasedOnRC()
เราอ่านค่าการกำหนดค่าของแฟล็กseasonal_image_url
หาก URL ระบุโดยค่าของการกําหนดค่า เราจะดาวน์โหลดรูปภาพแบบซิงโครนัส - เมื่อดาวน์โหลดเสร็จแล้ว แอปจะไปที่ MainActivity และเรียกใช้
finish()
เพื่อสิ้นสุดSplashScreenActivity
ใน MainActivity
หากกำหนด seasonal_image_url
ผ่านการกำหนดค่าระยะไกล ระบบจะเปิดใช้ฟีเจอร์นี้และแสดงรูปภาพที่ดาวน์โหลดเป็นพื้นหลังของหน้าหลัก มิฉะนั้น ภาพเริ่มต้น (แสดงด้านบน) จะแสดงขึ้นมา
4. ตั้งการกำหนดค่าระยะไกล
ตอนนี้ที่แอปทํางานอยู่ คุณก็ตั้งค่าแฟล็กฟีเจอร์ใหม่ได้
- ในแผงด้านซ้ายของคอนโซล Firebase ให้ค้นหาส่วน Engage แล้วคลิกการกำหนดค่าระยะไกล
- คลิกปุ่มสร้างการกำหนดค่าเพื่อเปิดแบบฟอร์มการกำหนดค่า และเพิ่ม
seasonal_image_url
เป็นคีย์พารามิเตอร์ - คลิกเพิ่มคำอธิบาย จากนั้นป้อนคำอธิบาย
Shows a seasonal image (replaces default) in the main page when the restaurant list is empty.
- คลิกเพิ่มใหม่ -> ค่าแบบมีเงื่อนไข -> สร้างเงื่อนไขใหม่
- ป้อนชื่อเงื่อนไขเป็น
Seasonal image rollout
- สำหรับส่วน
Applies if...
ให้เลือกUser in random percentile <= 0%
(คุณต้องการปิดใช้ฟีเจอร์นี้ไว้จนกว่าจะพร้อมเปิดตัวในขั้นตอนถัดไป) - คลิกสร้างเงื่อนไข คุณจะต้องใช้เงื่อนไขนี้ในภายหลังเพื่อเปิดตัวฟีเจอร์ใหม่แก่ผู้ใช้
- เปิดสร้างแบบฟอร์มพารามิเตอร์แรก แล้วหาช่องค่าสำหรับการเปิดตัวรูปภาพตามฤดูกาล ป้อน URL ที่จะใช้ดาวน์โหลดรูปภาพตามฤดูกาล:
https://images.unsplash.com/photo-1552691021-7043334e0b51
- ปล่อยค่าเริ่มต้นเป็นสตริงว่างเปล่า ซึ่งหมายความว่าจะแสดงรูปภาพเริ่มต้นใน Codebase แทนที่จะเป็นรูปภาพที่ดาวน์โหลดจาก URL
- คลิกบันทึก
คุณจะเห็นว่ามีการสร้างการกำหนดค่าใหม่เป็นฉบับร่าง
- คลิกเผยแพร่การเปลี่ยนแปลง และยืนยันการเปลี่ยนแปลงที่ด้านบนเพื่ออัปเดตแอป
5. เพิ่มการตรวจสอบสำหรับเวลาที่ใช้ในการโหลดข้อมูล
แอปของคุณโหลดข้อมูลบางอย่างไว้ล่วงหน้าก่อนที่จะแสดง MainActivity
และแสดงหน้าจอแนะนำเพื่อซ่อนกระบวนการนี้ คุณไม่ต้องการให้ผู้ใช้รอบนหน้าจอนี้นานเกินไป ดังนั้น ปกติแล้วควรตรวจสอบระยะเวลาที่หน้าจอแนะนำจะแสดง
การตรวจสอบประสิทธิภาพของ Firebase ช่วยในเรื่องนี้ได้ คุณสามารถใช้การติดตามโค้ดที่กำหนดเองเพื่อตรวจสอบประสิทธิภาพของโค้ดที่เฉพาะเจาะจงในแอป เช่น เวลาที่ใช้ในการโหลดข้อมูล และเวลาในการประมวลผลของฟีเจอร์ใหม่
ในการติดตามระยะเวลาที่หน้าจอแนะนำจะแสดง คุณจะต้องเพิ่มการติดตามโค้ดที่กำหนดเองลงใน SplashScreenActivity
ซึ่งก็คือ Activity
ที่ใช้งานหน้าจอแนะนำ
- เริ่มต้น สร้าง และเริ่มการติดตามโค้ดที่กำหนดเองชื่อ
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");
// ...
}
- สิ้นสุดการติดตามในเมธอด
onDestroy()
ของSplashScreenActivity
:
SplashScreenActivity.java
@Override
protected void onDestroy() {
super.onDestroy();
// TODO: Stop the splash_screen_trace here
splashScreenTrace.stop();
}
เนื่องจากฟีเจอร์ใหม่จะดาวน์โหลดและประมวลผลรูปภาพ คุณจะเพิ่มการติดตามโค้ดที่กำหนดเองรายการที่ 2 ซึ่งจะติดตามเวลาที่ฟีเจอร์เพิ่มขึ้นใน SplashScreenActivity
- เริ่มต้น สร้าง และเริ่มการติดตามโค้ดที่กำหนดเองชื่อ
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");
// ...
}
}
- สิ้นสุดการติดตามในทั้งเมธอด
onLoadFailed()
และonResourceReady()
ของ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();
เมื่อเพิ่มการติดตามโค้ดที่กำหนดเองเพื่อติดตามระยะเวลาหน้าจอแนะนำ (splash_screen_trace)
และเวลาในการประมวลผลของฟีเจอร์ใหม่ (splash_seasonal_image_processing
) แล้ว ให้เรียกใช้แอปใน Android Studio อีกครั้ง คุณควรเห็นข้อความบันทึกที่มี Logging trace metric: splash_screen_trace
ตามด้วยระยะเวลาของการติดตาม คุณจะไม่เห็นข้อความบันทึกสำหรับ splash_seasonal_image_processing
เนื่องจากคุณยังไม่ได้เปิดใช้งานฟีเจอร์ใหม่
6. เพิ่มแอตทริบิวต์ที่กำหนดเองลงในการติดตาม
สำหรับการติดตามโค้ดที่กำหนดเอง การตรวจสอบประสิทธิภาพจะบันทึกแอตทริบิวต์เริ่มต้น (ข้อมูลเมตาทั่วไป เช่น เวอร์ชันของแอป ประเทศ อุปกรณ์ ฯลฯ) โดยอัตโนมัติ เพื่อให้คุณกรองข้อมูลสำหรับการติดตามในคอนโซล Firebase ได้ คุณยังเพิ่มและตรวจสอบแอตทริบิวต์ที่กำหนดเองได้ด้วย
คุณเพิ่งเพิ่มการติดตามโค้ดที่กำหนดเอง 2 รายการในแอปเพื่อตรวจสอบระยะเวลาของหน้าจอแนะนำและเวลาในการประมวลผลของฟีเจอร์ใหม่ ปัจจัยที่อาจส่งผลต่อระยะเวลาเหล่านี้คือ รูปภาพที่แสดงเป็นภาพเริ่มต้น หรือคุณต้องดาวน์โหลดรูปภาพจาก URL หรือไม่ แล้วรู้ไหมว่าท้ายที่สุดแล้วคุณอาจมี URL ที่ต่างจากเดิมที่คุณดาวน์โหลดรูปภาพมา
ดังนั้น เรามาเพิ่มแอตทริบิวต์ที่กําหนดเองซึ่งแสดง URL ของรูปภาพตามฤดูกาลลงในการติดตามโค้ดที่กําหนดเองเหล่านี้ วิธีนี้ช่วยให้คุณกรองข้อมูลระยะเวลาตามค่าเหล่านี้ได้ในภายหลัง
- เพิ่มแอตทริบิวต์ที่กำหนดเอง (
seasonal_image_url_attribute
) สำหรับsplash_screen_trace
ในช่วงต้นของเมธอด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);
}
// ...
}
- เพิ่มแอตทริบิวต์ที่กำหนดเองเดียวกันนี้สำหรับ
splash_seasonal_image_processing
ทันทีหลังจากการเรียก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);
// ...
}
เมื่อคุณเพิ่มแอตทริบิวต์ที่กำหนดเอง (seasonal_image_url_attribute
) สำหรับการติดตามที่กำหนดเองทั้ง 2 รายการ (splash_screen_trace
และ splash_seasonal_image_processing
) แล้ว โปรดเรียกใช้แอปใน Android Studio อีกครั้ง คุณควรเห็นข้อความการบันทึกที่มี Setting attribute 'seasonal_image_url_attribute' to 'unset' on trace 'splash_screen_trace'.
คุณยังไม่ได้เปิดใช้พารามิเตอร์การกำหนดค่าระยะไกล seasonalImageUrl ซึ่งเป็นเหตุผลที่ค่าแอตทริบิวต์คือ unset
Performance Monitoring SDK จะรวบรวมข้อมูลการติดตามและส่งไปยัง Firebase คุณดูข้อมูลได้ในแดชบอร์ดประสิทธิภาพของคอนโซล Firebase ซึ่งเราจะอธิบายรายละเอียดในขั้นตอนถัดไปของ Codelab
7. กำหนดค่าหน้าแดชบอร์ดการตรวจสอบประสิทธิภาพ
กำหนดค่าหน้าแดชบอร์ดเพื่อตรวจสอบฟีเจอร์
ในคอนโซล Firebase ให้เลือกโปรเจ็กต์ที่มีแอป friendly Eats
ในแผงด้านซ้าย ให้มองหาไอคอนรุ่นและ ตรวจสอบ แล้วคลิกประสิทธิภาพ
คุณควรเห็นแดชบอร์ดประสิทธิภาพที่มีจุดข้อมูลแรกในกระดานเมตริก Performance Monitoring SDK จะรวบรวมข้อมูลประสิทธิภาพจากแอปและแสดงภายในไม่กี่นาทีหลังจากเก็บรวบรวมข้อมูล
กระดานเมตริกนี้คือที่ที่คุณสามารถติดตามเมตริกที่สำคัญของแอป มุมมองเริ่มต้นจะมีระยะเวลาของการติดตามเวลาเริ่มต้นแอป แต่คุณสามารถเพิ่มเมตริกที่คุณสนใจมากที่สุดได้ เนื่องจากกําลังติดตามฟีเจอร์ใหม่ที่เพิ่มเข้ามา คุณจึงปรับแต่งหน้าแดชบอร์ดให้แสดงระยะเวลาของการติดตามโค้ดที่กําหนดเองได้ splash_screen_trace
- คลิกช่องเลือกเมตริกที่ว่างอยู่ช่องใดช่องหนึ่ง
- ในหน้าต่างกล่องโต้ตอบ ให้เลือกประเภทการติดตามเป็นการติดตามที่กำหนดเองและชื่อการติดตาม
splash_screen_trace
- คลิกเลือกเมตริก แล้วคุณจะเห็นระยะเวลาการเพิ่ม
splash_screen_trace
ในหน้าแดชบอร์ด
คุณใช้ขั้นตอนเดียวกันนี้ในการเพิ่มเมตริกอื่นๆ ที่คุณสนใจเพื่อดูได้อย่างรวดเร็วว่าประสิทธิภาพของเมตริกเปลี่ยนไปอย่างไรบ้างเมื่อเวลาผ่านไปและแม้แต่ในรุ่นต่างๆ
กระดานเมตริกเป็นเครื่องมือที่มีประสิทธิภาพในการติดตามประสิทธิภาพของเมตริกหลักที่ผู้ใช้พบ สำหรับ Codelab นี้ คุณมีข้อมูลชุดเล็กๆ ในช่วงเวลาที่แคบ ดังนั้นคุณจะใช้มุมมองหน้าแดชบอร์ดอื่นๆ ที่จะช่วยให้คุณเข้าใจประสิทธิภาพในการเปิดตัวฟีเจอร์
8. เปิดตัวฟีเจอร์
เมื่อตั้งค่าการตรวจสอบแล้ว และพร้อมเปิดตัวการเปลี่ยนแปลงการกำหนดค่าระยะไกลของ Firebase (seasonal_image_url)
ที่คุณตั้งค่าไว้ก่อนหน้านี้
หากต้องการเปิดตัวการเปลี่ยนแปลง คุณจะต้องกลับไปยังหน้าการกำหนดค่าระยะไกลในคอนโซล Firebase เพื่อเพิ่มเปอร์เซ็นไทล์ผู้ใช้ของเงื่อนไขการกำหนดเป้าหมาย โดยปกติแล้ว คุณควรเปิดตัวฟีเจอร์ใหม่ๆ แก่ผู้ใช้กลุ่มเล็กๆ แล้วเพิ่มการใช้งานเฉพาะเมื่อคุณมั่นใจว่าไม่มีปัญหา แต่คุณเป็นผู้ใช้แอปเพียงคนเดียวใน Codelab นี้ ดังนั้นจึงเปลี่ยนเปอร์เซ็นไทล์เป็น 100% ได้
- คลิกแท็บเงื่อนไขที่ด้านบนของหน้า
- คลิกเงื่อนไข
Seasonal image rollout
ที่คุณเพิ่มไว้ก่อนหน้านี้ - เปลี่ยนเปอร์เซ็นไทล์เป็น 100%
- คลิกบันทึกเงื่อนไข
- คลิกเผยแพร่การเปลี่ยนแปลง และยืนยันการเปลี่ยนแปลง
กลับไปที่ Android Studio แล้วรีสตาร์ทแอปในโปรแกรมจำลองเพื่อดูฟีเจอร์ใหม่ หลังจากหน้าจอแนะนำแล้ว คุณจะเห็นหน้าจอหลักสถานะว่างเปล่าใหม่
9. ตรวจสอบการเปลี่ยนแปลงของประสิทธิภาพ
ต่อไปเรามาดูประสิทธิภาพของการโหลดหน้าจอแนะนำโดยใช้แดชบอร์ดประสิทธิภาพในคอนโซล Firebase กัน ในขั้นตอนนี้ของ Codelab คุณจะใช้ส่วนต่างๆ ของแดชบอร์ดเพื่อดูข้อมูลประสิทธิภาพ
- ในแท็บแดชบอร์ดหลัก ให้เลื่อนลงไปที่ตารางการติดตาม แล้วคลิกแท็บการติดตามที่กำหนดเอง ในตารางนี้ คุณจะเห็นการติดตามโค้ดที่กําหนดเองที่เพิ่มไว้ก่อนหน้านี้ และการติดตามที่พร้อมใช้งานทันทีบางรายการ
- เมื่อเปิดใช้ฟีเจอร์ใหม่แล้ว ให้มองหาการติดตามโค้ดที่กําหนดเอง
splash_seasonal_image_processing
ซึ่งวัดเวลาที่ใช้ในการดาวน์โหลดและประมวลผลรูปภาพ จากค่า Duration ของการติดตาม คุณจะเห็นว่าการดาวน์โหลดและการประมวลผลนี้ใช้เวลานานพอสมควร
- เนื่องจากมีข้อมูลสำหรับ
splash_seasonal_image_processing
คุณจึงเพิ่มระยะเวลาของการติดตามนี้ลงในกระดานเมตริกได้ที่ด้านบนของแท็บแดชบอร์ด
เช่นเดียวกับก่อนหน้านี้ ให้คลิกช่องเลือกเมตริกช่องใดช่องหนึ่งที่ว่างเปล่า ในหน้าต่างกล่องโต้ตอบ ให้เลือกประเภทการติดตามการติดตามที่กำหนดเองและชื่อการติดตาม splash_seasonal_image_processing
สุดท้าย คลิกเลือกเมตริกเพื่อเพิ่มเมตริกนี้ลงในบอร์ดเมตริก
- คุณตรวจสอบข้อมูลของ
splash_screen_trace
อย่างละเอียดเพื่อยืนยันความแตกต่างเพิ่มเติมได้ คลิกการ์ดsplash_screen_trace
ในกระดานเมตริก แล้วคลิกดูรายละเอียดเมตริก
- ในหน้ารายละเอียด คุณจะเห็นรายการแอตทริบิวต์ที่ด้านซ้ายล่าง รวมถึงแอตทริบิวต์ที่กำหนดเองที่สร้างไว้ก่อนหน้านี้ คลิกแอตทริบิวต์ที่กำหนดเอง
seasonal_image_url_attribute
เพื่อดูระยะเวลาหน้าจอแนะนำสำหรับ URL รูปภาพตามฤดูกาลแต่ละรายการทางด้านขวา
- ค่าระยะเวลาหน้าจอแนะนำอาจต่างจากที่แสดงในภาพหน้าจอด้านบนเล็กน้อย แต่คุณควรมีระยะเวลานานขึ้นเมื่อดาวน์โหลดภาพจาก URL เมื่อเทียบกับการใช้รูปภาพเริ่มต้น (แสดงเป็น "ไม่ได้ตั้งค่า")
ใน Codelab นี้ เหตุผลที่ทำให้ระยะเวลานานขึ้นนี้อาจดูตรงไปตรงมา แต่ในแอปจริงอาจไม่ชัดเจนนัก ข้อมูลระยะเวลาที่รวบรวมมาจากอุปกรณ์ที่แตกต่างกันซึ่งเรียกใช้แอปในสภาวะการเชื่อมต่อเครือข่ายที่หลากหลาย และเงื่อนไขเหล่านี้อาจแย่ลงกว่าที่คุณคาดไว้ มาดูวิธีตรวจสอบปัญหานี้กันหากเป็นสถานการณ์ที่เกิดขึ้นจริง
- คลิกประสิทธิภาพที่ด้านบนของหน้าเพื่อกลับไปยังแท็บหลักแดชบอร์ด
- คลิกแท็บคำขอเครือข่ายในตารางการติดตามที่ด้านล่างของหน้า ในตารางนี้ คุณจะเห็นคำขอเครือข่ายทั้งหมดจากแอปของคุณรวมอยู่ในรูปแบบ URL รวมถึงรูปแบบ URL ของ
images.unsplash.com/**
หากคุณเปรียบเทียบค่าของเวลาในการตอบกลับนี้กับเวลาโดยรวมที่ใช้ในการดาวน์โหลดและประมวลผลรูปภาพ (เช่น ระยะเวลาของการติดตามsplash_seasonal_image_processing
) คุณจะเห็นว่าใช้เวลาไปกับการดาวน์โหลดรูปภาพเป็นอย่างมาก
ผลการสืบค้นประสิทธิภาพ
เมื่อใช้การตรวจสอบประสิทธิภาพของ Firebase คุณเห็นผลกระทบต่อไปนี้ต่อผู้ใช้ปลายทางที่เปิดใช้ฟีเจอร์ใหม่
- เวลาที่ใช้ใน
SplashScreenActivity
เพิ่มขึ้น - ระยะเวลา
splash_seasonal_image_processing
สูงมาก - ความล่าช้าเกิดจากเวลาในการตอบสนองสำหรับการดาวน์โหลดรูปภาพและเวลาประมวลผลที่เกี่ยวข้องซึ่งจำเป็นต้องใช้สำหรับรูปภาพ
ในขั้นตอนถัดไป คุณจะลดผลกระทบต่อประสิทธิภาพโดยย้อนกลับฟีเจอร์และระบุวิธีปรับปรุงการใช้งานฟีเจอร์ได้
10. ย้อนกลับฟีเจอร์
การเพิ่มจำนวนผู้ใช้ ไม่เป็นที่น่าพอใจสำหรับการรอระหว่างหน้าจอเริ่มต้น ประโยชน์ที่สำคัญอย่างหนึ่งของการกำหนดค่าระยะไกลคือความสามารถในการหยุดชั่วคราวและย้อนกลับการเปิดตัวโดยไม่ต้องเผยแพร่อีกเวอร์ชันหนึ่งให้กับผู้ใช้ วิธีนี้จะช่วยให้คุณตอบสนองต่อปัญหาได้อย่างรวดเร็ว (เช่น ปัญหาด้านประสิทธิภาพที่พบในขั้นตอนสุดท้าย) และลดจำนวนผู้ใช้ที่ไม่พึงพอใจได้
เพื่อลดความเสี่ยงที่คุณจะรีเซ็ตเปอร์เซ็นไทล์ของการเปิดตัวกลับไปเป็น 0
เพื่อให้ผู้ใช้ทั้งหมดของคุณเห็นภาพเริ่มต้นอีกครั้ง
- กลับไปที่หน้าการกำหนดค่าระยะไกลในคอนโซล Firebase
- คลิกเงื่อนไขที่ด้านบนของหน้า
- คลิกเงื่อนไข
Seasonal image rollout
ที่คุณเพิ่มไว้ก่อนหน้านี้ - เปลี่ยนเปอร์เซ็นไทล์เป็น 0%
- คลิกบันทึกเงื่อนไข
- คลิกเผยแพร่การเปลี่ยนแปลง และยืนยันการเปลี่ยนแปลง
รีสตาร์ทแอปใน Android Studio แล้วคุณจะเห็นหน้าจอหลักเดิมสถานะว่างเปล่า:
11. แก้ไขปัญหาด้านประสิทธิภาพ
คุณค้นพบก่อนหน้านี้ใน Codelab ว่าการดาวน์โหลดรูปภาพสำหรับหน้าจอแนะนำทำให้แอปทำงานช้าลง เมื่อเข้าไปดูรูปภาพที่ดาวน์โหลดอย่างละเอียด คุณจะเห็นว่าคุณกำลังใช้ความละเอียดเดิมของรูปภาพ ซึ่งใหญ่กว่า 2 MB วิธีแก้ไขปัญหาด้านประสิทธิภาพอย่างรวดเร็วอย่างหนึ่งคือการลดคุณภาพลงเป็นความละเอียดที่เหมาะสมมากขึ้น เพื่อให้รูปภาพใช้เวลาดาวน์โหลดน้อยลง
นำค่าการกำหนดค่าระยะไกลมาใช้อีกครั้ง
- กลับไปที่หน้าการกำหนดค่าระยะไกลในคอนโซล Firebase
- คลิกไอคอนแก้ไขของพารามิเตอร์
seasonal_image_url
- อัปเดตค่าสำหรับการเปิดตัวรูปภาพตามฤดูกาลเป็น
https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640
แล้วคลิกบันทึก
- คลิกแท็บเงื่อนไขที่ด้านบนของหน้า
- คลิกการเปิดตัวรูปภาพตามฤดูกาล แล้วตั้งค่าเปอร์เซ็นไทล์กลับไปเป็น 100%
- คลิกบันทึกเงื่อนไข
- คลิกปุ่มเผยแพร่การเปลี่ยนแปลง
12. ทดสอบการแก้ไขและตั้งค่าการแจ้งเตือน
เรียกใช้แอปในเครื่อง
เรียกใช้แอปอีกครั้งเมื่อตั้งค่าการกำหนดค่าใหม่ให้ใช้ URL รูปภาพการดาวน์โหลดอื่น คราวนี้ คุณจะสังเกตเห็นว่าเวลาที่ใช้ในหน้าจอแนะนำสั้นกว่าเดิม
ดูประสิทธิภาพของการเปลี่ยนแปลง
กลับไปที่หน้าแดชบอร์ดประสิทธิภาพในคอนโซล Firebase เพื่อดูลักษณะของเมตริก
- โดยครั้งนี้คุณจะใช้ตารางการติดตามเพื่อไปยังหน้ารายละเอียด ที่ด้านล่างของตารางการติดตาม ในแท็บการติดตามที่กำหนดเอง ให้คลิกการติดตามที่กำหนดเอง
splash_seasonal_image_processing
เพื่อดูมุมมองที่ละเอียดมากขึ้นของเมตริกระยะเวลาอีกครั้ง
- คลิกแอตทริบิวต์ที่กำหนดเอง
seasonal_image_url_attribute
เพื่อดูรายละเอียดแอตทริบิวต์ที่กำหนดเองอีกครั้ง หากวางเมาส์เหนือ URL คุณจะเห็นค่าที่ตรงกับ URL ใหม่ของรูปภาพที่ลดขนาดลง:https://images.unsplash.com/photo-1552691021-7043334e0b51?w=640
(โดยมี?w=640
ต่อท้าย) ค่าระยะเวลาที่เชื่อมโยงกับรูปภาพนี้สั้นกว่าค่าสำหรับรูปภาพก่อนหน้าพอสมควรสำหรับผู้ใช้ของคุณ
- ตอนนี้คุณได้ปรับปรุงประสิทธิภาพของหน้าจอแนะนําแล้ว คุณจึงตั้งค่าการแจ้งเตือนเมื่อมีการติดตามเกินเกณฑ์ที่ตั้งไว้ได้ เปิดแดชบอร์ดประสิทธิภาพ แล้วคลิกไอคอนเมนูรายการเพิ่มเติม (จุด 3 จุด) สำหรับ splash_screen_trace แล้วคลิกการตั้งค่าการแจ้งเตือน
- คลิกปุ่มเปิด/ปิดเพื่อเปิดใช้การแจ้งเตือนระยะเวลา ตั้งค่าเกณฑ์ให้สูงกว่าค่าที่คุณเห็นเล็กน้อย เพื่อที่ว่าหาก Splash_screen_trace เกินเกณฑ์ คุณจะได้รับอีเมล
- คลิกบันทึกเพื่อสร้างการแจ้งเตือน เลื่อนลงไปที่ตารางการติดตาม แล้วคลิกแท็บการติดตามที่กำหนดเองเพื่อดูว่ามีการเปิดใช้การแจ้งเตือนแล้ว
13. ยินดีด้วย
ยินดีด้วย คุณได้เปิดใช้ Firebase Performance Monitoring SDK และรวบรวมการติดตามเพื่อวัดประสิทธิภาพของฟีเจอร์ใหม่ คุณได้ติดตามดูเมตริกประสิทธิภาพที่สำคัญสำหรับการเปิดตัวฟีเจอร์ใหม่ และตอบกลับได้อย่างรวดเร็วเมื่อพบปัญหาเกี่ยวกับประสิทธิภาพ ทั้งหมดนี้เป็นไปได้ด้วยความสามารถในการเปลี่ยนแปลงการกำหนดค่าด้วยการกำหนดค่าระยะไกลและตรวจสอบปัญหาด้านประสิทธิภาพแบบเรียลไทม์
สรุปประเด็นที่ได้พูดถึง
- การเพิ่ม Firebase Performance Monitoring SDK ลงในแอป
- การเพิ่มการติดตามโค้ดที่กำหนดเองลงในโค้ดเพื่อวัดฟีเจอร์ที่เจาะจง
- การตั้งค่าพารามิเตอร์การกำหนดค่าระยะไกลและค่าแบบมีเงื่อนไขเพื่อควบคุม/เปิดตัวฟีเจอร์ใหม่
- การทำความเข้าใจวิธีใช้หน้าแดชบอร์ดการตรวจสอบประสิทธิภาพเพื่อระบุปัญหาระหว่างการเปิดตัว
- การตั้งค่าการแจ้งเตือนประสิทธิภาพเพื่อแจ้งให้คุณทราบเมื่อประสิทธิภาพของแอปเกินเกณฑ์ที่คุณตั้งไว้