📜 [專欄新文章] Merkle Tree in JavaScript

✍️ Johnson

📥 歡迎投稿： https://medium.com/taipei-ethereum-meetup #徵技術分享文 #使用心得 #教學文 #medium

這篇文章會說明 Merkle Tree 的運作原理，以及解釋 Merkle Proofs 的用意，並以 JavaScript / TypeScript 簡單實作出來。

本文為 Tornado Cash 研究系列的 Part 1，本系列以 tornado-core 為教材，學習開發 ZKP 的應用，另兩篇為：

Part 2：ZKP 與智能合約的開發入門

Part 3：Tornado Cash 實例解析

Special thanks to C.C. Liang for review and enlightenment.

本文中實作的 Merkle Tree 是以 TypeScript 重寫的版本，原始版本為 tornado-core 以 JavaScript 實作而成，基本上大同小異。

Merkle Tree 的原理

在理解 Merkle Tree 之前，最基本的先備知識是 hash function，利用 hash 我們可以對資料進行雜湊，而雜湊後的值是不可逆的，假設我們要對 x 值做雜湊，就以 H(x) 來表示，更多內容可參考：

一次搞懂密碼學中的三兄弟 — Encode、Encrypt 跟 Hash

SHA256 Online

而所謂的 Merkle Tree 就是利用特定的 hash function，將一大批資料兩兩進行雜湊，最後產生一個最頂層的雜湊值 root。

當有一筆資料假設是const leaves = [A, B, C, D]，我們就用function Hash(left, right)，開始製作這顆樹，產生H(H(A) + H(B))與H(H(C) + H(D))，再將這兩個值再做一次 Hash 變成 H(H(H(A) + H(B)) + H(H(C) + H(D)))，就會得到這批資料的唯一值，也就是 root。

本文中使用的命名如下：

root：Merkle Tree 最頂端的值，特色是只要底下的資料一有變動，root 值就會改變。

leaf：指單一個資料，如 H(A)。

levels：指樹的高度 (height)，以上述 4 個資料的假設，製作出來的 levels 是 2，levels 通常會作為遞迴的次數。

leaves：指 Merkle Tree 上的所有資料，如上述例子中的 H(A), H(B), H(C), H(D)。leaves 的數量會決定樹的 levels，公式是 leaves.length == 2**levels，這段建議先想清楚！

node：指的是非 leaves 也非 root 的節點，或稱作 branch，如上述例子中的H(H(A) + H(B)) 和 H(H(C) + H(D))。

index：指某個 leaf 所在的位置，leaf = leaves[index]，index 如果是偶數，leaf 一定在左邊，如果是奇數 leaf 一定在右邊。

Merkle Proofs

Merkle Proofs 的重點就是要證明資料有沒有在樹上。

如何證明？就是提供要證明的 leaf 以及其相對應的路徑 (path) ，經過計算後一旦能夠產生所需要的 root，就能證明這個 leaf 在這顆樹上。

因此這類要判斷資料有無在樹上的證明，類似的說法有：proving inclusion, proving existence, or proving membership。

這個 proof 的特點在於，我們只提供 leaf 和 path 就可以算出 root，而不需要提供所有的資料 (leaves) 去重新計算整顆 Merkle Tree。這讓我們在驗證資料有沒有在樹上時，不需要花費大量的計算時間，更棒的是，這讓我們只需要儲存 root 就好，而不需要儲存所有的資料。

在區塊鏈上，儲存資料的成本通常很高，也因此 Merkle Tree 的設計往往成為擴容上的重點。

我們知道 n 層的 Merkle Tree 可以存放 2**n 個葉子，以 Tornado Cash 的設計來說，他們設定 Merkle Tree 有 20 層，也就是一顆樹上會有 2**20 = 1048576 個葉子，而我們用一個 root 就代表了這 1048576 筆資料。

接續上段的例子，這顆 20 層的 Merkle Tree 所產生的 Proof ，其路徑 (path) 要從最底下的葉子 hash 幾次才能到達頂端的 root 呢？答案就是跟一棵樹的 levels 一樣，我們要驗證 Proof 所要遞迴的次數就會是 20 次。

