为什么浏览器要花这么长时间才能读取区块链数据？

Question

我有一个dAPP，我使用reactjs作为前端。应用程序从主页上的智能契约(余额)返回数据。我注意到的主要问题是，每次我或任何其他用户访问它时，从区块链读取数据都需要2-3秒。在显示数据之前，余额显示为“0”，而不是实际值。

此外，如果使用MetaMask的用户更改了他们的网络(假设从Eth更改为Rinkeby)，则只显示0。

你也有这个问题吗?如果有，你如何处理？是否有办法提高从Blockchain读取数据所需的时间，还是技术的限制？

有些人必须了解dAPP的一般结构：

• 我有一个web3.js文件，它导入web3并通过MetaMask或Infura设置提供者。
• 我有一个deploy.js，它使我能够部署智能契约。此文件连接到rinkeby与脑膜和链接提供的恩弗拉。在输出中，我得到了接口和字节码
• 我有另一个javascript文件，其结构如下：

列表项目

import web3 from './web3'; 

const address = 'the address provided by the deploy file';

const abi = ['the abi provided by the deploy file'];

export default new web3.eth.Contract(abi,address)

编辑:发现我在ComponentDidMount (获取余额、地址等)中的操作越多，花费的时间就越长。

Answer 1

如果与活动节点联系以获取诸如帐户余额之类的数据，它将始终是缓慢的。

我最喜欢的方法是使用Amberdata's API接口，它的速度要快得多。您只需要一个api键就可以：

curl \
    -X GET \
    -H "accept: application/json" \
    -H "x-api-key: <your-api-key>" \
"https://web3api.io/api/v1/addresses/0xb7e3abd75119fe3cfc76015193226b21fc19230b/account-balances/latest"

它将返回如下数据：

{
  "status": 200,
  "title": "OK",
  "description": "Successful request",
  "payload": {
    "address": "0x06012c8cf97bead5deae237070f9587f8e7a266d",
    "blockNumber": "7446776",
    "timestamp": 1553638186000,
    "timestampNanoseconds": 0,
    "value": "65103167814228166337",
    "blockchainId": "1c9c969065fcd1cf"
  }
}

如果这对你有用，请告诉我！

编辑：

还有一个节点包装包！

Answer 2

您是否考虑过缓存数据或存储在类似HTML5会话/localStorage之类的地方。然后，您可以尝试从会话/localStorage或任何您首先考虑的缓存中读取数据，然后在可用时更新到当前余额。

假设一个微服务经常在后台运行，每分钟左右查询一次区块链，以获得像balance这样的信息，在内存缓存中保持最新的值，或者将其转储到不同的数据库，如果您使用它来更快地访问。

其他方法是在呈现UI之前拥有数据。

Answer 3

我们在使用恩弗拉的时候也遇到了类似的问题。恩弗拉可能会很慢，这可能会影响你需要多长时间才能收到回复。为了解决这个问题，我们切换到了炼金术，并经历了显著的速度增长。

如果您正在从Mainnet更改为Rinkeby，则可能不会部署个人正在查询的契约。这可能是显示的值为0的原因之一。