เพิ่มแท็กสคริปต์เริ่มต้นและสิ้นสุดในพื้นที่ส่วนหัวของหน้าเว็บ (หลังแท็กเริ่มต้น แต่ก่อนแท็กสิ้นสุด) เช่น
เพิ่มโค้ดต่อไปนี้ระหว่างแท็กสคริปต์เริ่มต้นและแท็กสิ้นสุด โดยแทนที่ "myimage.jpg" ด้วยชื่อไฟล์ของรูปภาพที่คุณต้องการใช้สำหรับการทดสอบความเร็ว ส่วน "?n=" + Math.random() ของที่อยู่ที่สร้างขึ้นและกำหนดให้กับ imageAddr จะหลอกให้เว็บเบราว์เซอร์ดึงภาพทุกครั้งแทนที่จะใช้เวอร์ชันแคชในเครื่อง ใช้รูปภาพที่มีขนาดไฟล์ประมาณ 200 กิโลไบต์
เพิ่มโค้ดต่อไปนี้ในบรรทัดถัดไปของสคริปต์เพื่อสร้างตัวแปรเพื่อจัดเก็บเวลาเริ่มต้น เวลาสิ้นสุด และขนาดการดาวน์โหลดของการทดสอบ ตั้งค่า "downloadSize" เป็นขนาดของไฟล์ภาพเป็นไบต์
เพิ่มรหัสต่อไปนี้เพื่อตั้งค่าภาพที่จะดาวน์โหลดสำหรับการทดสอบ "ดาวน์โหลด" ถูกตั้งค่าเป็นวัตถุรูปภาพ การดำเนินการเพื่อจับภาพจุดสิ้นสุดของการดาวน์โหลดถูกกำหนดให้เปิดใช้งานเมื่อการดาวน์โหลดภาพเสร็จสิ้น
เพิ่มฟังก์ชันต่อไปนี้ในสคริปต์ที่คำนวณโดยแสดงผลการทดสอบความเร็ว ขั้นแรกจะคำนวณระยะเวลาโดยแปลงมิลลิวินาทีเป็นวินาที จากนั้นจะแปลงขนาดการดาวน์โหลดเป็นบิต คำนวณความเร็วในการดาวน์โหลด และแปลงความเร็วเป็น kbps และ Mbps ในที่สุดก็ปรากฏกล่องข้อความพร้อมผลลัพธ์
ฟังก์ชั่น showResults () { ระยะเวลา var = Math.round ((endTime - startTime) / 1000); var bitsLoaded = downloadSize * 8 GO var speedBps = Math.round (bitsLoaded / ระยะเวลา) GO var speedKbps = (speedBps / 1024).toFixed (2) GO var speedMbps = (speedKbps / 1024).toFixed (2) GO alert ("ความเร็วในการเชื่อมต่อของคุณคือ: \n" + speedBps + " bps\n" + speedKbps + " kbps\n" + speedMbps + " Mbps\n") GO }
เปิดหน้าในเบราว์เซอร์ของคุณและทดสอบเพื่อให้แน่ใจว่าสคริปต์ทำงานอย่างถูกต้อง อาจใช้เวลาสองสามวินาทีก่อนที่กล่องข้อความจะปรากฏขึ้นพร้อมกับผลการทดสอบ
เคล็ดลับ
JavaScript วัดความเร็วระหว่างคอมพิวเตอร์ที่ดูหน้าเว็บและไซต์ที่โฮสต์รูปภาพที่ใช้สำหรับการทดสอบ หากคุณกำลังทดสอบการเชื่อมต่อกับเว็บไซต์ของคุณเอง ให้โฮสต์ภาพนั้นบนเว็บไซต์ของคุณเอง ทดสอบความเร็วการเชื่อมต่อทั่วไปโดยระบุที่อยู่ให้กับภาพที่โฮสต์บนไซต์ที่มีแบนด์วิดท์และความเร็วมากมาย เช่น flickr หรือ Amazon