亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專(zhuān)欄INFORMATION COLUMN

[源碼學(xué)習(xí)]前端緩存工具fast-memoize和nano-memoize

KoreyLee / 3582人閱讀

摘要：至今天年月日，這個(gè)工具的實(shí)現(xiàn)源碼思想是極其相似的，基本上，只要閱讀了其中一個(gè)源碼，也就了解了另外一個(gè)的實(shí)現(xiàn)。都對(duì)返回的緩存函數(shù)進(jìn)行了參數(shù)注入這是一個(gè)極大提升性能的方法。不同點(diǎn)使用了無(wú)的對(duì)象，使用了普通對(duì)象這一點(diǎn)性能上相差不多。

至今天(2018年9月7日)，這2個(gè)工具的實(shí)現(xiàn)源碼思想是極其相似的，基本上，只要閱讀了其中一個(gè)源碼，也就了解了另外一個(gè)的實(shí)現(xiàn)。

fast-memoize導(dǎo)圖:

初識(shí)

大概說(shuō)說(shuō)它們的實(shí)現(xiàn)思路：

定義緩存結(jié)構(gòu)，其中fast使用了無(wú)prototype的對(duì)象，nano使用了普通對(duì)象。

定義序列化方法：當(dāng)檢測(cè)到是單參數(shù)時(shí)，都是選擇JSON.stringify，而多個(gè)參數(shù)，兩者有不同（后面再說(shuō)）。

定義策略：也就是緩存的具體方法，其實(shí)很簡(jiǎn)單，就是對(duì)當(dāng)前緩存結(jié)構(gòu)查找，找到就返回，找不到就重新運(yùn)行，
兩者都使用了bind方法注入?yún)?shù)，可以省去運(yùn)行時(shí)再去查找參數(shù)。

接著分析兩者的異同：

相同處：

都使用了JSON.stringify作為序列化方法，因?yàn)樗窃摹?/p>

都對(duì)返回的緩存函數(shù)進(jìn)行了參數(shù)注入（這是一個(gè)極大提升性能的方法）。

對(duì)單參數(shù)還是多參數(shù)的判斷都是使用func.length(形參的數(shù)量判斷)，因?yàn)?b>func.length比arguments.length這種動(dòng)態(tài)判斷性能會(huì)好很多。

不同點(diǎn)：

fast使用了無(wú)prototype的對(duì)象，nano使用了普通對(duì)象(這一點(diǎn)性能上相差不多)。

當(dāng)遇到多個(gè)參數(shù)時(shí)，fast還是繼續(xù)對(duì)arguments進(jìn)行序列化，而nano則復(fù)雜一點(diǎn)，它通過(guò)用數(shù)組將每一次多個(gè)參數(shù)保存起來(lái)，

后續(xù)通過(guò)遍歷每個(gè)參數(shù)進(jìn)行全等對(duì)比===，判斷是否從緩存調(diào)取結(jié)果。

同樣是多個(gè)參數(shù)，nano增加了一個(gè)參數(shù)max，可以讓用戶自定義需要進(jìn)行對(duì)比參數(shù)的長(zhǎng)度。

深入

接著看下第二點(diǎn)不同點(diǎn)的源碼：
主要看nano-memoize：

