What’s new in useDApp 1.1

Przemek Rzad
TrueFi Engineering
5 min readJul 19, 2022

--

It’s been a ride! useDApp 1.1 is the culmination of hard work and efforts made to address issues and feature requests raised by the community since the release of useDApp 1.0.

UseDApp is loved especially for enabling the developers to effortlessly keep an up-to-date blockchain state, at the same time leveraging Multicall to keep the API provider (such us Infura or Alchemy) bills to a minimum. Now we grant more control to the developers over the process of refreshing the state, so that the app performance and provider bills can be optimized even further.

🚨 Most Wanted Features

The community has spoken, and we have listened. Most wanted by the users were features related to limiting requests to API providers such us Infura or Alchemy, in order to reduce the number of billable RPC calls.

Our response has materialised in the form of the following features:

  • Static calls — for all those non-updating queries. Why waste resources for asking for a token symbol that does not ever change?
static useEtherBalance — works by adding “isStatic: true” in the query params
Static useEtherBalance — will query for balance just once.
  • Detecting if the window is not active — Forgotten browser tabs will not eat up your RPC provider limits.
  • Ability to refresh data every N blocks — Is your data changing so frequently that it needs to be refetched on every block? You decide!
refresh: 5 — in useDApp config, will change refresh frequency from every block to every 5 blocks.
Configuration option to refresh every 5 blocks instead of every block.
  • useDapp no longer continuously queries for eth_chainId if not necessary.

👨‍💻 Other Improvements

⛽ Gas estimations with a safety buffer

Estimating the gas requirements for transactions can be tricky — you never know if the amount of gas needed will change between the moment of estimation and the moment when the transaction gets mined. The state of the blockchain can change in the interim — and so can the amount of gas needed to execute the transaction.

In useDApp 1.1, we included the configuration option gasLimitBufferPercentage which adds a safety buffer of additional gas limit to the estimated transaction. For example, setting it to 20 adds 20% on top of estimated gas limit values.

gasLimitBufferPercentage config option can be set for additional 20% safety limit.
Configuration that adds 20% to transaction gas limit estimates.

Individual percentages can be set on individual contract functions separately.

bufferGasLimitPercentage config option can be set for additional 10% safety limit.
Setting gas limit buffer on individual contract function — will add 10% safety buffer.

🐇 Speeding up Multicall encoding and decoding

In a production environment, things start to get challenging. We have profiled useDApp deployed in production in TrueFi, and we have found that a lot of CPU resources are used on encoding and decoding the Multicall calls.

After doubling down on it, we have come up with an optimized way to execute those encodings and decodings, which results in a better performance of DApps.

fastMulticallEncoding: true
Enabling the fast multicall encoding optimization in the config.

You can enable the optimization in your configuration with the fastMulticallEncoding flag. See if it makes difference in your app under a heavy load of blockchain queries.

➡️ Automatic Multicall2 deployment for local development

Multicall is a backbone of useDApp — allowing the DApps to efficiently query the blockchain data on every block. For ease of development, a Multicall contract is automatically deployed on a local chain such as Ganache. Now it includes Multicall2 as well — everything happens automatically out of the box, no configuration needed.

Multicall2 is (obviously) an improved version of Multicall, featuring separate errors per every call, so that a single failing query does not impact other queries.

👥 Community in Action

We ❤️ open source. We’re glad to see engagement in the form of feature requests, reproducible bug reports, and even finished pull requests with implemented features — for example, producing new hooks like useLogs.

Reach out to us on discord if you have ideas and would like to collaborate on making them happen.

🧹 Housekeeping

Open source library is like a big household — there is just always something to do.

  • useContractFunction has been made more uniform with other hooks — it now accepts a Falsy value just like other hooks.
  • Include a workaround for this MetaMask issue — with an experimental noMetamaskDeactivate flag in the config.
  • Portion of the documentation (hooks API) is now auto-generated based on JSDoc and the actual code. Keeping documentation close to the code makes it easier to keep it up-to-date.
  • Portion of the live examples in the docs is automatically tested with Playwright.
  • Correctly decode error when a call in Multicall2 fails.
  • Resurface an error if activateBrowserWallet fails.
  • Make sure useDapp works properly in a Next.js setup by creating a new example app.

All in all, we have more than halved the amount of outstanding issues on GitHub — and we’re hungry for more!

🔧 Technical Adjustments

We have fine-tuned some technical details in the package.

  • Support projects with isolatedModules enabled in their TSConfig.
  • Properly set react and ethers as peer dependencies.
  • Every change is deployed to NPM under a dev tag — for those bleeding edge fans.

Let us know on Discord or on GitHub if something is not working exactly right in your setup.

👉 What’s Next

💵 Wallets, wallets, wallets

There are a lot of different wallets in the industry, each with its own little quirks and each working a little bit differently than the next.

We’re reworking the way browser wallet connections work in useDApp. We’re hoping to achieve more reliable connections to the wallets, easier switching between one wallet and another, and more stability in general.

📖 Improving the documentation

We have recently redesigned the documentation, with live examples that can be tested out right in the browser. We’re planning to continue working on the documentation in order to make it more understandable and comprehensible — especially focusing around the most frequently asked questions.

📻 Stay tuned for updates — and please reach out to us if you have comments or suggestions. 😉

Happy coding,
Przemek

--

--

Przemek Rzad
TrueFi Engineering

Software Engineer at Truefi Engineering. Currently working on open source tools — useDApp and Waffle.