เพิ่มการตรวจสอบที่กำหนดเองสำหรับโค้ดของแอปที่ต้องการ

Performance Monitoring จะรวบรวมร่องรอยเพื่อช่วยคุณตรวจสอบประสิทธิภาพของแอป โดยร่องรอยคือรายงานข้อมูลประสิทธิภาพที่บันทึกไว้ระหว่าง 2 จุดในเวลาที่แตกต่างกันในแอป

คุณสามารถสร้างการติดตามของคุณเองเพื่อตรวจสอบข้อมูลประสิทธิภาพที่เชื่อมโยงกับโค้ดที่เฉพาะเจาะจงในแอปได้ การติดตามโค้ดที่กําหนดเองช่วยให้คุณวัดระยะเวลาที่แอปใช้ในการทํางานหนึ่งๆ หรือชุดงานให้เสร็จสมบูรณ์ได้ เช่น การโหลดชุดรูปภาพหรือการค้นหาฐานข้อมูล

เมตริกเริ่มต้นสำหรับการติดตามโค้ดที่กําหนดเองคือ "ระยะเวลา" (ช่วงเวลาระหว่างจุดเริ่มต้นและจุดสิ้นสุดของการติดตาม) แต่คุณก็เพิ่มเมตริกที่กําหนดเองได้ด้วย

ในโค้ด คุณจะกําหนดจุดเริ่มต้นและจุดสิ้นสุดของการติดตามโค้ดที่กําหนดเองได้โดยใช้ API ที่ Performance Monitoring SDK มีให้ การติดตามโค้ดที่กําหนดเองสามารถเริ่มได้ทุกเมื่อหลังจากสร้าง และจะไม่มีปัญหาเกี่ยวกับเธรด

เนื่องจากเมตริกเริ่มต้นที่รวบรวมสําหรับร่องรอยเหล่านี้คือ "ระยะเวลา" ร่องรอยเหล่านี้จึงบางครั้งเรียกว่า "ร่องรอยระยะเวลา"

คุณสามารถดูข้อมูลจากร่องรอยเหล่านี้ได้ในแท็บย่อยร่องรอยที่กําหนดเองของตารางร่องรอย ซึ่งอยู่ที่ด้านล่างของหน้าแดชบอร์ดประสิทธิภาพ (ดูข้อมูลเพิ่มเติมเกี่ยวกับการใช้คอนโซลในหน้านี้ในภายหลัง)

แอตทริบิวต์เริ่มต้น แอตทริบิวต์ที่กําหนดเอง และเมตริกที่กําหนดเอง

คุณสามารถกําหนดค่าการติดตามโค้ดที่กําหนดเองเพิ่มเติมเพื่อบันทึกเมตริกที่กําหนดเองสําหรับเหตุการณ์ที่เกี่ยวข้องกับประสิทธิภาพซึ่งเกิดขึ้นภายในขอบเขตของการติดตาม เช่น คุณสามารถสร้างเมตริกที่กําหนดเองสําหรับจํานวนการ Hit และ Miss ของแคช หรือจํานวนครั้งที่ UI ไม่ตอบสนองเป็นระยะเวลาหนึ่ง

แอตทริบิวต์ที่กําหนดเองและเมตริกที่กําหนดเองจะแสดงในFirebaseคอนโซล ควบคู่ไปกับแอตทริบิวต์เริ่มต้นและเมตริกเริ่มต้นของการติดตาม

เพิ่มการติดตามโค้ดที่กําหนดเอง

ใช้ Performance Monitoring Trace API เพื่อเพิ่มการติดตามโค้ดที่กําหนดเองเพื่อตรวจสอบโค้ดแอปพลิเคชันที่ต้องการ

โปรดทราบดังต่อไปนี้

• แอปหนึ่งๆ มีการติดตามโค้ดที่กําหนดเองได้หลายรายการ
• การติดตามโค้ดที่กําหนดเองสามารถทํางานพร้อมกันได้มากกว่า 1 รายการ
• ชื่อการติดตามโค้ดที่กำหนดเองต้องเป็นไปตามข้อกำหนดต่อไปนี้ ไม่มีอักขระเว้นวรรคนำหน้าหรือตามหลัง ไม่มีอักขระขีดล่าง (_) นำหน้า และความยาวสูงสุดคือ 100 อักขระ
• การติดตามโค้ดที่กําหนดเองรองรับการเพิ่มเมตริกที่กําหนดเองและแอตทริบิวต์ที่กําหนดเอง

