视频技术

FFmpeg red5 nginx Html5 rtsp rtmp

·您当前的位置：首页 > 技术教程 > Html5技术 >

[html5]什么是 Web Worker？

时间:2014-07-25 17:13酷播
web worker 是运行在后台的 JavaScript，不会影响页面的性能。

什么是 Web Worker？

当在 HTML 页面中执行脚本时，页面的状态是不可响应的，直到脚本已完成。

web worker 是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能。您可以继续做任何愿意做的事情：点击、选取内容等等，而此时 web worker 在后台运行。

检测 Web Worker 支持

在创建 web worker 之前，请检测用户的浏览器是否支持它：

  1. if(typeof(Worker)!=="undefined") 
  2.   { 
  3.   // Yes! Web worker support! 
  4.   // Some code..... 
  5.   } 
  6. else 
  7.   { 
  8.   // Sorry! No Web Worker support.. 
  9.   } 

完整的 Web Worker 实例代码

我们已经看到了 .js 文件中的 Worker 代码。下面是 HTML 页面的代码：

实例

  1. <!DOCTYPE html> 
  2. <html> 
  3. <body> 
  4.  
  5. <p>Count numbers: <output id="result"></output></p> 
  6. <button onclick="startWorker()">Start Worker</button> 
  7. <button onclick="stopWorker()">Stop Worker</button> 
  8. <br /><br /> 
  9.  
  10. <script> 
  11. var w; 
  12.  
  13. function startWorker() 
  14. { 
  15. if(typeof(Worker)!=="undefined") 
  16. { 
  17.   if(typeof(w)=="undefined") 
  18.     { 
  19.     w=new Worker("demo_workers.js"); 
  20.     } 
  21.   w.onmessage = function (event) { 
  22.     document.getElementById("result").innerHTML=event.data; 
  23.   }; 
  24. } 
  25. else 
  26. { 
  27. document.getElementById("result").innerHTML="Sorry, your browser 
  28.  does not support Web Workers..."; 
  29. } 
  30. } 
  31.  
  32. function stopWorker() 
  33. { 
  34. w.terminate(); 
  35. } 
  36. </script> 
  37.  
  38. </body> 
  39. </html> 

热门文章推荐

请稍候...

保利威视云平台-轻松实现点播直播视频应用

酷播云数据统计分析跨平台播放器