‎‎كارگران وبHTML Web Workers API -‎

Previous >    <Next  

‎وب كارگر يك جاوااسكريپت است كه در پس زمينه اجرا ميشود، بدون اينكه بر عملكردصفحه تاثير ‎بگذارد.

‎‎وب كارگر جيستWeb Worker -‎

‎هنگاميكه يك اسكريپت در صفحهHTML اجرا ميشود، صفحه تاپايان اجراي آن اسكريپت پاسخگو ‎نمي باشد.

‎وب كارگر يك جاوااسكريپت كه در پس زمينه مستقل از ساير جاوااسكريپت اجرا ميشود .در هنگام اجرا ‎تاثيري برعملكرد صفحه ندارد .ميتوان در حين اجراي آن، اعمالي مثل انتخاب ، كليك وموارد ديگر ‎را انجام داد.

‎‎پشتيباني مرورگرهاBrowser Support -‎

‎در جدول زير اولين نسخه مرورگرها كه ازWeb Workers پشتيباني كردند آماده است .اعداد شماره ‎نسخه مرورگرهاست.

‎API‎ Chorome Edge Firefox Safari Opera
‎Web Workers‎ ‎‎4.0‎ ‎‎10.0‎ ‎‎3.5‎ ‎‎4.0‎ ‎‎11.5‎

‎‎مثال براي وب كارگرHTML Web Workers Example -‎

‎‎مثال ـ در مثال زير وب كارگري ايجاد شده كه در پس زمينه شمارش اعداد انجام ميدهد.

Count numbers:

--(go to editor for change code and run)

‎‎توجه ـ اينترنت اكسپورلر9و نسخه هاي قبلي آن وب كارگر را پشتيباني نميكنند.

‎‎كنترل پشتيباني مرورگرازوب كارگرCheck Web Worker Support -‎

‎قبل از ايجاد وب كارگر بايد از پشتيباني مرورگر ازآن مطمئن شويد .در نتيجه ابتدا پشتيباني ‎مرورگر كنترل ميشود .مطابق زير:

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

‎‎ايجاد فايل وب كارگرCreate a Web Worker File -‎

‎در اينجا يك اسكريپت فايل براي شمارش ايجاد ميكنيم .اين فايل بانام‎"demo_workers.js‎"‎ذخيره ‎ميشود .اسكريپت آن مطابق زير است:

var i = 0;

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

timedCount(); 

‎قسمت مهم اسكريپت فوق متد‎postmessage()‎‎ است كه براي قرار دادن يك پيغام ‎در صفحهHTML مورد استفاده قرار ميگيرد .

‎نكته ـ از وب كارگر معمولا، مشابه چنين اسكريپت ساده اي استفاده نميشود .بيشتر براي موضوعات ‎فشرده ترCPU استفاده ميگردد .

‎‎ايجاد شي وب كارگرCreate a Web worker Object -‎

‎‎اكنون يك فايل وب كارگري وجود دارد، بايد از طريق صفحهHTML بكار گرفته يا فراخوان شود.

‎اولين خط كد زير وجودworker را بررسي مي نمايد، اگر وجود نداشته باشد ، شي آنرا ايجاد ‎‎و كد داخل‎"demo_workers.js‎"‎را اجرا مي نمايد .

if  (typeof(w) == "undefined") {
  w = new Worker("demo_workers.js");
}

‎سپس مي توانيم از وب كارگر پيام ارسال ودريافت كنيم .براي اينكار بايد رويداد‎"onmessage‎"‎را ‎وب كارگر مطابق زير اضافه نمائيم .باين‎"onmessage‎"‎رويداد شنونده وب كارگرهم گفته ميشود .

w.onmessage = function(event){
  document.getElementById("result").innerHTML = event.data;
}; 

‎زمانيكه وب كارگر پيامي را ارسال ميكند، كد داخل رويداد شنونده اجرا و داده وب كارگر يعني event.data‎ذخيره ميشود .

‎‎خاتمه وب كارگرTerminate a Web Worker -‎

‎هنگاميكه يك شي وب كارگر ايجاد ميشود، به دريافت پيامها ادامه ميدهد، تا پايانش اعلام شود. ‎اعلام پايان مطابق زيراست:

w.terminat();

‎‎استفاده مجدد وب كارگرReuse the Web Worker -‎

‎اگر متغير‎"w‎"‎وب كارگري با مقدار‎"undefined‎"‎ تنظيم كنيد، بعداز اينكه پايان مي يابد ‎ميتواند دو باره آن كد را استفاده نمائيد.

w=undefined;

‎‎مثال كد كامل وب كارگرFull Web Worker Example code -‎

<!DOCTYPE html>
<html>
<body>

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

<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! No Web Worker support.";
  }
}

function stopWorker() {
  w.terminate();
  w = undefined;
}
</script >

</body>
</html> 

--(go to editor for change code and run)

‎‎وب كارگر و دامWeb Workers nd the DOM -‎

‎‎بدليل اينگه وب كارگري در يك فايل خارجي است، انها به اشياء جاوااسكريپت زير دسترسي ندارند.


Previous >    <Next