HTML Web Workers
- پچھلے پیچھے HTML5 ایپلی کیشن کاش
- پچھلے پیچھے HTML5 SSE
ਵੈੱਬ ਵਰਕਰ ਪਿੱਛੇਦਾਨ ਜਾਵਾਸਕ੍ਰਿਪਟ ਚਲਾਉਂਦਾ ਹੈ, ਪੰਜੀਕਰਣ ਦੀ ਸਮਰੱਥਾ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਨਹੀਂ ਕਰਦਾ。
ਵੈੱਬ ਵਰਕਰ ਕੀ ਹੈ?
ਜਦੋਂ ਹੈਲਾਂਗਲ ਪੰਜੀਕਰਣ ਚਲਾਇਆ ਜਾਂਦਾ ਹੈ, ਤਾਂ ਪੰਜੀਕਰਣ ਪੂਰਾ ਹੋਣ ਤੱਕ ਪੰਜੀਕਰਣ ਪ੍ਰਤੀਕਿਰਿਆ ਹੋਣ ਦੀ ਨਹੀਂ ਹੈ。
ਵੈੱਬ ਵਰਕਰ ਪਿੱਛੇਦਾਨ ਜਾਵਾਸਕ੍ਰਿਪਟ ਚਲਾਉਂਦਾ ਹੈ, ਹੋਰ ਸਕ੍ਰਿਪਟਾਂ ਤੋਂ ਅਲੱਗ ਹੈ, ਪੰਜੀਕਰਣ ਦੀ ਸਮਰੱਥਾ ਨੂੰ ਪ੍ਰਭਾਵਿਤ ਨਹੀਂ ਕਰਦਾ। ਤੁਸੀਂ ਕਿਸੇ ਵੀ ਚੀਜ਼ ਨੂੰ ਕਰ ਸਕਦੇ ਹੋ, ਜਿਵੇਂ ਕਿ ਕਲਿੱਕ, ਸਮਾਨ ਚੁਣਨਾ ਆਦਿ, ਜਦੋਂ ਵੈੱਬ ਵਰਕਰ ਪਿੱਛੇਦਾਨ ਚਲਾਉਂਦਾ ਹੈ。
ਬਰੇਅਰਜਰ ਸਮਰਥਨ
ਸਾਰੇ ਬਰੇਅਰਜ਼ਰਾਂ ਵੈੱਬ ਵਰਕਰ ਪੂਰੀ ਤਰ੍ਹਾਂ ਸਮਰਥਨ ਕਰਨ ਵਾਲੇ ਪਹਿਲੇ ਬਰੇਅਰਜਰ ਵਰਜਨ ਸੰਖਿਆ ਸਾਰੇ ਸ਼ਾਮਲ ਹਨ。
API | |||||
Web Worker | 4.0 | 10.0 | 3.5 | 4.0 | 11.5 |
HTML Web Workers ਉਦਾਹਰਣ
ਹੇਠਲੇ ਉਦਾਹਰਣ ਵੈੱਬ ਵਰਕਰ ਬਣਾਉਂਦਾ ਹੈ ਜੋ ਪਿੱਛੇਦਾਨ ਗਿਣਤੀ ਕਰਦਾ ਹੈ:
ਗਿਣਤੀ:
ਵੈੱਬ ਵਰਕਰ ਸਮਰਥਨ ਚੇਕ
ਵੈੱਬ ਵਰਕਰ ਬਣਾਉਣ ਤੋਂ ਪਹਿਲਾਂ, ਉਸਦਾ ਬਰਾਉਜ਼ਰ ਵੈੱਬ ਵਰਕਰ ਸਮਰਥਨ ਕਰਦਾ ਹੈ ਜਾਂ ਨਹੀਂ ਦੱਸੋ:
if (typeof(Worker) !== "undefined") { // ਹਾਂ! ਵੈੱਬ ਵਰਕਰ ਸਮਰਥਨ ਹੈ! // ਕੁਝ ਕੋਡ..... }; // ਮਾਫੀ! ਵੈੱਬ ਵਰਕਰ ਸਮਰਥਨ ਨਹੀਂ ਹੈ! }
ਵੈੱਬ ਵਰਕਰ ਫਾਇਲ ਬਣਾਓ
ਹੁਣ, ਅਸੀਂ ਇੱਕ ਬਾਹਰੀ JavaScript ਫਾਈਲ ਵਿੱਚ ਆਪਣੇ web worker ਨੂੰ ਬਣਾਈਏ।
ਇੱਥੇ, ਅਸੀਂ ਗਿਣਤੀ ਸਕ੍ਰਿਪਟ ਬਣਾਈ ਹੈ। ਇਹ ਸਕ੍ਰਿਪਟ "demo_workers.js" ਫਾਈਲ ਵਿੱਚ ਸਟੋਰ ਹੈ:
var i = 0; function timedCount() { i = i + 1; postMessage(i); setTimeout("timedCount()",500); } timedCount();
ਇਸ ਕੋਡ ਵਿੱਚ ਮਹੱਤਵਪੂਰਣ ਹਿੱਸਾ postMessage() ਮੈਥਡ ਹੈ - ਇਹ ਇਹ ਕੰਮ ਕਰਦਾ ਹੈ ਕਿ ਉਹ ਇੱਕ ਸਮਾਚਾਰ ਨੂੰ HTML ਪੇਜ ਵਿੱਚ ਭੇਜਦਾ ਹੈ。
ਟਿੱਪਣੀ: web worker ਆਮ ਤੌਰ 'ਤੇ ਇਸ ਤਰ੍ਹਾਂ ਦੇ ਸਕ੍ਰਿਪਟਾਂ ਵਿੱਚ ਨਹੀਂ ਵਰਤਿਆ ਜਾਂਦਾ, ਬਲਕਿ ਕੋਮਪਿਊਟਰ ਸੰਸਾਧਨਾਂ ਵਿੱਚ ਵੱਧ ਖਰਚ ਕਰਨ ਵਾਲੇ ਕੰਮਾਂ ਲਈ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ。
ਵੈਬ ਵਰਕਰ ਅਬਜੈਕਟ ਬਣਾਉਣਾ
ਹੁਣ ਅਸੀਂ web worker ਫਾਈਲ ਪ੍ਰਾਪਤ ਕਰ ਲਿਆ ਹੈ, ਹੁਣ ਅਸੀਂ ਇਸ ਨੂੰ HTML ਪੇਜ ਵਿੱਚ ਬੁਲੰਦ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹਾਂ。
ਹੇਠ ਲਿਖੇ ਕੋਡ ਵਿੱਚ worker ਦੀ ਮੌਜੂਦਗੀ ਨੂੰ ਜਾਂਚ ਕਰਦਾ ਹੈ, ਜੇਕਰ ਉਹ ਮੌਜੂਦ ਨਹੀਂ ਹੈ, ਤਾਂ - ਉਹ ਇੱਕ ਨਵਾਂ web worker ਅਬਜੈਕਟ ਬਣਾਉਂਦਾ ਹੈ ਅਤੇ "demo_workers.js" ਵਿੱਚ ਕੋਡ ਚਲਾਉਂਦਾ ਹੈ:
if (typeof(w) == "undefined") { w = نئی وئب ورکرس("demo_workers.js"); }
ਤਦ ਅਸੀਂ web worker ਵਿੱਚੋਂ ਸਮਾਚਾਰ ਭੇਜ ਸਕਦੇ ਹਾਂ ਅਤੇ ਪ੍ਰਾਪਤ ਕਰ ਸਕਦੇ ਹਾਂ。
ਵੈਬ ਵਰਕਰ ਵਿੱਚ ਇੱਕ "onmessage" ਇਵੈਂਟ ਲਿਸਟਨਰ ਜੋੜੋ:
w.onmessage = function(event){ دوکومنٹgetElementById("result").innerHTML = ایوینٹ.ڈیٹا; };
ਜਦੋਂ web worker ਸਮਾਚਾਰ ਭੇਜਦਾ ਹੈ, ਤਾਂ ਉਹ ਇਵੈਂਟ ਲਿਸਟਨਰ ਵਿੱਚ ਕੋਡ ਚਲਾਉਂਦਾ ਹੈ। web worker ਦਾ ਡਾਟਾ event.data ਵਿੱਚ ਸਟੋਰ ਹੁੰਦਾ ਹੈ。
ਸਮਾਪਤ Web Worker
ਜਦੋਂ ਤੁਸੀਂ web worker ਬਣਾਉਂਦੇ ਹੋ, ਤਾਂ ਉਹ ਸਮਾਪਤ ਹੋਣ ਤੱਕ ਸਬੂਤ ਲਿਸਟਨ ਜਾਰੀ ਰੱਖਦਾ ਹੈ (ਜਿਵੇਂ ਕਿ ਬਾਹਰੀ ਸਕ੍ਰਿਪਟ ਮੁਕਤ ਹੋਣ ਤੋਂ ਬਾਅਦ ਵੀ)。
ਜੇਕਰ ਤੁਸੀਂ web worker ਨੂੰ ਸਮਾਪਤ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹੋ ਅਤੇ ਬਰਾਉਜ਼ਰ/ਕੰਪਿਊਟਰ ਦੇ ਸੰਸਾਧਨਾਂ ਨੂੰ ਮੁਕਤ ਕਰਨਾ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ terminate() ਮੈਥਡ ਵਰਤੋਂ ਕਰੋ:
w.terminate();
Web Worker ਦੀ ਪੁਨਰਵਰਤੀ
ਅਗਰ ਤੁਸੀਂ worker ਵੱਧ ਨੂੰ undefined ਸੈਟ ਕਰਦੇ ਹੋ, ਉਸ ਦੇ ਬਾਅਦ ਇਹ ਕੋਡ ਮੁੜ ਵਰਤਿਆ ਜਾ ਸਕਦਾ ਹੈ:
w = undefined;
ਪੂਰਾ Web Worker ਉਦਾਹਰਣ ਕੋਡ
ਅਸੀਂ .js ਫਾਈਲ ਵਿੱਚ Worker ਕੋਡ ਨੂੰ ਦੇਖਿਆ ਹੈ। ਹੁਣ ਹੋਰ ਹੈਲਥ ਪੇਜ ਦਾ ਕੋਡ ਇਹ ਹੈ:
ਉਦਾਹਰਣ
<!DOCTYPE html> <html> <body> <p>ਗਿਣਤੀ ਕਰੋ: <output id="result"></output></p> <بٹن اون کلیک="اسٹارٹورکرس()">اسٹارٹ ورکرس</بٹن> <بٹن اون کلیک="اسٹاپورکرس()">اسٹاپ ورکرس</بٹن> <br><br> <script> ویر(وئن); فونکشن اسٹارٹورکرس() { اگر (وئن آپ کا نوعیت(وئن) !== "undefined") { اگر (وئن آپ کا نوعیت(وئن) == "undefined") { w = نئی وئب ورکرس("demo_workers.js"); } w.onmessage = فونکشن(ایوینٹ) { دوکومنٹgetElementById("result").innerHTML = ایوینٹ.ڈیٹا; }; }; دوکومنٹgetElementById("result").innerHTML = "مجبور آپ کے لئے! نہیں وئب ورکرس سپورٹ."; } } فونکشن اسٹاپورکرس() { w.terminate(); w = undefined; } </script> </body> </html>
وئب ورکرس اور ڈوم
یوگ سروکر نے باہر کا فائل میں پائی اور اس کا استعمال نہیں کرسکتا، اس لئے نیچل کی جگہ پر آئی اینڈی جس میں جاویسکریپٹ آوبجیکٹ کا استعمال نہیں کرسکتا:
- ویندو آوبجیکٹ
- دوکومنٹ آوبجیکٹ
- پارنٹ آوبجیکٹ
- پچھلے پیچھے HTML5 ایپلی کیشن کاش
- پچھلے پیچھے HTML5 SSE