在實作之前，我們先來看 MerkleTree 在 client 端是怎麼調用的，這有助於我們理解 Merkle Proofs 在做什麼。

基本上一個 proof 的場景會有兩個人：prover 與 verifier。

在給定一筆 leaves 的樹，必定產生一特定 root。prover 標示他的 leaf 在樹上的 index 等於 2，也就是 leaves[2] == 30，以此來產生一個 proof，這個 proof 的內容大致上會是這個樣子：

對 verifier 來說，他要驗證這個 proof，就是用裡面的 leaf 去一個一個與 pathElements 的值做 hash，上述就是 H('30', 40) 後得出 node，再 hash 一次 H('19786...', node) 於是就能得出這棵樹的 root。

重點來了，這麼做有什麼意義？它的巧思在於對 verifier 來說，他只需要儲存一個 root，由 prover 提交證明給他，經過計算後產生的 root 如果跟 verifier 儲存的 root 一樣，那就證明了 prover 所提供的資料確實存在於這個樹上。

而 verifier 若不透過 proof ，要驗證某個 leaf 是否存在於樹上，也可以把 leaves = [10, 20 ,leaf ,40]整筆資料拿去做 MerkleTree 的演算法跑一趟也能產生特定的 root。

但由 prover 先行計算後所提交的 proof，讓 verifier 不必儲存整批資料，也省去了大量的計算時間，即可做出某資料有無在 Merkle Tree 上的判斷。

Sparse Merkle Tree

上述能夠證明資料有無在樹上的 Merkle Proofs 是屬於標準的 Merkle Tree 的功能。但接下來我們要實作的是稍微不一樣的樹，叫做 Sparse Merkle Tree。

Sparse Merkle Tree 的特色在於除了 proving inclusion 之外，還可以 proving non-inclusion。也就是能夠證明某筆資料不在某個 index，例如 H(A) 不在 index 2 ，這是一般 Merkle Tree 沒辦法做到的。

而要做到 non-membership 的功能其實也不難，就是我們要在沒有資料的葉子裡補上 zero value，或是說 null 值。更多內容請參考：What’s a Sparse Merkle Tree。

實作細節

本節將完整的程式碼分成三個片段來解釋。

首先，這裡使用的 Hash Function 是 MiMC，主要是為了之後在 ZKP 專案上的效率考量，你可以替換成其他較常見的 hash function 例如 node.js 內建 crypto 的 sha256：

crypto.createHash("sha256").update(data.toString()).digest("hex");

這裡定義簡單的 Merkle Tree 介面有 root, proof, and insert。

首先我們必須先給定這顆樹的 levels，也就是樹的高度先決定好，樹所能容納的資料量也因此固定為 2**levels 筆資料，至於要不要有 defaultLeaves 則看創建 Merkle Tree 的 client 自行決定，如果有 defaultLeaves 的話，constructor 就會跑下方一大段計算，對 default 資料開始作 hash 去建立 Merkle Tree。

如果沒有 defaultLeaves，我們的樹也不會是空白的，因為這是顆 Sparse Merkle Tree，這裡使用 zeroValue 作為沒有填上資料的值，zeros 陣列會儲存不同 level 所應該使用的 zero value。假設我們已經填上第 0 筆與第 1 筆資料，要填上第 2 筆資料時，第 2 筆資料就要跟 zeros[0] 做 hash，第 2 筆放左邊， zero value 放右邊。

我們將所有的點不論是 leaf, node, root 都用標籤 (index) 標示，並以 key-value 的形式儲存在 storage 裡面。例如第 0 筆資料會是 0–0，第 1 筆會是 0–1，這兩個 hash 後的節點 (node) 會是 1–0。假設 levels 是 2，1–0 節點就要跟 1–1 節點做 hash，即可產出 root (2–0)。

後半部份的重點在於 proof，先把 proof 和 traverse 看懂，基本上就算是打通任督二脈了，之後有興趣再看 insert 和 update。

sibling 是指要和 current 一起 hashLeftRight 的值…也就是相鄰在兩旁的 leaf (or node)。

到這裡程式碼的部分就結束了。

最後，讓我們回到一開始 client 調用 merkleTree 的例子：

