วัดและแก้ไขข้อบกพร่องของประสิทธิภาพด้วย Google Analytics 4 และ BigQuery

ดูวิธีส่งข้อมูล Web Vitals ไปยังพร็อพเพอร์ตี้ Google Analytics 4 และส่งออกข้อมูลสำหรับการวิเคราะห์ใน BigQuery และ Looker Studio

Google มีเครื่องมือมากมาย เช่นการค้นหา คอนโซล, PageSpeed Insights (PSI) และ ประสบการณ์ของผู้ใช้ Chrome รายงาน (CrUX) ซึ่งช่วยให้นักพัฒนาซอฟต์แวร์สามารถดูว่าเว็บไซต์ของตนมีประสิทธิภาพเป็นอย่างไรเมื่อเทียบกับ Core Web เมตริก Vitals สำหรับผู้ใช้จริงใน

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

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

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

ด้วยเหตุนี้ เราขอแนะนำให้เจ้าของเว็บไซต์ทุกรายตรวจสอบเมตริก Core Web Vitals โดยใช้เครื่องมือข้อมูลวิเคราะห์ที่มีอยู่ โพสต์นี้อธิบายวิธีใช้ฟรี เครื่องมือของ Google ในการทำเช่นนั้นได้

เมื่อคุณตั้งค่าทุกอย่างเรียบร้อยแล้ว คุณจะสร้างหน้าแดชบอร์ดได้ดังนี้

ภาพหน้าจอรายงานเครื่องมือเชื่อมต่อ Web Vitals

ภาพหน้าจอรายงานเครื่องมือเชื่อมต่อ Web Vitals

และหากต้องการดูภาพรวมขั้นตอนทั้งหมดที่แสดงที่นี่ โปรดดูการพูดคุยของเราจากงาน Google I/O ปี 2021

วัดระยะทาง

การวัดประสิทธิภาพสามารถทำได้เสมอด้วย Google Analytics โดยใช้ เมตริกที่กำหนดเอง คือคุณลักษณะใหม่บางอย่างใน Google Analytics 4 (GA4) ที่นักพัฒนาแอป ตื่นเต้นกันเป็นพิเศษ

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

หากต้องการเริ่มต้นวัด Core Web Vitals โดยใช้ Google Analytics 4 และ BigQuery คุณจะต้องดำเนินการ 3 อย่าง

  1. สร้าง Google Analytics 4 พร็อพเพอร์ตี้และพร็อพเพอร์ตี้ โปรเจ็กต์ BigQuery
  2. เปิดใช้ BigQuery Export ในการกำหนดค่าพร็อพเพอร์ตี้ Google Analytics ดังนั้นข้อมูลทั้งหมดที่คุณได้รับจะ ระบบจะป้อนข้อมูลในตารางโปรเจ็กต์ BigQuery ให้โดยอัตโนมัติ
  3. เพิ่ม JavaScript เว็บวิทย์ เว็บไซต์ของคุณโดยอัตโนมัติ เพื่อให้คุณวัดเมตริก Core Web Vitals และ ส่งข้อมูลไปยัง Google Analytics 4 พร้อมข้อมูลการระบุแหล่งที่มา

วิเคราะห์

เมื่อตั้งค่าเรียบร้อยแล้ว คุณควรเห็นข้อมูลเหตุการณ์ใน BigQuery ปรากฏขึ้น อินเทอร์เฟซโดยอัตโนมัติและคุณจะสามารถสืบค้นข้อมูลได้ในลักษณะต่อไปนี้

SELECT * FROM `my_project_id.analytics_XXXXX.events_*`
WHERE event_name IN ('LCP', 'INP', 'CLS')

นี่คือตัวอย่างผลลัพธ์จากคำค้นหาดังกล่าว

ข้อมูลเหตุการณ์ Web Vitals ใน BigQuery

ข้อมูล Query Web Vitals

ก่อนเริ่มค้นหาข้อมูลเหตุการณ์ Web Vitals คุณต้อง เข้าใจวิธีรวบรวมข้อมูล

