8 คะแนน โดย xguru 2020-08-27 | 3 ความคิดเห็น | แชร์ทาง WhatsApp
  • Core Web Vitals : ตัวชี้วัดประสิทธิภาพของหน้าเว็บจาก Google
  • ลงทะเบียนหลายเว็บไซต์ไว้ใน Google Sheets แล้วให้รันอัตโนมัติวันละครั้งเพื่อบันทึกค่าตัวชี้วัดและแสดงเป็นกราฟ
  • วัดค่า FCP, FID, LCP, CLS, TTI ของหน้าเดสก์ท็อป/มือถือได้ทั้งหมด
  1. คัดลอกชีตนี้
  2. กรอก URL ที่จะวัดความเร็วหน้าแรกและชื่อชีต
  3. เปลี่ยนชื่อชีตให้เหมาะสม
  4. กด Track Web Vitals เพื่อเริ่มวัด และระบบจะวัดอัตโนมัติวันละครั้งพร้อมบันทึกผลไว้

3 ความคิดเห็น

 
xguru 2020-08-27

ดูจากโค้ดแล้ว ภายในจะวัดผลผ่าน Google PageSpeedOnline ก่อน แล้วค่อย parse รายละเอียดนั้นไปบันทึกลงใน Google ชีตครับ

ตอนลงทะเบียนครั้งแรกจะมีคำเตือนด้านความปลอดภัยขึ้นมา แต่ถ้าดูซอร์สโค้ดก็จะทราบว่าเป็นโค้ดที่ไม่มีปัญหาด้านความปลอดภัยครับ

https://github.com/labnol/code/…

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

 
xguru 2020-08-27

function sendEmail() {

var sheets = SpreadsheetApp.getActiveSpreadsheet().getSheets();

for (var i = 0; i < sheets.length ; i++ ) {

var sheet = sheets[i];

var dataRange = sheet.getDataRange()

var cwvRange = sheet.getRange(2,1,dataRange.getLastRow()-1,dataRange.getLastColumn());

var numRows = cwvRange.getNumRows();

var numCols = cwvRange.getNumColumns();

var message = "ค่า CWT";

for (var i = 0; i < numRows; i++) {

for (var j = 0; j < numCols; j++) {

    message = message + cwvRange.getValues()[i][j]  + " | "

}

message = message + "\r\n"

}

}

MailApp.sendEmail("email@server", "Core Web Vitals ประจำสัปดาห์นี้", message);

}

 
xguru 2020-08-27

Google นำตัวชี้วัด Page Experience มาใช้กับอันดับผลการค้นหา https://th.news.hada.io/topic?id=2197

  • Core Web Vitals

→ LCP : Largest Contentful Paint

→ FID : First Input Delay

→ CLS : Cumulative Layout Shift

Lighthouse 6.0 เปิดตัว https://th.news.hada.io/topic?id=2122

→ เพิ่มเมตริก LCP,CLS,TBT

Cumulative Layout Shift (CLS) คืออะไร? https://th.news.hada.io/topic?id=1697

→ วัดว่าเลย์เอาต์ของหน้าเว็บเปลี่ยนแปลงไปมากแค่ไหนจากการโหลดรูปภาพ/โฆษณาที่ช้า การทำงานแบบอะซิงก์ และการเปลี่ยน DOM แบบไดนามิก เป็นต้น

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