ให้เรตสมาชิก: 3 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

บทที่ 13 HTML5 Web Worker
   Web Worker คือ JavaScript ที่สามารถทำให้ script ทำงานหลายๆอย่างพร้อมกันได้ ซึ่งทำให้ผู้ใช้งานเว็บเพจได้ โดยไม่ต้องรอให้ JavaScript ทำงานเสร็จก่อน โดย web worker จะสั่งให้ JavaScript ทำงานโดยไม่กระทบกับงานอื่นๆ ด้วยเหตุนี้ ผู้พัฒนาจึงสามารถออกแบบหน้าเว็บไซต์ให้มีความซับซ้อนมากๆ ได้โดยไม่ต้องกังวลว่า เครื่องพีซีของผู้ใช้จะเกิดการสะดุดขณะที่มีการเลื่อนหน้าหรือเกิดการหน่วง ขณะที่กำลังมีการป้อนข้อมูลเหมือนอย่างเช่นในอดีต
   Web Worker ทำงานได้ดีกับทุกweb browser ยกเว้น IE  Internet Explorer ต้องเป็นเวอร์ชั่น 10 ขึ้นไป
ตัวอย่างเช่น

<html>
<body>
<p>Count numbers: <output id="result"></output></p>
<button onclick="startWorker()">Start Worker</button> 
<button onclick="stopWorker()">Stop Worker</button>
<br><br>

<script>
var w;

function startWorker()
{if(typeof(Worker)!=="undefined")
  {  if(typeof(w)=="undefined")
  {  w=new Worker("demo_workers.js");  }
  w.onmessage = function (event) 
{    document.getElementById("result").innerHTML=event.data;    };  }
else
  {  document.getElementById("result").innerHTML="Sorry, your browser does not support Web Workers...";  }}
function stopWorker()
{ w.terminate();}
</script>
</body>
</html

คลิกเพื่อดูตัวอย่าง HTML5 Web Worker

คำอธิบาย
1.สำหรับตรวจสอบว่า web worker สามารถใช้กับบราวเซอร์ได้หรือไม่