สิ่งสำคัญที่สุดที่จะต้องทำความเข้าใจคือ ในบางกรณี เหตุการณ์หลายๆ เหตุการณ์ อาจ ได้รับ สำหรับเมตริกเดียวกันในหน้าเดียวกัน ปัญหานี้อาจเกิดขึ้นได้หากค่าเมตริก ระบบจะรายงานการเปลี่ยนแปลงและค่าที่อัปเดต (เหตุการณ์เกิดขึ้นกับ CLS)

สำหรับเหตุการณ์ Web Vitals ค่าสุดท้ายที่ส่งจะเป็นค่าที่แม่นยำที่สุดเสมอ ดังนั้น ก่อนทำการวิเคราะห์ คุณควรกรองเฉพาะค่าเหล่านั้น ข้อมูลโค้ดที่ไลบรารี JavaScript สำหรับวิจารณญาณบนเว็บให้ไว้เพื่อส่งข้อมูลไปยัง Google Analytics 4 จะมีการส่งรหัสที่ไม่ซ้ำกันต่อเมตริก เพื่อให้คุณใช้ การค้นหาต่อไปนี้เพื่อจำกัดผลลัพธ์ให้เหลือเพียงค่าที่ได้รับล่าสุดสําหรับแต่ละรายการ รหัสเมตริก:

# Subquery all Web Vitals events from the last 28 days
WITH web_vitals_events AS (
  SELECT event_name as metric_name, * EXCEPT(event_name, is_last_received_value) FROM (
    SELECT *, IF (ROW_NUMBER() OVER (
      PARTITION BY (SELECT value.string_value FROM UNNEST(event_params) WHERE key = 'metric_id')
      ORDER BY (SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = 'metric_value') DESC
    ) = 1, true, false) AS is_last_received_value
    FROM `bigquery_project_id.analytics_XXXXX.events_*`
    WHERE event_name in ('CLS', 'INP', 'LCP') AND
      _TABLE_SUFFIX BETWEEN FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 28 DAY)) AND FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 1 DAY))
  ) WHERE is_last_received_value
)

โปรดทราบว่าคำค้นหาอื่นๆ ทั้งหมดที่อ้างอิงถึงในโพสต์นี้จะขึ้นต้นด้วย คำค้นหาย่อย

ตัวอย่างคำค้นหา

อีก 2-3 ส่วนถัดไปจะแสดงตัวอย่างคำค้นหาทั่วไปใน Web Vitals ที่คุณอาจใช้ได้ ที่ต้องการวิ่ง

LCP, INP และ CLS ที่เปอร์เซ็นไทล์ที่ 75% (P75) ทั่วทั้งเว็บไซต์

# Subquery all Web Vitals events from the last 28 days
WITH web_vitals_events AS (
  SELECT event_name as metric_name, * EXCEPT(event_name, is_last_received_value) FROM (
    SELECT *, IF (ROW_NUMBER() OVER (
      PARTITION BY (SELECT value.string_value FROM UNNEST(event_params) WHERE key = 'metric_id')
      ORDER BY (SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = 'metric_value') DESC
    ) = 1, true, false) AS is_last_received_value
    FROM `bigquery_project_id.analytics_XXXXX.events_*`
    WHERE event_name in ('CLS', 'INP', 'LCP') AND
      _TABLE_SUFFIX BETWEEN FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 28 DAY)) AND FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 1 DAY))
  ) WHERE is_last_received_value
)
# Main query logic
SELECT
  metric_name,
  APPROX_QUANTILES(metric_value, 100)[OFFSET(75)] AS p75,
  COUNT(1) as count
FROM (
  SELECT
    metric_name,
    ROUND((SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = "metric_value"), 3) AS metric_value,
  FROM web_vitals_events
)
GROUP BY 1

ค่า LCP แต่ละรายการทั้งหมดจากสูงสุดไปต่ำสุด

