成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

WebWork（在主線程創(chuàng)建子進(jìn)程）

scq000 / 935人閱讀

摘要：淺談前言都知道是單線程語言，最讓人頭疼的莫過于在網(wǎng)絡(luò)正常的情況下經(jīng)常出現(xiàn)頁面的假死，以及在進(jìn)行大量的循環(huán)計(jì)算時(shí)會(huì)導(dǎo)致線程阻塞由于要進(jìn)行大量的計(jì)算后面的運(yùn)行會(huì)被阻隔在此處，使得性能較差，代碼維護(hù)性差等一系列的問題發(fā)生。

WebWork淺談

前言：

都知道JS是單線程語言，最讓人頭疼的莫過于在網(wǎng)絡(luò)正常的情況下經(jīng)常出現(xiàn)頁面的假死，

以及在進(jìn)行大量的for循環(huán)計(jì)算時(shí)會(huì)導(dǎo)致線程阻塞,由于要進(jìn)行大量的計(jì)算JS后面的運(yùn)行會(huì)被阻隔在此處，使得性能較差，代碼維護(hù)性差等一系列的問題發(fā)生。

本人也看了很多關(guān)于webwork的demo和官方的講解，都說是官方很多都不是很容易讀懂，在最近幾天的學(xué)習(xí)過程我也針對(duì)這個(gè)做了些功課發(fā)現(xiàn)了webwork的作用非同一般！

先上代碼：

 let worker = new Worker("work.js")//此處寫待處理的地址
         let data = [1, 2, 3, 4, 5, 6, 7]
         worker.postMessage(data);

         worker.onmessage = function(event) {
             console.log(event.data)
             document.querySelector("ul").innerHTML = event.data
         }
         
         //此部分是work.js中
         this.addEventListener("message", (data) => {
                let str = render(data.data)
                this.postMessage(str)
         })


    function render(data) {
            let str = ""
            data.forEach(i => {
                str += `
  • ${i}
    • `
            });
          return str
    }

    正如您所看到的，這就是一個(gè)簡(jiǎn)單的Demo：

    但是你在之后再補(bǔ)一句簡(jiǎn)單的console.log（1）就能夠看出結(jié)果了，

    打開F12(傳說中的開發(fā)者模式)你會(huì)驚奇的發(fā)現(xiàn)單線程語言居然先輸出了1然后在UL中添加了節(jié)點(diǎn)，

    思考？

    照以前的寫法我們肯定會(huì)這樣做：

    let str = "";
data.forEach(i => {
                str += `
  • ${i}
    • `
});