以及 proof 的內容：

前面略過了 proof 裡頭的 pathIndices，pathIndices 告訴你的是當前的 leaf (or node) 是要放在左邊，還是放在右邊，大概是這個樣子：

if (indices == 0) hash(A, B);if (indices == 1) hash(B, A);

有興趣的讀者可以實作 verify function 看看就會知道了！

原始碼

TypeScript from gist

JavaScript from tornado-core

參考

Merkle Proofs Explained

What’s a Sparse Merkle Tree?

延伸：Verkle Tree

Merkle Tree in JavaScript was originally published in Taipei Ethereum Meetup on Medium, where people are continuing the conversation by highlighting and responding to this story.

👏 歡迎轉載分享鼓掌

「我的粉絲專頁『Dr. E 小兒急診室日誌』成立於 2012 年，那是一個臉書正在大力推廣粉專的年代，只要貼文內容吸引人，自然觸及率就可以造成極高的傳播效率，遠不是現在所能比擬。然而隨著臉書不斷更新演算法，自然觸及率不斷下降，這對於沒有商業利益的粉專無疑是重傷害，付費與不付費的取捨，讓我非常苦惱。」
（中山附醫兒童部 急診科 謝宗學 主任）
⠀
當熱情和成就感同時喪失，我發文的頻率急遽下降，日誌逐漸變成週誌甚至月誌，我決定報名 #新思惟。
⠀
💎 新思惟幫助我找回個人品牌的價值
⠀
課程中除了一些實用技巧外，對我最大的啟發是，不是把自己當作衛教機器，更不是醫學知識的讀稿機，不是平面虛擬的人物，而是活生生立體的真人，有個性、有想法、有自己的特色，勇於做自己、樂於表現自己和其他人的差異，才能持續保持熱情。
⠀
我遵照課程所學，開始寫 #非醫療專業領域 但 #自己有興趣 的文章，並勇於對社會上較具爭議的議題，發表自己的看法，雖然酸民依舊不時出沒，神奇地，貼文的分享率明顯上升，帶動觸及率增加，停滯許久的粉絲總人數也開始緩步增加。
⠀
最重要的是，我重新開始從經營粉絲專頁中得到樂趣，不再在意酸言酸語的留言，享受「做自己」的開心。隨著粉絲人數的不斷增加，我的粉專開始受到媒體的關注。
⠀
💎 經營有深度的品牌，增粉更增加知名度！
⠀
我的貼文常被記者朋友做成平面新聞稿甚至影音新聞，知名度大增，常被記者採訪，加上遇到疫情，跟所學感染專科相關，在網路上分享對疫情的發展與觀點，短短一年多的時間，粉絲人數從原本的 8 萬多人快速增加到現在 12 萬人。在臉書改變演算法後，從沒有想過還能不靠付費推廣，純粹靠自然觸及率得到這樣的快速增加。
⠀
新思惟課程帶給我的 #不只是網路品牌的實務操作，#更是思想觀念的啟發和轉換，沒有五年前課程的洗滌，說不定我已經完全喪失寫作動力，消失在網路汪洋中。這讓我重新找回熱情和成就感，也讓我即使遭遇逆風，能在短時間內重拾，找到更適當的職位發揮，並能更上一層樓。
⠀
🌐 7 種網路應用，一天就能學會！
⠀
✓ 網路效益：全新與世界直接連結的方式
✓ 平台解析：數據分析與實戰歸納
✓ 進階應用：辦活動、教小孩、新領域實例與拆解
✓ 互動實作：從無到有做出自己的部落格
✓ 遊戲規則：酸民、法律、著作權等艱難狀況應對
✓ 內容形式：該寫什麼？效益分析及實用建議
✓ 專業強化：不同業務型態的實際應用與成功關鍵
⠀
🔸 有專業更要有平台，讓有需求的人看得到你。
🔸 立即預約｜8/1（日）網路時代之個人品牌工作坊
🔸 瞭解課程｜https://pati2015.innovarad.tw/p/event.html
⠀
《網路時代之個人品牌工作坊》講者陣容
⠀
【劉育志】
從一個部落格開始，書寫外科行醫故事，成為暢銷作家，進而成為圖文創作者，再根據過去所累積的能力，創辦專業網路媒體「照護線上」，現已是台灣重要的醫療媒體。橫跨數十年，從部落格、書本媒體、Facebook 到 LINE 的經營，劉育志醫師在變化快速的網路時代中，都能持續跟上與創新！
⠀
【蔡依橙】
從學生時代 BBS 上的 SillyDuck 開始，轉型到個人部落格，再進入 Facebook，不論在生涯發展、醫學專業、時事評論上，都以深度思考和實踐為核心的個人品牌。匯流經營多年的醫學專業、教學成績，成立「新思惟國際」打造出高品質且獨特的繼續教育創業，深獲好評。學員多戲稱為「校長」。