# Subquery all Web Vitals events from the last 28 days
WITH web_vitals_events AS (
  SELECT event_name as metric_name, * EXCEPT(event_name, is_last_received_value) FROM (
    SELECT *, IF (ROW_NUMBER() OVER (
      PARTITION BY (SELECT value.string_value FROM UNNEST(event_params) WHERE key = 'metric_id')
      ORDER BY (SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = 'metric_value') DESC
    ) = 1, true, false) AS is_last_received_value
    FROM `bigquery_project_id.analytics_XXXXX.events_*`
    WHERE event_name in ('CLS', 'INP', 'LCP') AND
      _TABLE_SUFFIX BETWEEN FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 28 DAY)) AND FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 1 DAY))
  ) WHERE is_last_received_value
)
# Main query logic
SELECT
  ROUND((SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = "metric_value"), 3) AS metric_value,
FROM web_vitals_events
WHERE metric_name = 'LCP'
ORDER BY metric_value DESC
# Subquery all Web Vitals events from the last 28 days
WITH web_vitals_events AS (
  SELECT event_name as metric_name, * EXCEPT(event_name, is_last_received_value) FROM (
    SELECT *, IF (ROW_NUMBER() OVER (
      PARTITION BY (SELECT value.string_value FROM UNNEST(event_params) WHERE key = 'metric_id')
      ORDER BY (SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = 'metric_value') DESC
    ) = 1, true, false) AS is_last_received_value
    FROM `bigquery_project_id.analytics_XXXXX.events_*`
    WHERE event_name in ('CLS', 'INP', 'LCP') AND
      _TABLE_SUFFIX BETWEEN FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 28 DAY)) AND FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 1 DAY))
  ) WHERE is_last_received_value
)
# Main query logic
SELECT
  page_path,
  APPROX_QUANTILES(metric_value, 100)[OFFSET(75)] AS LCP,
  COUNT(1) as count
FROM (
  SELECT
    REGEXP_SUBSTR((SELECT value.string_value FROM UNNEST(event_params) WHERE key = "page_location"), r'\.com(\/[^?]*)') AS page_path,
    ROUND((SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = "metric_value"), 3) AS metric_value,
  FROM web_vitals_events
  WHERE metric_name = 'LCP'
)
GROUP BY 1
ORDER BY count DESC
LIMIT 10

หน้า 10 อันดับแรกที่มี CLS แย่ที่สุด (P75)

# Subquery all Web Vitals events from the last 28 days
WITH web_vitals_events AS (
  SELECT event_name as metric_name, * EXCEPT(event_name, is_last_received_value) FROM (
    SELECT *, IF (ROW_NUMBER() OVER (
      PARTITION BY (SELECT value.string_value FROM UNNEST(event_params) WHERE key = 'metric_id')
      ORDER BY (SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = 'metric_value') DESC
    ) = 1, true, false) AS is_last_received_value
    FROM `bigquery_project_id.analytics_XXXXX.events_*`
    WHERE event_name in ('CLS', 'INP', 'LCP') AND
      _TABLE_SUFFIX BETWEEN FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 28 DAY)) AND FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 1 DAY))
  ) WHERE is_last_received_value
)
# Main query logic
SELECT
  page_path,
  APPROX_QUANTILES(metric_value, 100)[OFFSET(75)] AS CLS,
  COUNT(1) as count
FROM (
  SELECT
    REGEXP_SUBSTR((SELECT value.string_value FROM UNNEST(event_params) WHERE key = "page_location"), r'\.com(\/[^?]*)') AS page_path,
    ROUND((SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = "metric_value"), 3) AS metric_value,
  FROM web_vitals_events
  WHERE metric_name = 'CLS'
)
GROUP BY 1
HAVING count > 50 # Limit to relatively popular pages
ORDER BY CLS DESC
LIMIT 10

แก้ไขข้อบกพร่อง

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

การทราบว่าคะแนนใดจะไม่มีประโยชน์หากดำเนินการไม่ได้ และแก้ไขปัญหา

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

ตัวอย่างคำค้นหา

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

องค์ประกอบยอดนิยมที่ทำให้เกิด CLS

debug_target เป็นสตริงตัวเลือก CSS ที่สอดคล้องกับองค์ประกอบใน ซึ่งเป็นหน้าเว็บที่เกี่ยวข้องกับค่าเมตริกมากที่สุด