function multiple(f,k,v,eq,change,max=0,...args) {
      // 用來(lái)儲(chǔ)存i(當(dāng)前對(duì)比的參數(shù)索引)和緩存值
      const rslt = {};
      // k是一個(gè)專(zhuān)門(mén)存放多個(gè)參數(shù)的數(shù)組 格式類(lèi)似
      // [[...args],[...args],[...args]...]
      for(let i=0;i=0 ? rslt.i : v.length;
      if(change) { change(i); }
      // 如果緩存不存在就執(zhí)行func，存在直接返回緩存
      return typeof rslt.v === "undefined" ? v[i] = f.call(this,...(k[i] = args)) : rslt.v;
    }

可以看出，這是通過(guò)2次遍歷，對(duì) [[...args],[...args],[...args]...]這樣一種結(jié)構(gòu)比較，外層遍歷判斷l(xiāng)ength，
length相等才會(huì)進(jìn)入內(nèi)層遍歷，內(nèi)層遍歷就是逐個(gè)判斷了。

// 注入?yún)?shù)，提升性能
f = multiple.bind(
        this,
        fn,
        k,
        v,
        // 逐個(gè)判斷方式默認(rèn)為 ===
        equals || ((a,b) => a===b), // default to just a regular strict comparison
        (maxAge ? change.bind(this,v): null), // turn change logging on and bind to arg cache v
        maxArgs
      );

上面一段則是參數(shù)注入方式和默認(rèn)的對(duì)比方式。

總結(jié)

一個(gè)表格總結(jié)兩者最大不同，假設(shè)：

忽略===的執(zhí)行時(shí)間

使用的參數(shù)分為 引用相同 和 引用不同(但是深比較都為true)
例如：{x:1}和{x:1}

耗時(shí)操作 多個(gè)參數(shù)(引用相同) 多個(gè)參數(shù)(引用不同)
狀態(tài) 首次運(yùn)行 后續(xù)運(yùn)行 首次運(yùn)行 后續(xù)運(yùn)行
fast 序列化+運(yùn)行函數(shù) 序列化比較 序列化+運(yùn)行函數(shù) 序列化比較
nano 運(yùn)行函數(shù) 0(===比較) 運(yùn)行函數(shù) 運(yùn)行函數(shù)(===比較失敗)

源碼(帶注釋)倉(cāng)庫(kù)

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

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

相關(guān)文章

  • [源碼學(xué)習(xí)]前端緩存工具fast-memoize和nano-memoize

    摘要：至今天年月日，這個(gè)工具的實(shí)現(xiàn)源碼思想是極其相似的，基本上，只要閱讀了其中一個(gè)源碼，也就了解了另外一個(gè)的實(shí)現(xiàn)。都對(duì)返回的緩存函數(shù)進(jìn)行了參數(shù)注入這是一個(gè)極大提升性能的方法。不同點(diǎn)使用了無(wú)的對(duì)象，使用了普通對(duì)象這一點(diǎn)性能上相差不多。 至今天(2018年9月7日)，這2個(gè)工具的實(shí)現(xiàn)源碼思想是極其相似的，基本上，只要閱讀了其中一個(gè)源碼，也就了解了另外一個(gè)的實(shí)現(xiàn)。 fast-memoize導(dǎo)圖: ...

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

  • 原理解釋 - 收藏集 - 掘金

    摘要：巧前端基礎(chǔ)進(jìn)階全方位解讀前端掘金我們?cè)趯W(xué)習(xí)的過(guò)程中，由于對(duì)一些概念理解得不是很清楚，但是又想要通過(guò)一些方式把它記下來(lái)，于是就很容易草率的給這些概念定下一些方便自己記憶的有偏差的結(jié)論。 計(jì)算機(jī)程序的思維邏輯 (83) - 并發(fā)總結(jié) - 掘金從65節(jié)到82節(jié)，我們用了18篇文章討論并發(fā)，本節(jié)進(jìn)行簡(jiǎn)要總結(jié)。 多線程開(kāi)發(fā)有兩個(gè)核心問(wèn)題，一個(gè)是競(jìng)爭(zhēng)，另一個(gè)是協(xié)作。競(jìng)爭(zhēng)會(huì)出現(xiàn)線程安全問(wèn)題，所以，本...

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

  • 原理解釋 - 收藏集 - 掘金

    摘要：巧前端基礎(chǔ)進(jìn)階全方位解讀前端掘金我們?cè)趯W(xué)習(xí)的過(guò)程中，由于對(duì)一些概念理解得不是很清楚，但是又想要通過(guò)一些方式把它記下來(lái)，于是就很容易草率的給這些概念定下一些方便自己記憶的有偏差的結(jié)論。 計(jì)算機(jī)程序的思維邏輯 (83) - 并發(fā)總結(jié) - 掘金從65節(jié)到82節(jié)，我們用了18篇文章討論并發(fā)，本節(jié)進(jìn)行簡(jiǎn)要總結(jié)。 多線程開(kāi)發(fā)有兩個(gè)核心問(wèn)題，一個(gè)是競(jìng)爭(zhēng)，另一個(gè)是協(xié)作。競(jìng)爭(zhēng)會(huì)出現(xiàn)線程安全問(wèn)題，所以，本...

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

  • 2017文章總結(jié)

    摘要：歡迎來(lái)我的個(gè)人站點(diǎn)性能優(yōu)化其他優(yōu)化瀏覽器關(guān)鍵渲染路徑開(kāi)啟性能優(yōu)化之旅高性能滾動(dòng)及頁(yè)面渲染優(yōu)化理論寫(xiě)法對(duì)壓縮率的影響唯快不破應(yīng)用的個(gè)優(yōu)化步驟進(jìn)階鵝廠大神用直出實(shí)現(xiàn)網(wǎng)頁(yè)瞬開(kāi)緩存網(wǎng)頁(yè)性能管理詳解寫(xiě)給后端程序員的緩存原理介紹年底補(bǔ)課緩存機(jī)制優(yōu)化動(dòng) 歡迎來(lái)我的個(gè)人站點(diǎn) 性能優(yōu)化 其他 優(yōu)化瀏覽器關(guān)鍵渲染路徑 - 開(kāi)啟性能優(yōu)化之旅 高性能滾動(dòng) scroll 及頁(yè)面渲染優(yōu)化 理論 | HTML寫(xiě)法...

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

  • 2017文章總結(jié)

    摘要：歡迎來(lái)我的個(gè)人站點(diǎn)性能優(yōu)化其他優(yōu)化瀏覽器關(guān)鍵渲染路徑開(kāi)啟性能優(yōu)化之旅高性能滾動(dòng)及頁(yè)面渲染優(yōu)化理論寫(xiě)法對(duì)壓縮率的影響唯快不破應(yīng)用的個(gè)優(yōu)化步驟進(jìn)階鵝廠大神用直出實(shí)現(xiàn)網(wǎng)頁(yè)瞬開(kāi)緩存網(wǎng)頁(yè)性能管理詳解寫(xiě)給后端程序員的緩存原理介紹年底補(bǔ)課緩存機(jī)制優(yōu)化動(dòng) 歡迎來(lái)我的個(gè)人站點(diǎn) 性能優(yōu)化 其他 優(yōu)化瀏覽器關(guān)鍵渲染路徑 - 開(kāi)啟性能優(yōu)化之旅 高性能滾動(dòng) scroll 及頁(yè)面渲染優(yōu)化 理論 | HTML寫(xiě)法...

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

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

0條評(píng)論

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