Skip to content
by Unity Nodes
NEAR Protocol

[REDACTED] 2024 | The Illusion of Speed Accelerating Blockchain Interactions

about 15:29 long

Nothing is loaded from YouTube until you press play, and then without tracking cookies.

About this video

Explore the art and science of creating lightning-fast user experiences in blockchain applications. This talk uncovers practical strategies for optimizing every touchpoint of user interaction, from app loading and wallet connections to transaction signing and confirmation. Discover real-world examples of what's working well, what needs improvement, and how to implement techniques that will make your blockchain applications feel faster than ever.

Evgeny Kuzyakov - FastNEAR

Takeaways: Optimizing Blockchain UX: While blockchains are inherently slow due to block production time, developers can enhance the user experience by minimizing perceived delays with caching, parallel data loading, and optimized RPC usage.

FastNEAR Transaction API: The new transaction API introduced by FastNEAR provides automatic retries for failed transactions, live transaction statuses, historical transaction access, and a human-readable status system to improve clarity for users.

Avoid Blocking the UI: To prevent user frustration, developers should avoid blocking interfaces with spinners during transactions. Instead, implement animations, notifications, or optimistic UI updates that simulate progress while waiting for transaction completion.

Efficient Data Loading: Data fetching can be accelerated by caching previously loaded data, leveraging APIs and indexers, and parallelizing sequential requests. These practices ensure faster, smoother user interactions.

Human-Readable Transaction Insights: The FastNEAR transaction API offers detailed insights into each step of a transaction, such as gas fee charging, contract calls, and finalization. This feature enhances transparency and provides real-time updates to users.

NEAR is the Blockchain for AI Website: near.org NEAR AI: near.ai Intents: near.org/intents Chain Abstraction: proximity.dev Sharding: nearone.org

For the devs GitHub: github.com/near Dev Docs: docs.near.org Devhub: devhub.near.page @NEARDevHub

Connect with socials Twitter:   / nearprotocol   Blog: near.org/blog Medium:   / nearprotocol   #NEAR #nearprotocol #nearai

Transcript

2,363 words