document.querySelector("ul").innerHTML = str;

    是不是發(fā)現(xiàn)了其中的好處？

    簡(jiǎn)單來說我們把一套本該同步的代碼該成了異步，也就是在主線程中開辟了一條子線程，這樣的好處就是不會(huì)影響主線程，線程任務(wù)的執(zhí)行，具體步驟在子線程中進(jìn)行，最后返回結(jié)果給主線程中，很巧妙的解決了之前上文提到的，假如在主線程中我有個(gè)任務(wù)循環(huán)了10000次（當(dāng)然是開玩笑?。┻@時(shí)webwork是不是很巧妙的處理了這個(gè)問題呢？

    結(jié)尾：

    為什么要這么做？

    隨著web的發(fā)展，時(shí)代越來越講究?jī)?yōu)化二字，能夠用更加優(yōu)雅的代碼，更加簡(jiǎn)潔的代碼去完成任務(wù)是至關(guān)重要的。

    用戶需求一直是我們開發(fā)者比較密切關(guān)心的問題，試想一下如果在某一天有個(gè)用戶訪問了你的網(wǎng)站由于你代碼的到至了頁面的假死的現(xiàn)象的發(fā)生那是一件多么可怕的事情，在深層次的探究中，每一個(gè)優(yōu)秀的前端工作者都應(yīng)該去努力解決這些問題。

    作者寄語：劉某人，寫文章不多，不喜勿噴，只是發(fā)表個(gè)人見解，如果有更好的建議希望可以互相幫助，相互學(xué)習(xí)

    文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

    轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/116972.html

    相關(guān)文章

    • WebWork（在主線程創(chuàng)建子進(jìn)程）

      摘要：淺談前言都知道是單線程語言，最讓人頭疼的莫過于在網(wǎng)絡(luò)正常的情況下經(jīng)常出現(xiàn)頁面的假死，以及在進(jìn)行大量的循環(huán)計(jì)算時(shí)會(huì)導(dǎo)致線程阻塞由于要進(jìn)行大量的計(jì)算后面的運(yùn)行會(huì)被阻隔在此處，使得性能較差，代碼維護(hù)性差等一系列的問題發(fā)生。 WebWork淺談 前言： 都知道JS是單線程語言，最讓人頭疼的莫過于在網(wǎng)絡(luò)正常的情況下經(jīng)常出現(xiàn)頁面的假死， 以及在進(jìn)行大量的for循環(huán)計(jì)算時(shí)會(huì)導(dǎo)致線程阻塞,由于要進(jìn)行...

      eccozhou 評(píng)論0 收藏0

    • WebWork（在主線程創(chuàng)建子進(jìn)程）

      摘要：淺談前言都知道是單線程語言，最讓人頭疼的莫過于在網(wǎng)絡(luò)正常的情況下經(jīng)常出現(xiàn)頁面的假死，以及在進(jìn)行大量的循環(huán)計(jì)算時(shí)會(huì)導(dǎo)致線程阻塞由于要進(jìn)行大量的計(jì)算后面的運(yùn)行會(huì)被阻隔在此處，使得性能較差，代碼維護(hù)性差等一系列的問題發(fā)生。 WebWork淺談 前言： 都知道JS是單線程語言，最讓人頭疼的莫過于在網(wǎng)絡(luò)正常的情況下經(jīng)常出現(xiàn)頁面的假死， 以及在進(jìn)行大量的for循環(huán)計(jì)算時(shí)會(huì)導(dǎo)致線程阻塞,由于要進(jìn)行...

      wmui 評(píng)論0 收藏0

    • 深入淺出nodeJS - 4 - (玩轉(zhuǎn)進(jìn)程、測(cè)試、產(chǎn)品化)

      摘要：進(jìn)程間通信的目的是為了讓不同的進(jìn)程能夠互相訪問資源，并進(jìn)程協(xié)調(diào)工作。這個(gè)過程的示意圖如下端口共同監(jiān)聽集群穩(wěn)定之路進(jìn)程事件自動(dòng)重啟負(fù)載均衡狀態(tài)共享模塊工作原理事件二測(cè)試單元測(cè)試性能測(cè)試三產(chǎn)品化項(xiàng)目工程化部署流程性能日志監(jiān)控報(bào)警穩(wěn)定性異構(gòu)共存 內(nèi)容 9.玩轉(zhuǎn)進(jìn)程10.測(cè)試11.產(chǎn)品化 一、玩轉(zhuǎn)進(jìn)程 node的單線程只不過是js層面的單線程，是基于V8引擎的單線程，因?yàn)?，V8的緣故，前后...

      henry14 評(píng)論0 收藏0

    • python學(xué)習(xí)筆記 - fork, multiprocessing

      摘要：近年來，人工智能的興起使得更加火爆了。獲取當(dāng)前進(jìn)程父進(jìn)程的。但是唯一遺憾的是，函數(shù)只能在系統(tǒng)中使用，不能在系統(tǒng)中使用。因此在下，需要將其包含在中。則是立即返回一個(gè)可迭代對(duì)象。則是返回可迭代函數(shù)。 Python一直是一門對(duì)初學(xué)者非常友好的語言，在數(shù)據(jù)分析、Web 開發(fā)、網(wǎng)絡(luò)安全、網(wǎng)絡(luò)爬蟲等方面應(yīng)用廣泛。近年來，人工智能的興起使得 Python 更加火爆了。 我們?cè)谔幚泶罅繑?shù)據(jù)或者需要快速...

      littleGrow 評(píng)論0 收藏0

    發(fā)表評(píng)論

    0條評(píng)論

    最新活動(dòng)
    閱讀需要支付1元查看
    <