大家好，我是Bryan。

以前當學生的時候我有個壞毛病，就是學新東西的時候只能一步一步來，某一步卡關了，我就會糾結在那個點上，除非真正搞懂，否則就是無法跨到下一步。

這是我高中以後成績不好的最大原因，畢竟考試可不會等人，我常常沒準備完就去應考了，所以看起來很用功，但其實成績很差！

但凡事都是一體兩面，後來上班我發現，我雖然懂得不多，但只要真正學會的東西，我多數都能記得，而且甚至比一些成績優異的同學更擅長應用，厚顏地說，可能是因為我有真正抓到這門知識的「本質」吧！

所以後來我自己當老師，設計課程的時候我也非常強調「本質」。我覺得老師的責任不是狂塞知識給學生（因為Google都有），而是用各種角度，各種維度，各種實例，只為了讓學生搞懂那最核心的本質。學生抓到核心之後，有更高的機率能自行應付形形色色的狀況！

為了更好的經營公司，前幾年我跟Joe去上了許多電商相關的課程，也有學到一些東西，但我總覺得課程少了點甚麼，就拿數位廣告來說，我知道了很多功能操作，也知道了一些設定技巧，但這背後的基本原理為何？為什麼要這麼做？我要如何驗證做法有效？還是讓我充滿疑問。

這有點像是老師告訴我：sin^2 + cos^2 = 1，好，我知道了！但 sin 是甚麼？ cos 又是甚麼？這兩個平方合等於一，So What？知道這個我能幹嘛？大概就是這樣越學越困惑的感覺。

後來我在經營模擬課堂上遇到 Joe Lin (林伯彥) 老師，他其實是來觀摩我上課的。聊幾句我就知道他是高手，是那種能抓住「知識本質」的人。他出身自eBay的數位行銷部門，目前擔任電商顧問，跟多數的廣告操盤手相比，他更了解整個企業經營的脈絡，畢竟廣告只是一種手段，更重要的是提升企業的業績。這也就是為什麼他的客戶在他的幫助下，兩年內從兩千萬業績增長到上億的關鍵！

2021年大人學推出的第一門實體課，就是由 林伯彥 老師擔綱的 #廣告數據分析與商業決策入門

我先說，這門課可能會有點硬，而且本身不教你操作（因為操作流程與演算法一直在變），重點是幫助你建立起廣告數據分析還有商業決策的基本功。

我會強烈推薦給真正想要學會數位廣告的新手參加，為自己的核心能力打下第一根基樁，抓到「本質」才能應變！

課程介紹：https://bit.ly/3385kZ0

對新手而言，程式交易其中一個難處是在於不知道要多少本金才去開始。今集 #我要做程式交易 Eva 會用幾個實例講解應如何計算自己需要多少本金。如有任何關於 Algo Trading 的問題，可以留言，Eva 和我們會盡力解答。

喜歡我們的內容，可以 Like 及 Share 給朋友。

#AlgoTrading #程式交易 #Eva #本金

======================
1) 程式交易新手會+試堂：https://edu.money-tab.com/eva-algo-sharing

2) 我要做股神APP下載：http://onelink.to/mtapp

3) 緊貼我們社交平台，不錯過任何免費分析/教學：
YouTube頻道： https://youtube.com/channel/UCdWNwPuaS1o2dIzugNMXWtw?sub_confirmation=1
Facebook專頁：https://facebook.com/203349819681082