เมื่อใช้ CLS ค่า debug_target จะหมายถึงองค์ประกอบที่ใหญ่ที่สุดจากองค์ประกอบที่ใหญ่ที่สุด การเปลี่ยนเลย์เอาต์ที่ส่งผลต่อค่า CLS หากไม่มีองค์ประกอบใดเปลี่ยน ค่า debug_target จะเป็น null

ข้อความค้นหาต่อไปนี้จะแสดงหน้าเว็บจากแย่ที่สุดไปจนถึงดีที่สุดโดยพิจารณาตาม CLS ที่ 75 เปอร์เซ็นไทล์ที่จัดกลุ่มตาม debug_target:

# Subquery all Web Vitals events from the last 28 days
WITH web_vitals_events AS (
  SELECT event_name as metric_name, * EXCEPT(event_name, is_last_received_value) FROM (
    SELECT *, IF (ROW_NUMBER() OVER (
      PARTITION BY (SELECT value.string_value FROM UNNEST(event_params) WHERE key = 'metric_id')
      ORDER BY (SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = 'metric_value') DESC
    ) = 1, true, false) AS is_last_received_value
    FROM `bigquery_project_id.analytics_XXXXX.events_*`
    WHERE event_name in ('CLS', 'INP', 'LCP') AND
      _TABLE_SUFFIX BETWEEN FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 28 DAY)) AND FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 1 DAY))
  ) WHERE is_last_received_value
)
# Main query logic
SELECT
  page_path,
  debug_target,
  APPROX_QUANTILES(metric_value, 100)[OFFSET(75)] AS CLS,
  COUNT(1) as count
FROM (
  SELECT
    REGEXP_SUBSTR((SELECT value.string_value FROM UNNEST(event_params) WHERE key = "page_location"), r'\.com(\/[^?]*)') AS page_path,
    (SELECT value.string_value FROM UNNEST(event_params) WHERE key = "debug_target") as debug_target,
    ROUND((SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = "metric_value"), 3) AS metric_value,
    *
  FROM web_vitals_events
  WHERE metric_name = 'CLS'
)
GROUP BY 1, 2
HAVING count > 50 # Limit to relatively popular pages
ORDER BY CLS DESC

ผลการค้นหาองค์ประกอบยอดนิยมที่มีส่วนทำให้เกิด CLS

การรู้ว่าองค์ประกอบใดในหน้าเว็บมีการเปลี่ยนแปลงจะช่วยให้ ระบุและแก้ไขสาเหตุของปัญหา

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

แก้ไขข้อบกพร่องของเมตริกอื่นๆ

การค้นหาก่อนหน้าจะแสดงผลลัพธ์สำหรับเมตริก CLS แต่ผลลัพธ์จะเหมือนกันทั้งหมด สามารถใช้เพื่อรายงานเกี่ยวกับเป้าหมายการแก้ไขข้อบกพร่องสำหรับ LCP และ INP เพียงแค่ แทนที่คำสั่ง where ด้วยเมตริกที่เกี่ยวข้องเพื่อแก้ไขข้อบกพร่อง ดังนี้

WHERE metric_name = 'INP'
WHERE metric_name = 'LCP'

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

แสดงด้วยภาพ

การรับข้อมูลเชิงลึกเพียงดูผลการค้นหาอาจทำได้ยาก โดดเดี่ยว ตัวอย่างเช่น คำค้นหาต่อไปนี้แสดงค่าเปอร์เซ็นไทล์ที่ 75 รายวันสำหรับ LCP ในชุดข้อมูล

# Subquery all Web Vitals events from the last 28 days
WITH web_vitals_events AS (
  SELECT event_name as metric_name, * EXCEPT(event_name, is_last_received_value) FROM (
    SELECT *, IF (ROW_NUMBER() OVER (
      PARTITION BY (SELECT value.string_value FROM UNNEST(event_params) WHERE key = 'metric_id')
      ORDER BY (SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = 'metric_value') DESC
    ) = 1, true, false) AS is_last_received_value
    FROM `bigquery_project_id.analytics_XXXXX.events_*`
    WHERE event_name in ('CLS', 'INP', 'LCP') AND
      _TABLE_SUFFIX BETWEEN FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 28 DAY)) AND FORMAT_DATE('%Y%m%d', DATE_SUB(CURRENT_DATE, INTERVAL 1 DAY))
  ) WHERE is_last_received_value
)
# Main query logic
SELECT
  event_date,
  metric_name,
  APPROX_QUANTILES(ROUND(metric_value, 2), 100)[OFFSET(75)] AS p75