หากต้องการเริ่มและหยุดการติดตามโค้ดที่กําหนดเอง ให้ตัดโค้ดที่ต้องการติดตามด้วยบรรทัดโค้ดที่คล้ายกับตัวอย่างต่อไปนี้

import { trace } from "firebase/performance";

const t = trace(perf, "CUSTOM_TRACE_NAME");
t.start();

// Code that you want to trace 
// ...

t.stop();
perf_add_custom_trace.js

const trace = perf.trace("CUSTOM_TRACE_NAME");
trace.start();

// Code that you want to trace 
// ...

trace.stop();
index.js

เพิ่มการติดตามโค้ดที่กําหนดเองโดยใช้ User Timing API

นอกจาก Performance Monitoring Trace API แล้ว คุณยังเพิ่มการติดตามโค้ดที่กําหนดเองได้โดยใช้ User Timing API ของเบราว์เซอร์ Performance Monitoring SDK จะรับระยะเวลาการติดตามที่วัดโดยใช้ API นี้โดยอัตโนมัติ การใช้ User Timing API จะมีประโยชน์อย่างยิ่งหากคุณต้องการโหลด Performance Monitoring SDK แบบไม่พร้อมกัน เมื่อเริ่มต้น SDK แล้ว SDK จะบันทึกการวัดผลที่เกิดขึ้นก่อนการโหลด

หากต้องการใช้ฟีเจอร์นี้ ให้ตัดโค้ดที่ต้องการติดตามด้วยเครื่องหมายการวัดเวลาของผู้ใช้ ดังนี้

const performance = window.performance;

performance.mark("measurementStart");

// Code that you want to trace 
// ...

performance.mark("measurementStop");
performance.measure("customTraceName", "measurementStart", "measurementStop");
perf_user_timing_marks.js

const performance = window.performance;

performance.mark("measurementStart");

// Code that you want to trace 
// ...

performance.mark("measurementStop");
performance.measure("customTraceName", "measurementStart", "measurementStop");
index.js

โปรดทราบว่า performance ในตัวอย่างข้างต้นหมายถึงออบเจ็กต์ window.performance ของเบราว์เซอร์

เมื่อใช้ User Timing API คุณจะเพิ่มเมตริกและแอตทริบิวต์ที่กําหนดเองลงในร่องรอยโค้ดที่กําหนดเองไม่ได้ ใช้ Performance Monitoring Trace API หากต้องการเพิ่มองค์ประกอบที่กําหนดเองเหล่านั้นลงในการติดตามโค้ดที่กําหนดเอง

เพิ่มเมตริกที่กําหนดเองลงในร่องรอยโค้ดที่กําหนดเอง

ใช้ Performance Monitoring Trace API เพื่อเพิ่มเมตริกที่กําหนดเองในการติดตามโค้ดที่กําหนดเอง

โปรดทราบดังต่อไปนี้

• ชื่อเมตริกที่กําหนดเองต้องเป็นไปตามข้อกําหนดต่อไปนี้ ไม่มีอักขระช่องว่างขึ้นต้นหรือต่อท้าย ไม่มีอักขระขีดล่าง (_) ขึ้นต้น และความยาวสูงสุดคือ 100 อักขระ
• การติดตามโค้ดที่กําหนดเองแต่ละรายการจะบันทึกเมตริกได้สูงสุด 32 รายการ (รวมถึงเมตริกระยะเวลาเริ่มต้น)

หากต้องการเพิ่มเมตริกที่กําหนดเอง ให้เพิ่มบรรทัดโค้ดที่คล้ายกับตัวอย่างต่อไปนี้ทุกครั้งที่เกิดเหตุการณ์ ตัวอย่างเช่น เมตริกที่กําหนดเองนี้จะนับเหตุการณ์ที่เกี่ยวข้องกับประสิทธิภาพที่เกิดขึ้นในแอป

import { trace } from "firebase/performance";

async function getInventory(inventoryIds) {
  const t = trace(perf, "inventoryRetrieval");

  // Tracks the number of IDs fetched (the metric could help you to optimize in the future)
  t.incrementMetric("numberOfIds", inventoryIds.length);

  // Measures the time it takes to request inventory based on the amount of inventory
  t.start();
  const inventoryData = await retrieveInventory(inventoryIds);
  t.stop();

  return inventoryData;
}
perf_add_custom_metrics.js

