un.Block关于 Uniswap V3 的计算
机制改变Uniswap V3 采用了集中流动性（Concentrated Liquidity）。用户可以为自己的流动性设置一个价格区间。超出这个价格区间或低于这个价格区间，所有代币将被转换成两者中不值钱的那个。这一步转化造成的损失是无常损失。一个价格区间中的最小间隔叫 Tick，为 0.01%。 符号Swap添加流动性相关阅读：Uniswap V3 白皮书编辑于昨天 14:30文章被以下专栏收录* Blockchian；unblock256.com
un.Block矿工可提取价值
日渐增多的 MEV 可能导致了高昂的 Gas Fee在*上一期*的周报中我们为大家介绍了 Gas Fee ， Gas Fee 越高，交易就越可能被矿工打包。本期我们就来讨论一下这种打包机制所产生的问题，Miner-extractable Value（MEV）。 MEV 指的是矿工重新排序交易后可以获得的利润。在实际情况中， MEV 可能并不是矿工推动。有可能是我付出了一个很高的 Gas Fee ，希望矿工优先打包我的交易。 希望矿工优先打包交易的原因有以下几种：抢跑（Frontrunning）主流的 DEX 都支持滑点，也就是成交价格的区间，假设当前下单价格 100 块，滑点是 5%，这意味着成交价格会在 95 - 105 之间。 宽松的价格区间让套利者有机可乘。 假如一个套利者在内存池中（没有打包的交易都会在内存池中）看到一笔大额买单（币价即将上涨）。根据 AMM 的模型，只要有买单成交，代币价格就会上升。因此，套利者可以通过高额的 Gas Fee 或者贿赂矿工来插入一笔买单，抢在代币价格上涨之前完成买入。套利者的抢跑行为将导致后续的那一笔大额买单以以更高的价格成交。 其实在现...
un.Block流动性挖矿（Yield Farming）
⚠️ 以下为非投资建议 (No Financial Advise) 内容，流动性挖矿存在投资风险。概念流动性挖矿是 AMM 协议下的提供流动性的更进一步，它是通过锁定流动性来获取代币奖励。 如何获取收益*上期*我们讲到在 AMM 协议下，流动性提供者可以通过从交易手续费中获取一定收益。流动性挖矿与单纯的提供流动性（LP）略有不同，它是将组好的 LP，注入到资金池中（矿池），以获取额外的不同的代币支付奖励。用于奖励的代币大多为矿场的代币。以 BSC 上的 PancakeSwap 的 Farm 作为例子，这是一个 $BUSD - $BNB 矿池，在 Stake（质押、注入）前，我们需要先为 $BUSD - $BNB 交易对提供流动性以及 Approve（授权使用代币）。 LP 组好后，我们就可以将我们的 LP Stake 进矿池，开始挖矿。 一段时间后，我们可以获得 $CAKE （PancakeSwap 的平台代币）作为奖励，通过 Harvest（收成）我们就可以把 $CAKE 收入囊中。与此同时，我们的 $BUSD - $BNB 还在努力的工作，持续产出 $CAKE。 又过了一段...
un.Block关于 Uniswap V3 的计算
机制改变Uniswap V3 采用了集中流动性（Concentrated Liquidity）。用户可以为自己的流动性设置一个价格区间。超出这个价格区间或低于这个价格区间，所有代币将被转换成两者中不值钱的那个。这一步转化造成的损失是无常损失。一个价格区间中的最小间隔叫 Tick，为 0.01%。 符号Swap添加流动性相关阅读：Uniswap V3 白皮书编辑于昨天 14:30文章被以下专栏收录* Blockchian；unblock256.com
un.Block矿工可提取价值
日渐增多的 MEV 可能导致了高昂的 Gas Fee在*上一期*的周报中我们为大家介绍了 Gas Fee ， Gas Fee 越高，交易就越可能被矿工打包。本期我们就来讨论一下这种打包机制所产生的问题，Miner-extractable Value（MEV）。 MEV 指的是矿工重新排序交易后可以获得的利润。在实际情况中， MEV 可能并不是矿工推动。有可能是我付出了一个很高的 Gas Fee ，希望矿工优先打包我的交易。 希望矿工优先打包交易的原因有以下几种：抢跑（Frontrunning）主流的 DEX 都支持滑点，也就是成交价格的区间，假设当前下单价格 100 块，滑点是 5%，这意味着成交价格会在 95 - 105 之间。 宽松的价格区间让套利者有机可乘。 假如一个套利者在内存池中（没有打包的交易都会在内存池中）看到一笔大额买单（币价即将上涨）。根据 AMM 的模型，只要有买单成交，代币价格就会上升。因此，套利者可以通过高额的 Gas Fee 或者贿赂矿工来插入一笔买单，抢在代币价格上涨之前完成买入。套利者的抢跑行为将导致后续的那一笔大额买单以以更高的价格成交。 其实在现...
un.Block流动性挖矿（Yield Farming）
⚠️ 以下为非投资建议 (No Financial Advise) 内容，流动性挖矿存在投资风险。概念流动性挖矿是 AMM 协议下的提供流动性的更进一步，它是通过锁定流动性来获取代币奖励。 如何获取收益*上期*我们讲到在 AMM 协议下，流动性提供者可以通过从交易手续费中获取一定收益。流动性挖矿与单纯的提供流动性（LP）略有不同，它是将组好的 LP，注入到资金池中（矿池），以获取额外的不同的代币支付奖励。用于奖励的代币大多为矿场的代币。以 BSC 上的 PancakeSwap 的 Farm 作为例子，这是一个 $BUSD - $BNB 矿池，在 Stake（质押、注入）前，我们需要先为 $BUSD - $BNB 交易对提供流动性以及 Approve（授权使用代币）。 LP 组好后，我们就可以将我们的 LP Stake 进矿池，开始挖矿。 一段时间后，我们可以获得 $CAKE （PancakeSwap 的平台代币）作为奖励，通过 Harvest（收成）我们就可以把 $CAKE 收入囊中。与此同时，我们的 $BUSD - $BNB 还在努力的工作，持续产出 $CAKE。 又过了一段...
Subscribe to un.Block
Subscribe to un.Block
Share Dialog
Share Dialog
<100 subscribers
<100 subscribers
👨🚀 Glaze & Jasmine：大家元宵节快乐！
如果你喜欢本期内容，不妨在阅读后给我们点个 ❤️ ，并在下方订阅 un.Block Weekly
这一期我们简单的和大家介绍一下 Web3 的前端开发。Web3 前端开发和传统的前端开发不一样的地方在于需要处理钱包连接，调用合约等等问题。
在前几年，市面上还没有很多解决方案。前端开发者需要自己写钩子函数，或者自己手动维护钱包链接，交易状态等等。往往一个 Provider 和 Signer 需要在多个组件之间共用。
随着区块链开发者的增加，我们看见了更多好用的前端库。例如对于我们以上提到的这些问题，有这样几个前端库可以帮助我们：
这几个前端库实现的钩子函数不太一样，实际的使用体验也会有差异。在 Wagmi 的文档里详细列有这几个前端库的区别。
基本上这几个库的区别在于测试（仅 Wagmi 有详细的测试），更新频率，Typescript 支持，外部依赖，钩子函数，切换网络和钱包后数据自动刷新，支持的钱包，支持 Multicall（仅 useDapp 支持），交易通知（仅 useDapp 支持），UI 组件（仅 Web3Modal 支持）。
Wagmi 目前有 20 个钩子函数，925 Star，65 Fork，2 Issue，3 PR。
Web3-react 没有文档，2.9k Star，689 Fork，23 Issue，6 PR。
useDapp 目前有 23 个钩子函数，863 Star，200 Fork，81 Issue，9 PR。
Web3modal 主要支持各种钱包链接方式。
这一次的开发我使用了 Wagmi。其实 Wagmi 官方给的文档里例子不是很多。例如在文档里我没有看到应该如何使用 Infura 或者 Alchemy 作为 Provider 来解除 Ethers.js 公共 API 的请求限制。得益于新版的 Github Code Search，总能帮助我搜索到我需要的例子。
接下来我会展示一些可能有用的小例子。
这个例子展示了如何使用第三方的 Provider。
// App.js
import './App.css';
import { Provider, chai} from 'wagmi'
import { providers } from 'ethers'
import { InjectedConnector } from 'wagmi/connectors/injected'
import { ethers } from 'ethers';
// Chains for connectors to support
const chains = [chain.rinkeby, chain.mainnet]
// Set up connectors
const connectors = ({ chainId }) => {
const rpcUrl = chains.rpcUrls
return [
new InjectedConnector({
chains,
options: { shimDisconnect: true, },
})
]
}
const provider = () => ethers.getDefaultProvider("mainnet", {
etherscan: "xxxxxxxxxxxxxxxx",
// infura: {
// projectId: "xxxxxxxxxxxxxxxx",
// projectSecret: "xxxxxxxxxxxxxxxxxxxx",
// }
});
function App() {
return (
<Provider connectors={connectors} provider={provider}>
</Provider >
);
}
当我们需要同时使用两个钩子的时候，我们需要重命名返回值。对于不熟悉 JS 的读者，例子如下：
const [{ data, error }, connect] = useConnect()
const [{ data:network_data, error:network_error, loading }, switchNetwork] = useCustomNetwork()
🔔 订阅 un.Block Weekly 🔔
💻 Website： unblock256.com
✈️ Telegram： un.Block Weekly
🕊️ Twitter： @unBlock256
📧 Email：unblocketh@gmail.com
📤 分发渠道：知乎 | Notion | Substack | Medium | Mirror | RSS | 即刻 | 微信订阅
视觉设计：Jenny
特别鸣谢：
本文非商业目的转载授权遵循 CC BY-NC 4.0 协议
版权所有 ©️un.Block 2021
👨🚀 Glaze & Jasmine：大家元宵节快乐！
如果你喜欢本期内容，不妨在阅读后给我们点个 ❤️ ，并在下方订阅 un.Block Weekly
这一期我们简单的和大家介绍一下 Web3 的前端开发。Web3 前端开发和传统的前端开发不一样的地方在于需要处理钱包连接，调用合约等等问题。
在前几年，市面上还没有很多解决方案。前端开发者需要自己写钩子函数，或者自己手动维护钱包链接，交易状态等等。往往一个 Provider 和 Signer 需要在多个组件之间共用。
随着区块链开发者的增加，我们看见了更多好用的前端库。例如对于我们以上提到的这些问题，有这样几个前端库可以帮助我们：
这几个前端库实现的钩子函数不太一样，实际的使用体验也会有差异。在 Wagmi 的文档里详细列有这几个前端库的区别。
基本上这几个库的区别在于测试（仅 Wagmi 有详细的测试），更新频率，Typescript 支持，外部依赖，钩子函数，切换网络和钱包后数据自动刷新，支持的钱包，支持 Multicall（仅 useDapp 支持），交易通知（仅 useDapp 支持），UI 组件（仅 Web3Modal 支持）。
Wagmi 目前有 20 个钩子函数，925 Star，65 Fork，2 Issue，3 PR。
Web3-react 没有文档，2.9k Star，689 Fork，23 Issue，6 PR。
useDapp 目前有 23 个钩子函数，863 Star，200 Fork，81 Issue，9 PR。
Web3modal 主要支持各种钱包链接方式。
这一次的开发我使用了 Wagmi。其实 Wagmi 官方给的文档里例子不是很多。例如在文档里我没有看到应该如何使用 Infura 或者 Alchemy 作为 Provider 来解除 Ethers.js 公共 API 的请求限制。得益于新版的 Github Code Search，总能帮助我搜索到我需要的例子。
接下来我会展示一些可能有用的小例子。
这个例子展示了如何使用第三方的 Provider。
// App.js
import './App.css';
import { Provider, chai} from 'wagmi'
import { providers } from 'ethers'
import { InjectedConnector } from 'wagmi/connectors/injected'
import { ethers } from 'ethers';
// Chains for connectors to support
const chains = [chain.rinkeby, chain.mainnet]
// Set up connectors
const connectors = ({ chainId }) => {
const rpcUrl = chains.rpcUrls
return [
new InjectedConnector({
chains,
options: { shimDisconnect: true, },
})
]
}
const provider = () => ethers.getDefaultProvider("mainnet", {
etherscan: "xxxxxxxxxxxxxxxx",
// infura: {
// projectId: "xxxxxxxxxxxxxxxx",
// projectSecret: "xxxxxxxxxxxxxxxxxxxx",
// }
});
function App() {
return (
<Provider connectors={connectors} provider={provider}>
</Provider >
);
}
当我们需要同时使用两个钩子的时候，我们需要重命名返回值。对于不熟悉 JS 的读者，例子如下：
const [{ data, error }, connect] = useConnect()
const [{ data:network_data, error:network_error, loading }, switchNetwork] = useCustomNetwork()
🔔 订阅 un.Block Weekly 🔔
💻 Website： unblock256.com
✈️ Telegram： un.Block Weekly
🕊️ Twitter： @unBlock256
📧 Email：unblocketh@gmail.com
📤 分发渠道：知乎 | Notion | Substack | Medium | Mirror | RSS | 即刻 | 微信订阅
视觉设计：Jenny
特别鸣谢：
本文非商业目的转载授权遵循 CC BY-NC 4.0 协议
版权所有 ©️un.Block 2021
No activity yet