FROM
  (
    SELECT
      event_date,
      metric_name,
      ROUND((SELECT COALESCE(value.double_value, value.int_value) FROM UNNEST(event_params) WHERE key = 'metric_value'), 3) AS metric_value
    FROM web_vitals_events
    WHERE
      metric_name = 'LCP'
  )
GROUP BY
  1, 2
ORDER BY event_date

จากผลการค้นหาเหล่านี้ การระบุแนวโน้มหรือค่าผิดปกติเพียงแค่ ขณะดูข้อมูล

ผลการค้นหาค่าเมตริกรายวัน

ในกรณีเช่นนี้ การแสดงภาพข้อมูลจะช่วยให้คุณได้รับข้อมูลเชิงลึกเร็วขึ้น

แสดงภาพผลการค้นหาใน Looker Studio

BigQuery ช่วยให้คุณแสดงผลการค้นหาผ่าน "ข้อมูล" ได้อย่างรวดเร็ว Studio Looker Studio คือการแสดงข้อมูลผ่านภาพ และเครื่องมือแดชบอร์ดที่ ใช้งานได้ฟรี หากต้องการแสดงภาพผลการค้นหา หลังจากเรียกใช้การค้นหาใน BigQuery UI ให้คลิกปุ่มสำรวจข้อมูล และ เลือกสํารวจด้วย Looker Studio

สํารวจด้วยตัวเลือก Looker Studio ใน BigQuery

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

แผนภูมิเส้นของค่า LCP รายวันใน Looker Studio

การลิงก์โดยตรงระหว่าง BigQuery และ Looker Studio นี้จะช่วยให้คุณสร้าง แผนภูมิจากข้อความค้นหาใดก็ได้ และทำการวิเคราะห์ด้วยภาพ แต่หากต้องการ ทำการวิเคราะห์เพิ่มเติม คุณอาจต้องการดูแผนภูมิต่างๆ ใน แดชบอร์ดแบบอินเทอร์แอกทีฟเพื่อดูมุมมองแบบองค์รวมมากขึ้นหรือเพื่อให้เจาะลึก ลงในข้อมูลด้วย การมีแดชบอร์ดที่มีประโยชน์ทำให้คุณไม่ต้องเขียนคำค้นหา และสร้างแผนภูมิด้วยตนเองทุกครั้งที่คุณต้องการวิเคราะห์เมตริก

คุณสร้างแดชบอร์ดใน Looker Studio ได้โดยใช้ BigQuery เนทีฟ Connector โดยดำเนินการดังนี้ ไปที่ datastudio.google.com แล้วสร้าง แหล่งข้อมูล เลือกเครื่องมือเชื่อมต่อ BigQuery แล้วเลือกชุดข้อมูลที่ต้องการ ทำงานร่วมกับ

การใช้เครื่องมือเชื่อมต่อเริ่มต้นของ BigQuery ใน Looker Studio

ทำให้ข้อมูล Web Vitals เป็นรูปธรรม

เมื่อสร้างแดชบอร์ดของข้อมูลเหตุการณ์ Web Vitals ตามที่อธิบายไว้ก่อนหน้านี้ ไม่มีประสิทธิภาพในการใช้ชุดข้อมูลการส่งออกของ Google Analytics 4 โดยตรง เนื่องจาก โครงสร้างของข้อมูล GA4 และการประมวลผลล่วงหน้าที่จำเป็นสำหรับ Web Vitals บางส่วนในการสืบค้นของคุณจะทำงานหลายครั้ง การดำเนินการนี้จะสร้าง ปัญหาสองประการคือ ประสิทธิภาพของหน้าแดชบอร์ดและค่าใช้จ่ายของ BigQuery