async function getInventory(inventoryIds) {
  const trace = perf.trace("inventoryRetrieval");

  // Tracks the number of IDs fetched (the metric could help you to optimize in the future)
  trace.incrementMetric("numberOfIds", inventoryIds.length);

  // Measures the time it takes to request inventory based on the amount of inventory
  trace.start();
  const inventoryData = await retrieveInventory(inventoryIds);
  trace.stop();

  return inventoryData;
}
index.js

สร้างแอตทริบิวต์ที่กำหนดเองสำหรับการติดตามโค้ดที่กำหนดเอง

ใช้ Performance Monitoring Trace API เพื่อเพิ่มแอตทริบิวต์ที่กำหนดเองลงในการติดตามโค้ดที่กำหนดเอง

หากต้องการใช้แอตทริบิวต์ที่กําหนดเอง ให้เพิ่มโค้ดลงในแอปที่กําหนดแอตทริบิวต์และเชื่อมโยงกับร่องรอยโค้ดที่กําหนดเองที่เฉพาะเจาะจง คุณสามารถตั้งค่าแอตทริบิวต์ที่กําหนดเองได้ทุกเมื่อระหว่างที่การติดตามเริ่มต้นและหยุด

โปรดทราบดังต่อไปนี้

• ชื่อแอตทริบิวต์ที่กำหนดเองต้องเป็นไปตามข้อกำหนดต่อไปนี้

  • ไม่มีช่องว่างนำหน้าหรือต่อท้าย ไม่มีอักขระขีดล่าง (_) นําหน้า
  • ไม่มีเว้นวรรค
  • ความยาวสูงสุดคือ 32 อักขระ
  • อักขระที่อนุญาตสำหรับชื่อ ได้แก่ A-Z, a-z และ _

• การติดตามโค้ดที่กําหนดเองแต่ละรายการจะบันทึกแอตทริบิวต์ที่กําหนดเองได้สูงสุด 5 รายการ

• โปรดตรวจสอบว่าแอตทริบิวต์ที่กำหนดเองไม่มีข้อมูลที่ระบุตัวบุคคลนั้นได้ซึ่งส่งไปยัง Google

  ดูข้อมูลเพิ่มเติมเกี่ยวกับหลักเกณฑ์นี้

import { trace } from "firebase/performance";

const t = trace(perf, "test_trace");
t.putAttribute("experiment", "A");

// Update scenario
t.putAttribute("experiment", "B");

// Reading scenario
const experimentValue = t.getAttribute("experiment");

// Delete scenario
t.removeAttribute("experiment");

// Read attributes
const traceAttributes = t.getAttributes();
perf_add_custom_attributes.js

const trace = perf.trace("test_trace");
trace.putAttribute("experiment", "A");

// Update scenario
trace.putAttribute("experiment", "B");

// Reading scenario
const experimentValue = trace.getAttribute("experiment");

// Delete scenario
trace.removeAttribute("experiment");

// Read attributes
const traceAttributes = trace.getAttributes();
index.js

ติดตาม ดู และกรองข้อมูลประสิทธิภาพ

หากต้องการดูข้อมูลประสิทธิภาพแบบเรียลไทม์ ให้ตรวจสอบว่าแอปใช้ Performance Monitoring SDK เวอร์ชันที่เข้ากันได้กับการประมวลผลข้อมูลแบบเรียลไทม์ ดูข้อมูลเพิ่มเติมเกี่ยวกับข้อมูลประสิทธิภาพแบบเรียลไทม์

ติดตามเมตริกที่เฉพาะเจาะจงในแดชบอร์ด

หากต้องการดูแนวโน้มของเมตริกหลัก ให้เพิ่มเมตริกเหล่านั้นลงในบอร์ดเมตริกที่ด้านบนของแดชบอร์ดประสิทธิภาพ คุณสามารถระบุการถดถอยได้อย่างรวดเร็วโดยดูการเปลี่ยนแปลงในแต่ละสัปดาห์ หรือยืนยันว่าการเปลี่ยนแปลงล่าสุดในโค้ดช่วยปรับปรุงประสิทธิภาพได้

หากต้องการเพิ่มเมตริกลงในบอร์ดเมตริก ให้ทําตามขั้นตอนต่อไปนี้

1. ไปที่แดชบอร์ดประสิทธิภาพในคอนโซล Firebase
2. คลิกการ์ดเมตริกว่าง แล้วเลือกเมตริกที่มีอยู่เพื่อเพิ่มลงในบอร์ด
3. คลิก more_vert ในการ์ดเมตริกที่สร้างขึ้นเพื่อดูตัวเลือกเพิ่มเติม เช่น แทนที่หรือนําเมตริกออก