if(typeof(Worker)!=="undefined")
  {  // Yes! Web worker support!
  // Some code.....  }
else
  {  // Sorry! No Web Worker support..  }

2.สำหรับสร้างไฟล์ web worker บน external JavaScript
เช่นในตัวอย่างนี้คือการสร้างสคริปต์ให้นับ โดยค่อยๆเพิ่มๆทีละ 1 ซึ่งสคริปต์นี้จะบรรจุอยู่ในเดียวกับ "demo_workers.js" file:
***ตัวอย่างนี้ไม่สามารถดใช้ได้หากไม่สร้าง ไฟล์ "demo_workers.js" file: เสียก่อน

var i=0;
function timedCount()
{i=i+1;
postMessage(i);
setTimeout("timedCount()",500);}
timedCount();

3.สำหรับสร้าง web worker object และรันโค๊ดบน "demo_workers.js":

if(typeof(w)=="undefined")
  {  w=new Worker("demo_workers.js");  } เราสามารถส่งและรับข้อความจาก web worker ด้วยการเพิ่ม "onmessage"
w.onmessage=function(event){
document.getElementById("result").innerHTML=event.data;};

4.สำหรับสร้าง terminate web worker (ตัวหยุดการทำงานของสคริปต์ที่กำลังรันอยู่บนหน้าเว็บไซต์)

w.terminate();


ข้อมูลอ้างอิง
http://www.w3schools.com

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
MOD_MTB_NEWS_RECENT
Joomla 3.8 มาแล้ว
โดย mindphp อ 19 ก.ย. 2017 9:14 pm บอร์ด PHP News
0
5
อ 19 ก.ย. 2017 9:14 pm โดย mindphp
สถานะสถานพยาบาลที่เข้าร่วมประกันสังคม 2560 อัพเดทล่าสุด
โดย thatsawan อ 19 ก.ย. 2017 11:32 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
11
อ 19 ก.ย. 2017 11:32 am โดย thatsawan
ทุกปัญหาใหญ่สำหรับ "User" เสมอ!!
โดย Before Dong อ 19 ก.ย. 2017 10:16 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
19
อ 19 ก.ย. 2017 10:16 am โดย Before Dong
เจอ Process ไม่พึงประสงค์ ผังและรัน ภายใต้ /tmp
โดย mindphp อ 19 ก.ย. 2017 7:52 am บอร์ด Linux - Web Server
0
8
อ 19 ก.ย. 2017 7:52 am โดย mindphp
ใครใช้ CCleaner เวอร์ชั่นเก่า อัพเกรดด่วน ให้ใหม่กว่า เวอร์ชัน 5.33
โดย mindphp อ 19 ก.ย. 2017 5:29 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
0
12
อ 19 ก.ย. 2017 5:29 am โดย mindphp
facebook มันมันบังคับให้ตั้งชื่อใหม่ ให้เป็นชื่อจริงๆ
โดย บุคคลทั่วไป อ 19 ก.ย. 2017 5:18 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
0
9
อ 19 ก.ย. 2017 5:18 am โดย บุคคลทั่วไป
สอบถามการประยุกต์ใช้คำสั่ง rect()
โดย Ik Kat จ 18 ก.ย. 2017 6:00 pm บอร์ด JavaScript & Jquery Ajax
0
15
จ 18 ก.ย. 2017 6:00 pm โดย Ik Kat
วิธีแก้ปัญหา Can't create/write to file '/tmp/#sql_6182_0.MAI' (Errcode: 2)
โดย mindphp จ 18 ก.ย. 2017 3:40 pm บอร์ด Linux - Web Server
0
10
จ 18 ก.ย. 2017 3:40 pm โดย mindphp
ทำ pop up ให้ login wordpress
โดย บุคคลทั่วไป จ 18 ก.ย. 2017 1:26 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS CRM
0
16
จ 18 ก.ย. 2017 1:26 pm โดย บุคคลทั่วไป
ธุรกิจกระเป๋าเงินอิเล็กทรอนิกส์ หรือ e-Money คืออะไร
โดย M029 จ 18 ก.ย. 2017 11:46 am บอร์ด ถาม - ตอบ ธุรกิจ กฏหมาย ภาษี บัญชี
0
14
จ 18 ก.ย. 2017 11:46 am โดย M029
สร้างฟอร์มรับข้อมูล แล้วส่งไปเก็บที่ phpmyadmin
โดย บุคคลทั่วไป จ 18 ก.ย. 2017 11:31 am บอร์ด Programming - PHP
0
15
จ 18 ก.ย. 2017 11:31 am โดย บุคคลทั่วไป
อยากจะเช็คเงื่อนไขไม่ให้เกิด error แบบนี้ EntityRef: expecting ';', ทำยังไงได้บ้างค่ะ
โดย thatsawan จ 18 ก.ย. 2017 11:28 am บอร์ด Programming - C/C++ & java & Python
4
30
จ 18 ก.ย. 2017 11:28 am โดย mindphp
ขั้นตอนที่ SA คิด ขั้นตอนที่ Programmer ทำ
โดย Before Dong จ 18 ก.ย. 2017 10:25 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
28
จ 18 ก.ย. 2017 10:25 am โดย P'Eak
selenium python คำสั่ง ใช้สำหรับ การค้นหา Elements บนหน้าเว็บ
โดย mindphp อ 17 ก.ย. 2017 4:53 am บอร์ด Python Knowledge
0
16
อ 17 ก.ย. 2017 4:53 am โดย mindphp
ตั้งค่า MX ของ mailgun เสริมจากบทความ
โดย mindphp ส 16 ก.ย. 2017 9:17 pm บอร์ด Linux - Web Server
1
14
ส 16 ก.ย. 2017 9:17 pm โดย P'Eak
อยากได้แบตเครื่องเล่น sony walkman ยังมีขายที่ไหนบ้างค่ะ
โดย thatsawan ส 16 ก.ย. 2017 7:39 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
2
23
ส 16 ก.ย. 2017 7:39 pm โดย P'Eak
อยากทราบวิธีดึง Logo จากไฟล์ใน Joomla ครับ
โดย Before Dong ส 16 ก.ย. 2017 10:57 am บอร์ด Joomla Development
5
45
ส 16 ก.ย. 2017 1:42 pm โดย thatsawan
อยากทราบวิธีดึงข้อมูลสี จาก CodeHTML เป็นดึงจากตัวแปล ใน Joomla
โดย Before Dong ส 16 ก.ย. 2017 10:54 am บอร์ด Joomla Development
2
31
ส 16 ก.ย. 2017 1:38 pm โดย mindphp
การ select (ซีเลคท) ในฐานข้อมูล PostgreSQL (โพสต์เกรสคิวเอล) แบบใช้โค้ด SQL (เอส คิว แอล)
โดย natnicha001 ส 16 ก.ย. 2017 1:18 pm บอร์ด SQL Knowledge
0
14
ส 16 ก.ย. 2017 1:18 pm โดย natnicha001
การ select (ซีเลคท) ในฐานข้อมูล PostgreSQL (โพสต์เกรสคิวเอล) โดยเลือกเพียงบางคอลัมน์
โดย natnicha001 ส 16 ก.ย. 2017 1:11 pm บอร์ด SQL Knowledge
0
10
ส 16 ก.ย. 2017 1:11 pm โดย natnicha001