Add subwasm guide

i18n/react-intl/en.json

@@ -158,6 +158,7 @@
   "htg-tools-try-runtime": "Integrate Try Runtime",
   "htg-tools-txwrapper": "Create a txwrapper for a chain",
   "htg-tools-sidecar": "Track parachain auction winners using Sidecar",
+  "htg-tools-subwasm": "Verify Runtime Wasm Binaries with Subwasm",
 
   "tutorials-beginner": "beginner",
   "tutorials-intermediate": "intermediate",

i18n/react-intl/fr.json

@@ -158,6 +158,7 @@
   "htg-tools-try-runtime": "Integrate Try Runtime",
   "htg-tools-txwrapper": "Create a txwrapper for a chain",
   "htg-tools-sidecar": "Track parachain auction winners using Sidecar",
+  "htg-tools-subwasm": "Verify Runtime Wasm Binaries with Subwasm",
 
   "tutorials-beginner": "débutant",
   "tutorials-intermediate": "intermédiaire",

i18n/react-intl/zh-CN.json

@@ -158,6 +158,7 @@
   "htg-tools-try-runtime": "Integrate Try Runtime",
   "htg-tools-txwrapper": "Create a txwrapper for a chain",
   "htg-tools-sidecar": "Track Parachain auction winners using Sidecar",
+  "htg-tools-subwasm": "Verify Runtime Wasm Binaries with Subwasm",
 
   "tutorials-beginner": "初学者",
   "tutorials-intermediate": "中间的",

src/components/DevNavMenu.tsx

@@ -503,6 +503,10 @@ const DevNavMenu = {
             title: `${intl.formatMessage({ id: 'htg-tools-sidecar' })}`,
             link: '/how-to-guides/v3/tools/sidecar/',
           },
+          {
+            title: `${intl.formatMessage({ id: 'htg-tools-subwasm' })}`,
+            link: '/how-to-guides/v3/tools/subwasm',
+          },
         ],
       },
     ]

v3/how-to-guides/08-tools/d-subwasm/index.mdx

@@ -0,0 +1,107 @@
+---
+title: Verify Runtime Wasm Binaries with Subwasm
+slug: /how-to-guides/v3/tools/subwasm
+keywords: tooling, wasm
+version: 3.0 
+section: how to guides
+category: tools
+---
+
+[Subwasm](https://github.com/chevdor/subwasm) provides a way to expose the features of the runtime for any Substrate chain. 
+This guide steps through the different capabilities that Subwasm provides. 
+
+## Use cases
+
+- Expose verifiable historical information of a chain's runtime for front end applications.
+- Get a snapshot of the modules in a runtime.
+- Check for changes between runtimes using a diff.
+- Expose a verifiable runtime for transparency in runtime upgrade proposals.
+
+## Before you begin
+
+- You have a chain running locally that is executing the runtime you wish to examine. 
+- You have [JQ](https://stedolan.github.io/jq/download/) installed in your environment to enable filtering the metadata.
+
+## Install and discover the CLI tool
+
+To get started:
+1. Install Subwasm by running the following command:
+
+```bash
+cargo install --locked --git https://github.com/chevdor/subwasm --tag v0.16.1
+```
+Make sure you're using the [latest release](https://github.com/chevdor/subwasm/releases). 
+This guide is based on version 0.16.1. 
+
+1. Explore the CLI commands by running the following command:
+
+```bash
+subwasm --help
+```
+
+## Get information about a runtime of a local chain
+
+1. Launch a local node from inside your chain's directory. 
+   This example launches a node template in dev mode.
+
+    ```bash
+    ./target/release/node-template --tmp --dev
+    ```
+
+1. In a new terminal, create a temporary folder.
+
+1. Use Subwasm to get and save the Wasm of your local chain.
+
+    ```bash
+    mkdir TempWasms && cd TempWasms
+    subwasm get ws://localhost:9944 -o mychain.wasm
+    ```
+    The `-o` flag will save the the Wasm file to `mychain.wasm`.
+
+1. Run the following command to save your chain's metadata to a JSON file:
+
+   ```bash
+    subwasm --json meta mychain.wasm | jq 'del( .. | .documentation? )' > mychain-metadata.json
+   ```
+
+   You can use JQ to filter the metadata details from the `subwasm --json meta mychain.wasm` command.
+   This example ignores all documentation metadata.
+   For information about the metadata fields that a Substrate chain exposes, see the documentation on [Substrate Metadata](https://polkadot.js.org/docs/substrate).
+
+1. Use the custom metadata file in a front-end application. 
+
+## Compare two different runtimes of a live chain
+
+You can also use Subwasm to compare the runtimes of a chain at different blocks. 
+In this example, we'll take Polkadot's runtime at block 500,000 and compare it with its latest runtime.
+
+1. Go to a block explorer and retrieve the block hash for the runtime your want to compared against.
+
+    For example, go to [PolkadotJS Apps](https://polkadot.js.org/apps/?rpc=wss%3A%2F%2Frpc.polkadot.io#/explorer) and retrieve the block hash at [block 500000](https://polkadot.js.org/apps/?rpc=wss%3A%2F%2Frpc.polkadot.io#/explorer/query/500000).
+
+    `0xfdeab19649426aadbdab046c9b5dac0a5b0c850b8fd0927e3b4e6c896d5fb0b7`
+
+1. Save the Wasm blob of a previous state.
+
+    ```bash
+    subwasm get --chain polkadot --block 0xfdeab19649426aadbdab046c9b5dac0a5b0c850b8fd0927e3b4e6c896d5fb0b7 -o polkadot-500000.wasm
+    ```
+
+1. Get the latest Wasm blob of the runtime.
+
+    ```bash
+    subwasm get --chain polkadot -o polkadot-latest.wasm 
+    ```
+
+1. Compare the two runtimes and put the output into a JSON file.
+
+    ```bash
+    subwasm diff polkadot-latest.wasm polkadot-500000.wasm --json > polkadot-wasm-diff.json
+    ```
+
+## Examples 
+
+There are many uses cases for `subwasm` as outlined above.
+Some additional examples include:
+- Compressing and decompressing a Wasm file.
+- Inspecting a Wasm file to verify a runtime upgrade in governance.