คุณสามารถใช้แซนด์บ็อกซ์ของ BigQuery โดยไม่มีค่าใช้จ่าย ด้วย BigQuery ระดับการใช้งานฟรี ข้อมูลข้อความค้นหาที่ประมวลผลแล้ว 1 TB แรกต่อเดือนใช้งานได้ฟรี สำหรับวิธีการวิเคราะห์ ที่กล่าวถึงในโพสต์นี้ เว้นแต่คุณจะใช้ชุดข้อมูลขนาดใหญ่มาก หรือ กำลังค้นหาชุดข้อมูลอย่างหนักเป็นประจำ คุณควรสามารถอยู่ใน ขีดจำกัดฟรีนี้ทุกเดือน แต่หากคุณมีเว็บไซต์ที่มีการเข้าชมสูงและอยาก ติดตามตรวจสอบเมตริกต่างๆ เป็นประจำโดยใช้ หน้าแดชบอร์ดแบบอินเทอร์แอกทีฟที่รวดเร็ว แนะนำให้ประมวลผลล่วงหน้าและแปลงข้อมูลสัญญาณของ Web Vitals ขณะที่ใช้ประโยชน์จาก ฟีเจอร์ประสิทธิภาพของ BigQuery เช่น การแบ่งพาร์ติชัน คลัสเตอร์ และการแคช

สคริปต์ต่อไปนี้จะประมวลผลข้อมูล BigQuery ล่วงหน้า (ตารางแหล่งที่มา) และ สร้างตารางที่เป็นรูปธรรม (ตารางเป้าหมาย) เมื่อใช้คำค้นหานี้ คุณอาจต้องกำหนดช่วงวันที่สำหรับตารางแหล่งที่มาด้วย จะลดปริมาณข้อมูลที่ประมวลผลแล้ว

# Materialize Web Vitals metrics from GA4 event export data

# Replace target table name
CREATE OR REPLACE TABLE bigquery_project_id.ga4_demo_dev.web_vitals_summary
  PARTITION BY DATE(event_timestamp)
  CLUSTER BY metric_name
AS
SELECT
  ga_session_id,
  IF(
    EXISTS(SELECT 1 FROM UNNEST(events) AS e WHERE e.event_name = 'first_visit'),
    'New user',
    'Returning user') AS user_type,
  IF(
    (SELECT MAX(session_engaged) FROM UNNEST(events)) > 0, 'Engaged', 'Not engaged')
    AS session_engagement,
  evt.* EXCEPT (session_engaged, event_name),
  event_name AS metric_name,
  FORMAT_TIMESTAMP('%Y%m%d', event_timestamp) AS event_date
FROM
  (
    SELECT
      ga_session_id,
      ARRAY_AGG(custom_event) AS events
    FROM
      (
        SELECT
          ga_session_id,
          STRUCT(
            country,
            device_category,
            device_os,
            traffic_medium,
            traffic_name,
            traffic_source,
            page_path,
            debug_target,
            event_timestamp,
            event_name,
            metric_id,
            IF(event_name = 'LCP', metric_value / 1000, metric_value) AS metric_value,
            user_pseudo_id,
            session_engaged,
            session_revenue) AS custom_event
        FROM
          (
            SELECT
              (SELECT value.int_value FROM UNNEST(event_params) WHERE key = 'ga_session_id')
                AS ga_session_id,
              (SELECT value.string_value FROM UNNEST(event_params) WHERE key = 'metric_id')
                AS metric_id,
              ANY_VALUE(device.category) AS device_category,
              ANY_VALUE(device.operating_system) AS device_os,
              ANY_VALUE(traffic_source.medium) AS traffic_medium,
              ANY_VALUE(traffic_source.name) AS traffic_name,
              ANY_VALUE(traffic_source.source) AS traffic_source,
              ANY_VALUE(
                REGEXP_SUBSTR(
                  (SELECT value.string_value FROM UNNEST(event_params) WHERE key = 'page_location'),
                  r'^[^?]+')) AS page_path,
              ANY_VALUE(
                (SELECT value.string_value FROM UNNEST(event_params) WHERE key = 'debug_target'))
                AS debug_target,
              ANY_VALUE(user_pseudo_id) AS user_pseudo_id,
              ANY_VALUE(geo.country) AS country,
              ANY_VALUE(event_name) AS event_name,
              SUM(ecommerce.purchase_revenue) AS session_revenue,
              MAX(
                (
                  SELECT
                    COALESCE(
                      value.double_value, value.int_value, CAST(value.string_value AS NUMERIC))
                  FROM UNNEST(event_params)
                  WHERE key = 'session_engaged'
                )) AS session_engaged,
              TIMESTAMP_MICROS(MAX(event_timestamp)) AS event_timestamp,
              MAX(
                (
                  SELECT COALESCE(value.double_value, value.int_value)
                  FROM UNNEST(event_params)
                  WHERE key = 'metric_value'
                )) AS metric_value,
            FROM
              # Replace source table name
              `bigquery_project_id.analytics_XXXXX.events_*`
            WHERE
              event_name IN ('LCP', 'INP', 'CLS', 'first_visit', 'purchase')
            GROUP BY
              1, 2
          )
      )
    WHERE
      ga_session_id IS NOT NULL
    GROUP BY ga_session_id
  )
