Yellow Network High Performance Apps with State Channels I Andrew Kushniruk

[Music] Hey guys, hello everyone. Uh today going to speak about the infrastructure and how to build uh on web three but into web. Uh our agenda for today will be very simple. I will try to answer on the question why, how and what and in the end we will see some example of the application. One of them it will be tipping up another one it will be simple snake game and as I know some people interesting about all of it but let's start from why as in our company we figure out that we have the core problem uh is first one is pure user experience of course we have abstract accounts we have zk roll apps we have a lot of stuff but still like user when when they want to do like a lot of transaction huge amount transaction like in video games or like in exchanges they don't want to wait when some block will be mined or they don't want to wait and this time can be be painful for them.

Another one for builders it's complex. Yeah, for us web web3 developers it's pretty easy and we understand solidity. We understand how the web three work. We pretty common to work with MetaMask and abstract accounts but what about web two builders web two community and no one asked them like how we can bring all these developers to us and help us to build application and all of us know that we have bigger community in web two than in web 3 and that's why we built the SDK where you will be focused more on the API on the application cell than on the blockchain another one important for us in yellow is a market is fragmented liquidity and basically we have liquidity what is fragmented between all chains you have like salon you have m chains and all of them have liquidity but our solution is going to abstract all of it in new layer and you can see about like layer where everything is connected and let's speak about the user experience you can see the game pretty common shooter game where you you need uh instant finality. You you click on the shot and you can see pop up of the metam mask.

You don't want to have it like you want just to play the game. And we can speak about it a little bit because like it's happened not only on in the video games, it's happen in the trading. It's it's happened on the unis swap. It's tra it's happen on one in everyone everyone have this issue. And basically the problem going not from blockchain itself like the root cost is not the blockchain because blockchain was built in the way to send make it secure and send transactions from one person to another person.

It in first place it was never about high frequency PVP or high frequency trading. And now our users our community understands that we need more. We want to build real application. Someone would like to build second Uber and for them need speed like driver and Uber don't want to wait when transaction will happen and yeah we have some error let me see yeah we are disconnected yeah I can explain yeah should be like okay we can continue. Yeah.

Yeah. Perfect. Okay guys as I was saying before like about the architecture of the blockchain and the root cause like you can see on the for you left side uh you can see the problem like action blockchain and after that the result and we need to wait when it when it will happen. From our side what we proposing is a speed in first place you have action you have the result you don't need to wait for the blockchain and basically solution and instant how we can get it based on the three pillars first pillar is uh our settlement chain basically it can be any VM it can be salana bitcoin like we don't care we just deploy the contract and it's protecting everyone and basically it's police and judge in the system who looking for everyone like you don't want to scam or if you will scaming I will come and I will apply on your penalty next layer uh is a smart contract is our contract and also where you will be more interesting is the interaction layer basically it's message broker and everyone who running the node or sharing the information like in blockchain basically we have not who collecting the whole history and know everything what happened on on in the blockchain. In our case, we have the same same solution, same architecture, but we do not waiting for a new block.

We just synchronizing uh each not what is running right now. And the last layer is experience layer is uh our applications where the user come and just interact. They do not worry about yellow network. They don't worry about security. They don't worry about smart contracts.

They just using the app how it should be. And let's speak now how how to build in web toway. On the left side you can see application. It's your application what you're going to build. On the right side you can see yellow node.

It's where you making the connection and the connection goes through the web socket. We build the standard neutralizer PC for sending the messages and basically that's what you need. You don't need anything else and you have your web two developer experience. Still for security we have our smart contract that I mentioned before and we have channel interaction all the information what happen in the network can go to the chain for verification now let's speak about the authentification the first part how user how the application can get access to the network as I mentioned before we have application we have yellow node and on the right side we have another person is UI It can be any wallet. No need to focus on external own accounts.

It can be abstract account. But basically your application generates session key for the user. Sending the authorization request request to the yellow note and receiving the challenge. It's a challenge token for which need to sign with EOA like any wallet. And this wallet will become the owner of your in-house yellow account.

And basically your user will will feel like I registered session key. I can interact without any signing. Right now our UA returns the signature. We send back to yellow not uh verify basically our signature and challenge token receiving the GVt and we storing it. After that, after this all uh uh after this whole flow, you will have your authorization.

