Frontend

⚡️Bring Your Own View Function⚡️

Problem: My ethereum UI must make 1 eth_call before it can pass the result into a 2nd eth_call

Solution: Do it in a single eth_call using Tevm

🧵 1/9

This problem is the waterfall problem. Ideally we want to minimize round trips to RPC providers

Round trips are common in ethereum apps. Tevm+Viem makes it simple to avoid them

https://tevm.sh

🧵 2/9

Let's say our UI is an input box where user enters a tokenid and our app shows them the balance

Can you see the problem?

🧵 3/9

Let's make this twice as fast by first writing our own view function

🧵 4/9

Then simply use our new view function with viem.

What is happening here? Let's explain...

🧵 5/9

We wrote our own view function and we didn't need to compile it. We simply imported it into TypeScript using the tevm bundler

https://tevm.sh/learn/solidity-imports/

🧵 6/9

Finally the underused `stateOverrides` option in viem

The result is twice as fast ux for end user

https://viem.sh/docs/actions/public/call#stateoverride-optional

🧵 7/9

Try out the code in an online code editor on stackblitz

https://stackblitz.com/~/github.com/evmts/quick-start?file=src/waterfall.bench.ts

🧵 8/9

Because state overrides are not universally supported, an alternative even easier abstraction will be provided in future. Follow me for updates on that

🧵 9/9