javascript實現多線程 Concurrent.Thread.js

在這次我的項目中，因為前端要檢測硬件加載並識別，再向后台請求發送數據，然后再返回的相應的配置文件！在這過程，要好時好幾秒鍾，嚴重影響體驗效果，所以在網上靠看的方案，運用多線程去處理，這效果明顯改善！

  在這同步檢測過程，效果就如for循環一個很大數字(模仿復雜的邏輯代碼運算)，卡在哪里，導致不了其他的操作！

 

大家可以先不用這庫，測試一下如下代碼看看效果：

<script>
    var btn = document.querySelector('.clickBtn');
    btn.addEventListener('click', function () {
        alert('我要多久才可以彈出來啊！！！！')
    });
    for (var i = 0; i < 99999; i++) {
        console.log(i);
    }
</script>

因為雖然在點擊按鈕在前面，可是在javascript的實現是放在javascript的異步事件隊列中，因此這時候要等到 for 循環完才 執行 alert(1);

 

這次用這個庫的效果：

 1 <script src="Concurrent.Thread.js"></script>
 2 <script>
 3     Concurrent.Thread.create(function () {
 4         var btn = document.querySelector('.clickBtn');
 5         btn.addEventListener('click', function () {
 6             alert('我要多久才可以彈出來啊！！！！')
 7         });
 8         for (var i = 0; i < 99999; i++) {
 9             console.log(i);
10         }
11     });
12 </script>

立刻點擊按鈕，馬上又反應alert! 這就是多線程的么里所在......

這次項目，用到主要是這個庫的提供的異步通訊：Concurrent.Thread提供了一個應用JavaScript 的異步通信方式實現的定制通信庫，它被設計成當一個線程在等待服務器的響應時允許其它線程運行。這個通信庫存於 Concurrent.Thread.Http。

參考的教程的用法如下：演示GET方式

< script type="text/javascript" src="Concurrent.Thread.js">< /script>
< script type="text/x-script.multithreaded-js">
　　var req = Concurrent.Thread.Http.get(url, ["Accept", "*"]);
　　if (req.status == 200) {
　　　　alert(req.responseText);
　　} else {
　　　　alert(req.statusText);
}
< /script>

 

至於更詳細的用法，大家可以在網上查看更多的資料，去了解這個庫的魅力所在！