You will have full access to the yellow network and you will be able to get your balance to send the transactions or to create virtual sessions between the users like a lobby way for tutorial. It's pretty important one. Uh we have GitHub repo ERC 7824 Nitro Nitrolite example and the most important chapters what you will need to take a look during the building the app is authentification basically on client on server side you just you can copy just part of the code you do not spend that time and just focus on the application itself. Chapter four is about how to get the balance of your user or or of your application. And the last final chapter is about P2P transfer from one user to another or you can think about it like payment like some microp payment.

Uh and now let's quickly switch to the GitHub. You can see I'm in Nitroite example and we have all the chapters. Uh let's try to open it. Internet here is a little bit slow but you can see the all information like what's the goal of the chapter. You can see the se sequence diagram how it's going to work and what you need to do and it's have all steps what you need like install the package uh interface to generate the session key and how to store the session key in the browser.

Still I would not recommend to store the session key in the browser. Uh for PC MVP applications is good but for production grade application I would place it in some protected uh storage that no one can steal the session key of the user. uh important one is websocket and you can just copy the how we sending the message and the whole interface and you can see that uh our package provide like all the function it's not sending the function instead of you it's just building the message what you would need to send to the websocket to yellow node and basically you just using the function what will prebuild everything for you the most difficult and tricky part with authentification that we using EP712. Uh it's type data you need collect and it's super strict to sign. Uh but it include a lot of benefits.

It include allowance for the session key. You for example you don't want to spend $100 in some application. You won't want to specify only $10 for this application. This one will support it. And also you can specify the scope like read only balance or create create application session like lobby rooms uh or just uh you can put null to just read about the application.

Yeah. And you can find here the all information about how to connect wallet, how to build wallet client. And this one you can go and read, copy it. Uh and also interesting one is P2P because basically it's it's payments. That's why like if you finalize your subation, you just go to the payments and you can see like it's send sign transfer request.

It's go to the yellow node process it and you receive confirmation and it's happen immediately and also the code whole right now you can see it's react code uh it's react hook uh and you can see how it's simple like we create the hook and we call colon create ecda message signer with our session key and after that we call the function from the library and send it to the websocket It's pretty simple but still it can be tricky uh if you will not pass the optification. Uh let's go back to the slides. Next one. Uh yellow obsessions. Uh you can think about it like lobbies.

Everyone who building uh video games or something where you need more than two participants like uh a room of people and you want them to interact and to secure you would need to use obsessions. Basically it's creating virtual channel between all of them like inchain they don't need to pay gas uh but they lock in the funds in uh during this obsession. You can send about it like uh really game for 20 30 minutes like chess match or uh or like League of Legends or Dota 2 or it can be trading session. Uh you can just like do uh you can do trades you can create order and you allocate only specific amount of funds for this trading session and you can have like enormous amount of the application sessions. How it's work?

You creating the session signing it with the session key interact of chain you collect all the history what happened in your application and you and you closing the session where is onchain part app. Uh it's website uh where you login with your wallet metamask right now uh deposit dep depositing and creating the channel on chain from any chain what you would like what we have right now. If you need some additional chain what you can't find on apps.yal.com com we have booth you can come and say we need some additional chain and we will add during the hackathon this chain to support you also for the test net we have celebr what support all test nets uh still it's doesn't include the UI basically it's tool that where you can do everything from the terminal uh and what this will unblock for you as a developer You can build with web to speed.

You can use chain abstraction because you don't need to bother from what chain the user in the Y network you come from polyhon. I came from arbitum. Still we have unifi balance uh across whole network. Uh single sign flow everything going through the session keys. That's why you will not see your pop-ups from uh wallets.

We have SDK. We have SDK for TypeScript. We have SDK for Golang. Also you can use directly API if you would like. If you big fan of Rust you can just use API.

Uh it would be much complicated but still it's possible to do built-in security. We have disputes we have challenges and the blockchain you don't need to build it and you don't need to think about it. It's already built in in the yellow network. That's why you most focus on the application itself and what you can build microp payments application trading experience like really trading exchanges with uh you your user will receive the centralized experience but he will be protecting and it will be understood work like the centralized one. Uh you can build the greeting tipping app.

You can seen about like uh teping for for people in the restaurants for example. You can build the application like global tips and everyone can go scare code and and tip uh realtime multiplayer games and any application where you need speed. Uh also you can find the yellow SDK uh under the code. We don't have time. I would like the shows