CROSS JOIN UNNEST(events) AS evt
WHERE evt.event_name NOT IN ('first_visit', 'purchase');

ชุดข้อมูลที่เป็นรูปธรรมนี้มีข้อดีหลายประการ ดังนี้

  • โครงสร้างข้อมูลจะลดความซับซ้อนและง่ายต่อการค้นหา
  • โดยจะเก็บไว้เฉพาะเหตุการณ์ Web Vitals จากชุดข้อมูล GA4 เดิมเท่านั้น
  • รหัสเซสชัน ประเภทผู้ใช้ (ผู้ใช้ใหม่เทียบกับผู้ใช้ที่กลับมา) และข้อมูลการมีส่วนร่วมในเซสชัน จะใช้ในคอลัมน์ได้โดยตรง
  • ตารางคือ แบ่งพาร์ติชันตาม วันที่และจัดกลุ่ม ตามชื่อเมตริก วิธีนี้มักจะลดจำนวนข้อมูลที่ประมวลผลสำหรับแต่ละ คำถาม
  • เนื่องจากไม่จำเป็นต้องใช้ไวลด์การ์ดในการค้นหาตารางนี้ ผลการค้นหาจึงอาจ ถูกแคชเป็นเวลาสูงสุด 24 ชั่วโมง วิธีนี้จะช่วยลดค่าใช้จ่ายไม่ให้เกิดซ้ำ คำถาม
  • หากใช้ BigQuery BI Engine คุณจะเรียกใช้ฟังก์ชัน SQL ที่เพิ่มประสิทธิภาพและ โอเปอเรเตอร์ในเรื่องนี้

คุณค้นหาตารางที่เป็นรูปธรรมนี้ได้โดยตรงจากภายใน BigQuery UI หรือใช้ตารางดังกล่าว ใน Looker Studio โดยใช้เครื่องมือเชื่อมต่อ BigQuery

ใช้เครื่องมือเชื่อมต่อ Web Vitals

เนื่องจากการสร้างแดชบอร์ดใหม่ตั้งแต่ต้นนั้นใช้เวลานาน เราจึงพัฒนาแพ็กเกจ ที่จะสร้างแดชบอร์ดเทมเพลตสำหรับคุณ ก่อนอื่นต้องแน่ใจว่าคุณ ทำให้ตาราง Web Vitals ของคุณเป็นรูปธรรมโดยใช้คำค้นหาก่อนหน้า จากนั้นเข้าถึง เครื่องมือเชื่อมต่อ Web Vitals สำหรับ Looker Studio ที่ใช้ลิงก์นี้ goo.gle/web-vitals-connector

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

หน้าจอการให้สิทธิ์เครื่องมือเชื่อมต่อ Web Vitals

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

เมื่อไปยังส่วนต่างๆ ของแดชบอร์ด คุณจะดูแนวโน้มรายวันของ Web Vitals ได้ และข้อมูลการใช้งานบางอย่างสำหรับเว็บไซต์ เช่น ผู้ใช้และเซสชัน ได้ใน ในแท็บสรุป

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

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

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

