قبل HTML5 ، يعمل JavaScript في المتصفحات بطريقة واحدة. على الرغم من وجود العديد من الطرق لتنفيذ عمليات محاكاة متعددة الخيوط (مثل طريقة setInterval ، وطريقة SetTimeout ، وما إلى ذلك في JavaScript) ، في جوهرها ، لا يزال يتم تنفيذ البرنامج بواسطة محرك JavaScript بطريقة واحدة. تمكن مؤشرات ترابط العمال التي تم تقديمها في HTML5 من محرك JavaScript من جانب المتصفح لتنفيذ رمز JavaScript بشكل متزامن ، وبالتالي تحقيق دعم جيد للبرمجة متعددة الخيوط من جانب المتصفح.
Multithreading في JavaScript - عامل الويب يمكن تقسيم عمال الويب في HTML5 إلى نوعين مختلفين لخيط الخيوط ، أحدهما هو عامل مخصص مؤشر ترابط مخصص والآخر هو العامل المشترك للمشتركة. نوعان من المواضيع لها استخدامات مختلفة. عامل الويب الخاصيتم توصيل العامل المخصص بالنص الذي أنشأه. يمكن أن يتواصل مع العمال الآخرين أو مكونات المتصفح ، ولكن لا يمكن التواصل مع DOM. معنى المخصص هو أن هذا الموضوع يعالج متطلبات واحدة فقط في وقت واحد. يتم تنفيذ المواضيع المخصصة في مختلف المتصفحات السائدة باستثناء IE ويمكن استخدامها بثقة.
إنشاء موضوعإنشاء عامل بسيط ، فقط تمرير اسم ملف ملف JavaScript الذي يجب تنفيذه في مؤشر الترابط إلى المُنشئ.
التواصل الموضوعيستخدم التواصل بين الخيط الرئيسي وخيط الطفل أساليب postmessage و onMessage لكائن الخيط. بغض النظر عمن يرسل البيانات إلى من ، يستخدم إرسال وإرسال طريقة postmessage ، ويستخدم المتلقي طريقة OnMessage لتلقي البيانات. يحتوي PostMessage على معلمة واحدة فقط ، أي البيانات التي تم تمريرها ، و OnMessage لديها معلمة واحدة فقط. افترض أنه حدث ، يتم الحصول على البيانات المستلمة من خلال event.data.
إرسال بيانات JSONJSON هو شيء يدعمه JS. لا يلزم استخدامه من أجل لا شيء. فقط استخدم البيانات المعقدة في JSON. على سبيل المثال:
postmessage ({'cmd': 'init' ، 'timestamp': date.now ()}) ؛
التعامل مع الأخطاءعندما يحدث خطأ في سلسلة رسائل ، سيتم استدعاء رد الاتصال على حدث Onerror. لذلك ، فإن طريقة التعامل مع الأخطاء بسيطة للغاية ، والتي تتمثل في تركيب حدث onerror لمثيل الخيط. تحتوي وظيفة رد الاتصال هذه على خطأ في المعلمة ، والذي يحتوي على 3 حقول: رسالة - رسالة خطأ ؛ اسم الملف - ملف البرنامج النصي حيث حدث الخطأ ؛ الكتان - الخط حيث حدث الخطأ.
تدمير المواضيعداخل الخيط ، استخدم الطريقة الإغلاق لتدمير نفسها. في الخيط الرئيسي خارج مؤشر الترابط ، يتم استخدام طريقة إنهاء مثيل مؤشر الترابط لتدمير الخيط.
فيما يلي مثال لرؤية التشغيل الأساسي للمواضيع:
رمز HTML:
<! doctype html>
<html>
<head>
<meta http-equiv = "content-type" content = "text /html ؛ charset = utf-8" />
<title> عامل الويب Fibonacci </title>
<script type = "text/javaScript">
onload = function () {
var worker = عامل جديد ('fibonacci.js') ؛
عامل.
console.log ("النتيجة:" + event.data) ؛
} ؛
عامل. onerror = دالة (خطأ) {
console.log ("خطأ:" + error.message) ؛
} ؛
عامل. postmessage (40) ؛
}
</script>
</head>
<body>
</body>
</html>
ملف البرنامج النصي Fibonacci.js رمز:
//fibonacci.js
var fibonacci = function (n) {
العودة n <2؟ n: الحجج.
} ؛
onMessage = وظيفة (حدث) {
var n = parseint (event.data ، 10) ؛
postmessage (Fibonacci (n)) ؛
} ؛
ضعها في نفس الدليل ، وقم بتشغيل ملف الصفحة ، وعرض وحدة التحكم لمعرفة نتائج التشغيل.
هناك نقطة أخرى هنا. في الخيط الرئيسي ، يمكن ربط حدث onMessage بطريقة أخرى:
Worker.AdDeventListener ('message' ، function (event) {
console.log ("النتيجة:" + event.data) ؛
}، خطأ شنيع)؛
أنا شخصياً أعتقد أنه أمر مزعج للغاية ، فلماذا لا تستخدم onMessage مباشرة.
استخدم ملفات نصية أخرىيمكن للعمال استخدام مستبيد الأسلوب العالمي لتحميل واستخدام ملفات البرامج النصية الأخرى في مجال أو مكتبات الفصل. على سبيل المثال ، ما يلي طرق قانونية للاستخدام:
استيرادات () ؛/ * يستورد لا شيء */
استيرادات ('foo.js') ؛ / * الواردات فقط "foo.js" */
eRdustscripts ('foo.js' ، 'bar.js') ؛/ * يستورد نصين */
بعد الاستيراد ، يمكنك استخدام الطرق مباشرة في هذه الملفات. انظر مثال صغير على الإنترنت:
/**
* استخدم طريقة الاستيرادات لإدخال البرامج النصية للموارد الخارجية ، هنا نستخدم مكتبة أداة حساب الصيغة الرياضية MATH_UTILIS.JS
* عندما يقوم محرك JavaScript بتحميل ملف المورد هذا ، تابع تنفيذ الرمز التالي. في الوقت نفسه ، يمكن الوصول إلى الكود التالي واتصاله
* المتغيرات والأساليب المحددة في ملف المورد.
**/
eRdustScripts ('Math_Utability.js') ؛
onMessage = وظيفة (حدث)
{
var first = event.data.first ؛
var second = event.data.Second ؛
حساب (الأول ، الثاني) ؛
} ؛
وظيفة حساب (الأول ، الثاني) {
// هل عمل الحساب
var common_divisor = المقسوم (الأول ، الثاني) ؛
var common_multiple = متعددة (أولاً ، ثانية) ؛
postmessage ("العمل المنجز!" +
"المضاعف الأقل شيوعًا هو" + common_divisor +
"وأكبر مقسم مشترك هو"+common_multiple) ؛
}
فكرت بعض مستخدمي الإنترنت على الإنترنت أيضًا في استخدام طريقة الواردات هنا لحل مشكلة التحميل المسبق للموارد (يقوم المتصفح بتحليل الموارد دون تحليل الموارد وتنفيذها) ، والسبب بسيط للغاية.
موضوع التعشيشفي موضوع العمال ، يمكنك أيضًا إنشاء مؤشرات ترابط الأطفال ، والعمليات المختلفة هي نفسها.
قضايا التزامنلا يحتوي العامل على آلية قفل ، ولا يمكن حل مشاكل التزامن المتعددة فقط عن طريق الكود (مثل تحديد متغيرات الإشارة).
مشاركين عمال الويب المشتركون مناسبون بشكل أساسي لمشاكل التزامن التوصيل المتعدد. نظرًا لأنه يحتاج إلى التعامل مع اتصالات متعددة ، فإن واجهة برمجة التطبيقات الخاصة بها تختلف قليلاً عن العمال المتفانين. بالإضافة إلى ذلك ، لا يمكن للعاملين في الويب المشتركين ، مثل العمال المتفانين ، الوصول إلى DOM ، كما أن الوصول إلى خصائص النماذج مقيد أيضًا. لا يمكن لعمال الويب المشتركين عبور الاتصالات أيضًا.يمكن أن تتواصل برامج النصوص التي يمكن أن تتواصل مع عمال الويب المشتركين ، ومع ذلك ، تختلف قليلاً عن عمال الويب المتفانين (باستخدام اتصال منفذ ضمني) هو أن الاتصال يتم تنفيذه بشكل صريح باستخدام كائن منفذ وتوصيل معالج حدث الرسائل.
بعد تلقي الرسالة الأولى من البرنامج النصي لعامل الويب ، يرفق عامل الويب المشترك معالج الحدث بالمنفذ المنشط. بشكل عام ، سيقوم المعالج بتشغيل طريقة postmessage () الخاصة به لإرجاع رسالة إلى رمز الاتصال ، ثم تقوم طريقة Start () للمنفذ بإنشاء عملية رسالة صالحة.
انظر إلى المثال الوحيد الذي يمكنك العثور عليه على الإنترنت: قم بإنشاء مؤشر ترابط مشترك لتلقي الإرشادات المرسلة من اتصالات مختلفة ، ثم تنفيذ منطق معالجة التعليمات الخاصة به. بعد اكتمال معالجة التعليمات ، سيتم إرجاع النتيجة إلى كل مستخدم مختلف متصل.
رمز HTML:
<! doctype html>
<html>
<head>
<meta charset = "utf-8">
<title> مثال العامل المشترك: كيفية استخدام العامل المشترك في html5 </title>
<script>
var worker = new SharedWorker ('sharborworker.js') ؛
var log = document.getElementById ('response_from_worker') ؛
worker.port.addeventListener ('message' ، function (e) {
// تسجيل بيانات الاستجابة في صفحة الويب
log.textContent = e.data ؛
}، خطأ شنيع)؛
Worker.port.start () ؛
worker.port.postMessage ('ping from user web page ..') ؛
// سوف ترسل الطريقة التالية إدخال المستخدم إلى عامل مشترك
وظيفة postmessageToShareDworker (المدخلات)
{
// تحديد كائن JSON لبناء الطلب
تعليمات var = {التعليمات: input.value} ؛
Worker.port.postmessage (تعليمات) ؛
}
</script>
</head>
<body onload = ''>
<output id = 'response_from_worker'>
مثال العامل المشترك: كيفية استخدام العامل المشترك في HTML5
</output>
إرسال تعليمات إلى العامل المشترك:
<type type = "text" Autofocus Oninput = "postmessageToSharSearsing (this) ؛ return false ؛">
</input>
</body>
</html>
رمز ملف البرنامج النصي:
// قم بإنشاء مؤشر ترابط مشترك لتلقي الإرشادات المرسلة من اتصالات مختلفة. بعد اكتمال معالجة التعليمات ، سيتم إرجاع النتيجة إلى كل مستخدم مختلف متصل.
var connect_number = 0 ؛
OnConnect = function (e) {
connect_number = connect_number+ 1 ؛
// احصل على المنفذ الأول هنا
var port = e.ports [0] ؛
port.postmessage ("اتصال جديد! رقم الاتصال الحالي هو"
+ connect_number) ؛
port.onmessage = function (e) {
// احصل على تعليمات من الطالب
تعليمات var = e.data.instruction ؛
VAR REVITIONS = EXECUTE_INSTRUCTION (التعليمات) ؛
port.postMessage ("طلب:"+تعليم+"استجابة"+نتائج
+"من العامل المشترك ...") ؛
} ؛
} ؛
/*
* سيتم استخدام هذه الوظيفة لتنفيذ الإرشادات التي ترسلها من الطالب
* تعليمات param
* @يعود
*/
وظيفة execute_instruction (تعليمات)
{
var result_value ؛
// تنفيذ منطقك هنا
// تنفيذ التعليمات ...
return result_value ؛
}
في مثال مؤشر الترابط المشترك أعلاه ، يتم إنشاء كائن مؤشر ترابط مشترك على الصفحة الرئيسية ، أي كل صفحة اتصال مستخدم ، ويتم تعريف طريقة لإرسال تعليمات المستخدم الواردة إلى مؤشر الترابط المشترك. في الوقت نفسه ، يتم تعريف connect_number في مقتطف رمز التنفيذ من مؤشر الترابط المشترك لتسجيل العدد الإجمالي للموصل بالمعلومات المشتركة. بعد ذلك ، استخدم معالج أحداث OnConnect لقبول الاتصالات من مستخدمين مختلفين وتحليل الإرشادات التي يمرون بها. أخيرًا ، يتم تعريف طريقة execute_instruction لتنفيذ تعليمات المستخدم. بعد اكتمال تنفيذ التعليمات ، سيتم إرجاع النتيجة إلى كل مستخدم.
هنا لم نستخدم معالج أحداث OnMessage لخيط العمال مثل المثال السابق ، لكننا استخدموا طريقة أخرى لإضافة addeventListener. في الواقع ، كما ذكرنا سابقًا ، فإن مبادئ التنفيذ لهذين الاثنين هي نفسها بشكل أساسي ، ولكن هناك بعض الاختلافات الطفيفة هنا. إذا كنت تستخدم AddEventListener لقبول الرسائل من مؤشرات الترابط المشتركة ، فيجب عليك أولاً استخدام طريقة Worker.port.start () لبدء هذا المنفذ. بعد ذلك ، يمكنك تلقي الرسائل وإرسالها عادةً تمامًا مثل الطريقة التي يتم بها استخدام مؤشر ترابط العامل.
البيان النهائي الأشياء التي يمكنك القيام بها في الموضوع :1. يمكن استخدام setTimeOut () ، cleartimeout () ، setInterval () ، clearinterval () وغيرها من الوظائف.
2. يمكن استخدام كائنات الملاح.
3. يمكن استخدام xmlhttprequest لإرسال الطلبات.
4. يمكنك استخدام تخزين الويب في الموضوع.
5. يمكنك استخدام الذات للحصول على نطاق هذا الموضوع في الموضوع.
الأشياء التي لا يمكن القيام بها في المواضيع :1. لا يمكن استخدام كائنات DOM/BOM بخلاف Navigator في مؤشرات الترابط ، مثل النافذة والمستند (إذا كنت ترغب في تشغيل ، يمكنك فقط إرسال رسائل إلى منشئ العمال والتشغيل من خلال وظائف رد الاتصال).
2. لا يمكن استخدام المتغيرات والوظائف في الخيط الرئيسي في الخيط.
3. لا يمكن استخدام أوامر التشغيل ذات تأثيرات التعليق في مؤشرات الترابط ، مثل التنبيه ، إلخ.
4. لا يمكن تحميل JS عبر المجالات في المواضيع.
تتطلب المواضيع أيضًا استهلاك الموارد ، وسيحقق استخدام مؤشرات الترابط أيضًا بعض التعقيد ، لذلك إذا لم يكن هناك سبب كاف لاستخدام مؤشرات ترابط إضافية ، فلا تستخدمها.
مرجع عمليالوثيقة الرسمية: http://www.whatwg.org/specs/web-apps/current-work/multipage/workers.html
تصنيف عامل الويب: http://www.w3schools.com/html5/html5_webworkers.asp
مخاوف قالب: http://www.cuoxin.com/w3school/html5/
نظرة عامة على عامل الويب: https://developer.mozilla.org/en/using_web_workers