Captions as YouTube publishes them, usually machine-generated, so product and people names can be misheard.

  1. 0:00

    hey everyone um I'm yini or Eugene um and I'm currently uh working at fast near so today's talk going to be uh called illusion of speeded and uh I will talk more about like what we can do to uh improve the actual illusion not real uh blockchain because that's what B is doing so let's start um first so blockchains as slow and the reason for this is uh they blockchains so they build on top of blocks and the

  2. 0:38

    blocks takes time to produce so we cannot actually avoid this limitation even so um soon maybe like blocks going to be shorter so what we can do is to make sure that the rest of the interactions actually faster so what we're going to talk today about is first what you can do about your website about dat uh data loading then uh wallet signing and finally about transaction that going to be the biggest part so let's first start

  3. 1:13

    with um how to build a fast website so that's mostly outside of this um Talk uh but the main thing you can do is just make sure that website loads faster so you can use an edge Network some like Cloud flare uh you can cach your content especially static content so it doesn't have to come from your server uh you can um make sure that your initial page spawns faster so then minimize the size

  4. 1:45

    of the code and like stuff like this and finally the most important piece you don't want to block your UI on data so make sure it loads and you are not loading something like don't display a spinner so next like talk about um how you can load data faster and first thing is don't block the UI on spinner that's the most important so when you call the RPC and like load in 5,000 requests users just wait in here so don't do this

  5. 2:17

    uh you can cach the data that you previously loaded so if it's not a cold start uh you can like load it from like your local storage for example like from the browser and then uh you can reuse this data while the new data is loading to revalida in it so don't rely just on RPC so don't fetch all the data from RPC use indexers and uh apis like just statically store the content um the next thing is when you load the data so

  6. 2:56

    imagine ref Finance it loads all the pools that exist there in order to just display the uh the UI um you don't need to do this so finally you can also try to minimize the time where you need to load the data sequentially so for example all right let's load the account ID then from this account ID loads the list of the all the tokens the account has and then after that we can load like every single token

  7. 3:25

    and maybe like a metadata for each token so it's slow so try parallelize this if you can and uh final piece of advice use uh fast near rpcn API and you'll cut some latency there so the next piece is going to be um wallet sign in and there are also a few considerations you can do when you're building an app so first thing you can do just don't block the UI on waiting a wallet selector and just cash for example example the account ID

  8. 4:01

    locally so in near social when we building it one of the things we noticed is wallet selector spawn time was about 1.5 seconds so imagine you already loaded your static page and then you're trying to like get the account ID in order to display a profile picture so that process was taken 1.5 second while like you already know the account ID because the page was opened before so just get the account ID from the storage like local storage and display it immediately

  9. 4:32

    um also wallet selector is pretty large because there's ton of wallets there so every single wallets has some code that is um integrated so maybe what you can do is just load the code lazily and don't load it immediately uh like when the page starts finally uh well not finally but one important piece is when you ask user to sign in into your app often you don't need a limited access key so for financial applications most of the time

  10. 5:04

    um you don't really need to get a a limited access key towards a certain contract because every time you swap you attach one yaner and it goes to the wallet and you sign transaction in the wallet so you don't really utilize the limited access key and you can also um just use the signature so instead of if you need to authorize the user you can just ask for the like offline signature so that's what for example neari does instead of like getting the limited access key you

  11. 5:40

    can just ask like sence a message and then when they do this you can verify that the message was signed by the actual user and like by verifying their keys so now we get to the actual important part of the talk is how to make transactions faster and uh you cannot really like blockchains actually slow so you cannot really make your transaction faster um but what you can do you can make user to

  12. 6:16

    not um feel like they're slow so don't block the UI waiting for a transaction so that's very common right now whenever you go to the wallet and you do some transaction just shows you a spinner of the transaction getting executed and you wait for the fall see it executes and often for the finality and maybe even for gas receipts so it takes a while or you executing like some other transaction on a um on

  13. 6:46

    the front end and it also slow so what can you do so don't block the UI when you have a limited access key so limited access key allows you to execute transactions um in the app directly about going to the wallet to sign it so you can do a few things first you can just pretend the transaction already happened like that's what bar club did in the past when you draw something on a

  14. 7:10

    board it just pretends that you already did it and like it renders like you already did it and you don't wait for confirmation of the transaction until um it's completed next you can show notification so for example you can show like a popup and that's what MIM cooking is doing they actually like displaying that oh yeah transaction is executing um and you don't block the experience um finally you can display some animation but just don't use the

  15. 7:42

    Spinners that are Block in UI um instead you can display something like oh there's a hard jumping so when you lik something on your social instead of like blocking it completely just displayed small animation there um now we get to the part about transaction API so that's what we wanted to announce from Fast near that's a new thing that we are working on and it's coming soon so what are we soling with this uh new transaction API so first thing thanks to

  16. 8:20

    Bowen and the team from New Year one now we have the first problem to solve where RPC can just decline your transactions like oh yeah Shard is congested sorry and like you're like what I just signed transaction send it to you and you're like yeah canest it no so next thanks to uh chain signatures uh the transaction actually can be very slow so you send a transaction and it's just sitting there waiting for change signatur through yield resume mechanism and then RPC is

  17. 8:51

    like oh yeah time out 10 seconds is gone your transaction didn't execute sorry so the it's a problem right now um next transaction can be very old so like longer than for example five EO of RPC and then RPC will just say oh yeah it doesn't exist like I don't know cannot find it and finally the biggest problem is you block the UI so don't block the UI and we're going to solve it so here's how you can solve some of this

  18. 9:22

    with transaction API first we're going to AO retry the transaction so you send it to us we take care of it's getting include it in a block so if you cannot include it immediately we will retry to the next block until the congestion is done next we give you a Live status of um of the transaction so if transaction is executing we will notify you while it's going we also going to handle all the historical transactions so it's not only like

  19. 9:51

    one EPO anymore it's like entire blockchain history so you can query any transaction finally one of the cool stuff uh we will give you a human readable status of the transaction so you can display it while you um waiting for it and instead of just a spinner you can notify like what's actually happening and that's unique part about near protocol because um our transactions EX executes in a multiple blocks so they execute on a multiple

  20. 10:23

    contract and the transaction is just not one piece but actually multiple items so for example we'll go through this actually and then finally it's going to be faster than RPC um because we'll cach it and you don't need to run new core in order to do this so let's look at the example of um what we mean by human readable status so let's look at the simple swap examples through ref

  21. 10:53

    Finance um as you know that transaction takes about maybe five to six blocks and the reason for this it needs to go through multiple contracts so the first status that you will get when you use our API is we actually um received your transaction and we'll tell you all right uh here's a next status so that's optional you don't need to display it to the user but you can uh use it if you're interested and like oh yeah next status will likely include this in the block so

  22. 11:31

    the next status update is okay transaction was included in the block and your account was charged uh the gas fee so next operation we're going to go and call usdc contract um so when we call to use DC contract we can understand what's happening and we can say all right we just charged 100 usdc from your account and now we're going to call ref Finance now we swapped on ref finance and we know what's going to

  23. 12:04

    happen next because we know the receipts that coming out of this um execution so one of them is oh we're going to call usdc we're going to call for example rap near and we're going to schedule a call back back to ref uh then we finalize in usdc call and in parallel of this we actually transfer in you 10 R near from ref Finance and then next we're going to call ref is the call back okay

  24. 12:32

    finalizing the swap so all successful no need to do uh token refunds or anything like this so we're pretty much done so a transaction will give it to you or like our API will give it to you that uh transaction is completed and next is going to be like gas refunds and finally we're going to get the finality so the API will give it to you all through very simple um standard polling interface uh

  25. 13:07

    and it um it's kind of like how you would use similar to websockets except where uh it will just push it to you with the like Convent Source on JavaScript all right and I think my slides got messed up a bit uh on the order but we're going to talk about what if you have transaction right now what can you do to avoid uh blocking the UI in the transaction so first thing you can do is

  26. 13:46

    um you can uh send the transaction using a method send TX and then you can specify um a parameter and you parameter on RPC called wait until so this parameter specify what RPC should do and it has two options for you one is included it means the transaction was just included into the uh optimistic block and uh included final is actually the transaction was included into the final block like this finality so it's not going to wait for the whole uh

  27. 14:28

    status of the transactions uh but it's going to wait until just like you were charged for the guess so and then it immediately returns you the result that um what happened so that's important because you don't want to like your um status to wait 10 seconds or more to for the full transaction to complete so you want to know that the transaction was included and then uh you just want to give the control back to the application or to the wallet so the second piece when you

  28. 15:05

    query the status of the transaction you can also use uh wait until and specify none and that parameter will return you the result like the status immediately the current status it's not going to wait for anything it will just say Okay transaction for example completed five receipts um but didn't complete complete like entirely so you can call it multiple times while the transaction is executing

  29. 15:29

    um and with the new transaction API it will be like automatically given to you so you can read more about this on the docs and uh that's actually the best source of the information for the like current status of the transactions so stay tuned for our um API and uh thank you