การใช้งานขั้นสูง

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

  • ตั้งค่าการค้นหาตามกำหนดการใน BigQuery เพื่อรับข้อมูลที่อัปเดต การนำไปใช้เป็นรูปธรรม คำค้นหาที่เราเรียกใช้ก่อนหน้านี้จะบันทึกเฉพาะข้อมูลของคุณในขณะนั้นเท่านั้น หากคุณ เพื่ออัปเดตแดชบอร์ดด้วยข้อมูลใหม่อยู่เสมอ คุณสามารถเรียกใช้ ที่จะทำงานทุกวันและต่อท้ายตารางที่เป็นรูปธรรมด้วยแอตทริบิวต์
  • รวมข้อมูลจากบุคคลที่หนึ่ง (เช่น CRM) สำหรับข้อมูลเชิงลึกทางธุรกิจ ในเอกสาร ตาราง คุณสามารถเพิ่ม user_id เป็นคอลัมน์แยกต่างหากได้ ซึ่งจะช่วยให้คุณเข้าร่วม ข้อมูลจากบุคคลที่หนึ่ง หากข้อมูลจากบุคคลที่หนึ่งยังไม่ได้อยู่ใน BigQuery คุณจะทําสิ่งต่อไปนี้ได้ โหลดข้อมูล หรือ ใช้ข้อมูลแบบรวมศูนย์ แหล่งที่มา
  • รายงานเวอร์ชันเว็บไซต์หรือแอปเป็นพารามิเตอร์ในข้อมูลที่คุณส่งให้ Google Analytics และเพิ่มเป็นคอลัมน์ในตารางที่เป็นรูปธรรม จากนั้นคุณจะเพิ่ม ข้อมูลเวอร์ชันดังกล่าวเป็นมิติข้อมูลในแผนภูมิเพื่อให้ดูได้ง่ายขึ้น การเปลี่ยนแปลงของเวอร์ชันจะส่งผลต่อประสิทธิภาพ
  • หากคุณคาดว่าจะมีการใช้งานชุดข้อมูลเป็นจำนวนมากผ่านทาง หรือหน้าแดชบอร์ด คุณก็สามารถลองใช้ BigQuery BI เวอร์ชันที่เสียค่าใช้จ่ายได้ เครื่องมือ

สรุป

โพสต์นี้กล่าวถึงพื้นฐานเกี่ยวกับวิธีใช้ Google Analytics 4 และ BigQuery เพื่อ วัดผลและแก้ไขข้อบกพร่องประสิทธิภาพด้วยข้อมูลผู้ใช้จริงที่รวบรวมมาจากภาคสนาม ทั้งนี้ ยังอธิบายถึงวิธีสร้างแดชบอร์ดและรายงานอัตโนมัติโดยใช้ Looker Studio ด้วย และเครื่องมือเชื่อมต่อ Web Vitals เพื่อ การแสดงข้อมูลเป็นภาพให้ง่ายที่สุดเท่าที่จะทำได้

สรุปประเด็นสำคัญจากโพสต์นี้

  • การวัดประสิทธิภาพด้วยข้อมูลผู้ใช้จริง เป็นสิ่งสำคัญในการทำความเข้าใจ การแก้ไขข้อบกพร่องและการเพิ่มประสิทธิภาพเว็บไซต์
  • คุณจะได้รับข้อมูลเชิงลึกที่ละเอียดยิ่งขึ้นเมื่อเมตริกประสิทธิภาพและธุรกิจ อยู่ในระบบเดียวกัน Google Analytics และ BigQuery ทำให้สิ่งนี้ เท่าที่จะเป็นไปได้
  • การส่งออกข้อมูลดิบของ Google Analytics ใน BigQuery ช่วยให้คุณมีศักยภาพที่ไม่จำกัดสำหรับ การวิเคราะห์ที่กำหนดเองในเชิงลึกโดยใช้ภาษาการค้นหาที่คุณน่าจะรู้จักอยู่แล้ว
  • Google มี API และเครื่องมือแสดงข้อมูลเป็นภาพ เช่น Looker Studio คุณมีอิสระในการสร้างรายงานในแบบที่คุณต้องการ สร้าง