บอร์ดเมตริกจะแสดงข้อมูลเมตริกที่รวบรวมเมื่อเวลาผ่านไป ทั้งในรูปแบบกราฟิกและการเปลี่ยนแปลงเป็นเปอร์เซ็นต์ตัวเลข

ดูข้อมูลเพิ่มเติมเกี่ยวกับการใช้แดชบอร์ด

ดูร่องรอยและข้อมูลร่องรอย

หากต้องการดูการติดตาม ให้ไปที่หน้าแดชบอร์ดประสิทธิภาพในคอนโซล Firebase เลื่อนลงไปที่ตารางการติดตาม แล้วคลิกแท็บย่อยที่เหมาะสม ตารางจะแสดงเมตริกยอดนิยมบางรายการของการติดตามแต่ละรายการ และคุณยังจัดเรียงรายการตามเปอร์เซ็นต์การเปลี่ยนแปลงของเมตริกที่เฉพาะเจาะจงได้ด้วย

Performance Monitoring มีหน้าการแก้ปัญหาในคอนโซล Firebase ที่ไฮไลต์การเปลี่ยนแปลงของเมตริก ซึ่งช่วยให้คุณแก้ไขปัญหาได้อย่างรวดเร็วและลดผลกระทบของปัญหาด้านประสิทธิภาพต่อแอปและผู้ใช้ คุณสามารถใช้หน้าการแก้ปัญหาเมื่อทราบเกี่ยวกับปัญหาด้านประสิทธิภาพที่อาจเกิดขึ้น เช่น ในสถานการณ์ต่อไปนี้

• คุณเลือกเมตริกที่เกี่ยวข้องในแดชบอร์ดและสังเกตเห็นความแตกต่างที่มาก
• ในตารางการติดตาม คุณจัดเรียงเพื่อแสดงค่าเดลต้าที่ใหญ่ที่สุดที่ด้านบน และคุณจะเห็นการเปลี่ยนแปลงเปอร์เซ็นต์ที่สำคัญ
• คุณได้รับการแจ้งเตือนทางอีเมลเกี่ยวกับปัญหาด้านประสิทธิภาพ

คุณเข้าถึงหน้าการแก้ปัญหาได้ดังนี้

• ในหน้าแดชบอร์ดเมตริก ให้คลิกปุ่มดูรายละเอียดเมตริก
• ในการ์ดเมตริกใดก็ได้ ให้เลือก more_vert => ดูรายละเอียด หน้าการแก้ปัญหาจะแสดงข้อมูลเกี่ยวกับเมตริกที่คุณเลือก
• ในตารางการติดตาม ให้คลิกชื่อการติดตามหรือค่าเมตริกใดก็ได้ในแถวที่เชื่อมโยงกับการติดตามนั้น
• คลิกตรวจสอบเลยในการแจ้งเตือนทางอีเมล

เมื่อคลิกชื่อการติดตามในตารางการติดตาม คุณจะเจาะลึกเมตริกที่สนใจได้ คลิกปุ่มกรองadd เพื่อกรองข้อมูลตามแอตทริบิวต์ เช่น

• กรองตาม URL ของหน้าเว็บเพื่อดูข้อมูลของหน้าเว็บที่เจาะจงในเว็บไซต์
• กรองตามประเภทการเชื่อมต่อที่มีประสิทธิภาพเพื่อดูว่าการเชื่อมต่อ 3G ส่งผลต่อแอปของคุณอย่างไร
• กรองตามประเทศเพื่อให้แน่ใจว่าตำแหน่งฐานข้อมูลไม่ได้ส่งผลกระทบต่อภูมิภาคที่เฉพาะเจาะจง

ดูข้อมูลเพิ่มเติมเกี่ยวกับการดูข้อมูลร่องรอย

ขั้นตอนถัดไป

• ดูข้อมูลเพิ่มเติมเกี่ยวกับการใช้แอตทริบิวต์เพื่อตรวจสอบข้อมูลประสิทธิภาพ

• ดูข้อมูลเพิ่มเติมเกี่ยวกับวิธีติดตามปัญหาด้านประสิทธิภาพในคอนโซล Firebase

• ตั้งค่าการแจ้งเตือนสำหรับการเปลี่ยนแปลงโค้ดที่ทําให้ประสิทธิภาพของแอปลดลง เช่น คุณสามารถกําหนดค่าการแจ้งเตือนทางอีเมลสําหรับทีมได้หากระยะเวลาของการติดตามโค้ดที่กําหนดเองหนึ่งๆ นานเกินเกณฑ์ที่คุณกําหนด