# Web3.js 1.0 - Channel: [Devcon](https://streameth.org/devcon) - Date: 2018-10-07 - Duration: 18:51 - Watch: https://streameth.org/watch/yt-92pdrRH_VGA - YouTube: https://www.youtube.com/watch?v=92pdrRH_VGA ## Description Visit the https://archive.devcon.org/ to gain access to the entire library of Devcon talks with the ease of filtering, playlists, personalized suggestions, decentralized access on IPFS and more. https://archive.devcon.org/archive/watch/3/web3js-10 Fabian Vogelsteller gives their talk titled, "Web3.js 1.0" Speaker(s): Fabian Vogelsteller Skill level: Intermediate Track: Developer Infrastructure Follow us: https://twitter.com/efdevcon, https://twitter.com/ethereum Learn more about devcon: https://www.devcon.org/ Learn more about ethereum: https://ethereum.org/ Devcon is the Ethereum conference for developers, researchers, thinkers, and makers. Devcon 3 was held in Cancún, Mexico on Nov 1 - 4, 2017 Devcon is organized and presented by the Ethereum Foundation, with the support of our sponsors. To find out more, please visit https://ethereum.foundation/ ## Transcript okay welcome back from lunch now we will be speaking about web 3js 1.0 which is a major refactor from the early version which was around for the last two years shortly about myself my problem-focused Ella I am bill T initially film wallet miss Bowser and worked on web through jazz since there are two and a half years roughly build a few other things also initiated the UC 20 tokens standard together with italic and did a lot of other smaller things in the space the web switches were 3GS is basically a library JavaScript library which allows you to interact with your theme node normally as a JavaScript developer you don't want to deal with low-level api and decoding encoding you want to basically have a nice javascript object which you can interact with and easily write your applications and web switches is exactly this kind of middleware it's widely used and actually the core piece of a lot of different libraries built on top and working for two years on it and it grew over time I found very necessary to do a overhaul so to say it was initially created by Jeff Jeffrey Wilker the go aetherium founder core developer and mary cutter which are but worked later on it I joined in 2015 working on it since then and we have also a lot of contributors and there's a lot more than on this list here so it started out in 2015 grew quite a lot and now we structured a lot in there 1.0 we factor so how exactly the theorem communication to applications work right the theorem note itself and the EVM especially only understands bytecode bytecode is not necessarily easy to work with for most application developers and everything which goes into the EVM has to be first translated to the BET bytecode to be able to be executed so for example this happens over the JSON RPC API which is a low-level JSON API where you have to send all of your requests and this has to be pre encoded to be understood by the VM and this is exactly what were three J's does for example if you look at this example here if you want to call a function in the EVM for somebody we want to call the transfer function with two parameters on a contract we would have to translate this by hashing do you function including its parameter types and then taking the first four bytes of that as the function name and then appending the other parameters after that once which s is exactly like taking care of that so you don't have to do it and you can easily community work with JavaScript objects and the 1.0 refactor is actually a major overhaul to make that even more convenient and even more intuitive and give you a lot more features and tools so that you can care building about your application rather than thinking about how to encode what and what kind of how to watch for your transactions and building all of that logic for yourself so I hope that 1.0 fulfills all of that needs and is kind of the that developers best friend so the 1.0 refactor is a major refactor in the sense that i restructured a lot of the tools everything before was on the major object kind of like this burst this way and now we restructured it in proper elements utility functions are for example under the utility objects and all of these packages are also separate packages so you can load either the ones you need or you can load it all together in the umbrella package so I will now go through all of these package separately and show a little bit of what I have and what new features they have one obviously very important piece in this is that we now have promises something which was something which probably took way too long this is all due to the way how it COO over time and we all had to figure out what works and what doesn't work initially think thinking also that the connection to node will be way fast and way more smoothly than it actually is with like large network which we crew today to basically promises allow you simply to chain your functions which makes them more convenient and more easy to use and to see but we have a special case in web switches and especially with block chains we have the case that you have an event which is not necessarily final so it cannot really come with one result only especially when you send the transactions there's the possibility that you can you get a transaction hash but you're also able to get the receipt and there's also a lot of other things you have to take care of for example to change and reorganize for certain amount of blocks with a likelihood so you have to take care of all of these things yourself so when you just use the promise for example you get the received which is what most developers want they won't simply send the transaction and act once their mind but in most cases you actually want to have more complex and more detailed response to you up to your transactions maybe you want to wait for five confirmations or maybe you want to actually do something with the transaction hash directly so this prom event construct basically allows to get all of these different types you can get back from one transaction and do something related to it so it can be a promise but it can also be an event where you can wait for a transaction has to receive confirmation and we can even add a lot more in the future web switches 1.0 has a subscription and this is something I worked on quite long and it always takes a bit of time to convince many parties to do something and you are different or a certain way and subscriptions are important because we have a lot of events coming from the node and the old way of doing that is that your application is polling that node that works quite fairly well if you have one application and you bought for a few events but it doesn't really work well if you have many applications polling on the same node so subscription basically allows you exactly this pops up model where you can wait for events and you have to do nothing best but waiting until it happens this which uses a lot of the resource load you have in the node and this also improves the processing you need to do on your node itself on your application itself so IPC sockets is basically the local socket you have when you notice running locally and web socket is when you would you talk to a remote node the HTTP still works as well but for subscriptions it can't work there we are thinking about using also some kind of polling again but ideally you make it work with web sockets or you actually have a local node running directly so for example a subscription could be locks or pending transactions or if you know the syncing or not the advantage of that over the previous way how we did it is that it's a lot more intuitive and a lot more clean right now you can basically subscribe for information which is a pattern most people understand before we had like filters and watch and get watch and which was very unclear of what it even means now everything is under the sub Cripe namespace and it's pretty clear that this will be an event you're you retrieve but also here we have special cases that ins ank some cases you can have an event which actually can change for example you can have an event coming from a smart contract and it might be different after chain organization so that's why we also here need this kind of pattern that we are able to wait for the data the actual event or we are also able to wait for the changed event so we can reverse it in our dab and we can apply the Newton to new log which might look different it might have different results the way smart contracts are initiated in the new web 31.0 is more the way we would expect it when we actually initiate a class object so you have to use the new keyboard a keyword and you have to give it a JSON interface this way you instantiate the object and you can give it an address optional or additional options therefore also the options are in a separate options object so you can easily see what are the current settings of your contract object also to note here is that all the addresses returned from web switches are now check some addresses you cannot see this here in this example but actually you can see it from it has an upper case D for example upper case F so when you use an address and you pass it in you send it into any kind of function in web to test if we check to check some and if you check some is invalid it will fail if you pass in a lower case address it will just accept it as is because it cannot check to check some now in the smart content object itself all the methods and all the events are separated in its own namespace this helps with things like where you have an event may be called the same way than a native event on this mark on the object and when you call that event it gives you back a object with moldable actions you can now do with that function so for example if I call this do something I get an object back where I can also later even change the arguments or I can decide to do I call that on my note do I send the transaction off to the node to be mined in the network or if I just want to estimate the gasp of this transaction or I maybe just want to encode the API to be used in as a parameter and another function and also here we have the ability to add even more if we need to in the future and extend whatever the method methods of a smart phone can do so if you for example call that it would look like this you call the method on the methods namespace you paste in the parameters and as we also now paste only parameters of the smart conduct function in the parameter space we are also in the future able to allow structs which we are working on right now before the struct was always meant as the transaction object so there was a bit of a confusion and if you didn't want to send it you give it your the options object of the central section for example for example if you then get this back and you wait for the receipt or you just like we solve the promise you would get back to receive and it would be decoded parameters also the raw data and everything else you need so the structure is a lot more clean and a lot more accessible than it was before same here if you have an event so if you have an event it's under the namespace events you could have an additional options that you want to fill the for specific events for example you could say I only want to have events which matches the my index parameter 20 with the value 20 and 30 and my other index parameter has to have an address so and so and it would then only which we view these events matching that and you would get them basically once they are happening and this is under the hood using for example subscriptions which right now it doesn't work for HTTP so we have to at the polling here web 3 use accounts that's actually a complete new thing because web through these accounts allows you to actually generate accounts and sign data sign transaction encrypt these accounts decrypt these accounts import key store accounts and basically gives you all the tools you need if you want to interact with a public key private key account and having these signing functions in Webster HS directly allows us to do a lot more what you before would have to do with multiple libraries a note here this is still in better there's no all and run on that so use it at your own risk we will ideally have an audit on that and then it's probably more safe to use we have a bi directly a bi encoding/decoding functions I think this is very important because you are able now to like encode your own ABI calls decode them and you have all of this what was what she was before inverse which is internal exposed and nicely named and so on it even can decode you a whole lock automatically we have now the new swarm API as well so you're able to interact with swarm swarm works a little bit different than the film node so the provider is different it doesn't use this the IPC connection you can either use directly HTTP or it connects to your local swarm node which opens a local host 8 5 something endpoint and this basically allows you to upload files download files and even opens a file picker way can file pic so if you in the browser you can pick your files and upload them to Swan directly and you get the hash back to interoperate with it whisper is currently the whisper version 5 API in web switch s there's right now a discussion about refactoring into version 6 which will also be supported by parity the current version 5 is basically in the old web switches and Oswell and the new one and you can play around with it and experiment and the details function obviously there's a lot of extra utility tools you can use there's a lot of things you would use as a that app developer especially here things to check for example focus champ check some addresses encoding and decoding to a certain extent especially from utf-8 I'm converting numbers and internally right now we are using always DPN library but when it returns a number it returns the number as a plain string so that you can actually use whatever library you want to interact with large numbers and it's also for debugging reasons a lot easier to see the number rather than a big number object and very important probably also you're able to hash exactly the way solidity hashes so this allows you to basically generate some hash and then knowing that the smartphone itself would come to the same hash so this is tightly packing the arguments the multiple ways of how you can do that you can use the order detection which is probably not very safe for things like numbers which simply convert to you in 256 it's easy a string would be converted right from a utf-8 and obviously bytes would be bytes the byte 32 right now I think but you can also give it an object and tell it the exact type so this can be V and T but it can also be value and type and you can basically tell them hey this is my arguments this is the type of the arguments and then hash them yeah it is just a longer version and this is another worse so yeah actually it works right now I think for the reason how NPM works it will right now by default install the beta version which is probably not very wanted but this is the fault of NPM I guess and there's a extended documentation now which is a major improvement to the documentation we have before basically all the functions are documented and they're all with examples and everything so go to read the docs right now you have to go to the 1.0 branch if you want to see the 1.0 documentation the old one the old branch doesn't have any so go to E and 1.0 and you can read the docs and that's the end yeah [Applause] [Music]