# The new Web3.js - Fabian Vogelsteller

- Channel: [Devcon](https://streameth.org/devcon)
- Date: 2017-10-09
- Duration: 12:49
- Topics: blockchain, smart contracts, distributed ledger
- Watch: https://streameth.org/watch/yt-UI6dBX3ydrE
- YouTube: https://www.youtube.com/watch?v=UI6dBX3ydrE

## 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/2/the-new-web3js

Fabian Vogelsteller gives their talk on the new Web3.js

Speaker(s): Fabian Vogelsteller
Skill level: Advanced
Track: Developer Infrastructure
Keywords: json, rpc, translate, code, abi, javascript, socket, filter, subscriptions, calling

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 2 was held in Shanghai, China on Sep 19 - 21, 2016.
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

so I have to be quick now okay so web switches which is like a very core important part of the whole ecosystem a lot of people use it it's totally about me I build a content management system open source libraries worked as a web designer for like 15 years so I wrote a book about meteor and built the mist web browser and the theme wallet how it is today now our team is a big bigger than than just me and Alex we also have RAM Everton and Luca as part of the team if you're somewhere here maybe you want to send up or you're probably sending already on the side there he is there's everyone so and it theorem JavaScript API or web three.js how it's called so I contributed to this as you can see here this is kind of like the graph off of github contributions I'm there in the middle the screen figure but it was originally started by Jeffrey who wanted to have a simple way to access or like view of the node and JavaScript writing simple scripts to interact with the node building little dabs later then joined Marek he took over the project and basically built most part of it what is currently the web three.js I joined like almost two years ago and helped refactoring a lot of this under the hood code improving the API and adding additions I wrote or restructured the RPC endpoints to make them more readable understandable and basically because mark is now part of its core and working on parity I'm maintaining web 3j s we have also other contributors Alex there too and a lot of others actually who also helped out so the main reason of web 3 JS is because the node only understand understands JSON RPC so basically what JavaScript or what web three.js does is it translates this JSON RPC code calls where you send a JSON object into something you can actually easily use in JavaScript and it looks like calling simple JavaScript objects the evm itself only understands pipe code and that's not easy for JavaScript developer and that's probably not easy for most people and it's not really human readable so basically what web dj's helps is translating these function names through what we call the ABI to the application binary interface to something which DVM understands and to do that you basically take the you take the function the transfer including its parameters you shall three that and you take the first four bytes and this becomes the function name and then you add the first parameter and you add the second parameter in this you send over JSON RPC to the to the node and this way the node understands what to do in the smart contract and basically web bridge is in the contract object does all of this for you so you only have to deal with JavaScript object they look like normal standard functions but under the hood it translated to this ABI in webpages you also have a bunch of other tools and utility functions you can use in your application but because it crew over the time it's quite messy right now it's it's it grows it could just over time with a lot of people influencing the decisions and that's why there's time for new we're three chairs so the whole idea is that it's um like the way it grew it became to a point which it's influenced by so many sites that it's not really easy to use for JavaScript developers and there are certain parts which actually doesn't don't make sense as a as a JavaScript library and it became clear to me that this needs to have a refactor at some point and the community also asks for other features and things and want to have things changed and that's basically what I'm right now working on is like making the new website you were three chairs so it will be a refactor it's not built from scratch and it will not completely change but it will have core pieces changed and probably one of the main one is that the communication will be socket based so currently everything is done in HTTP requests and this will still work but they will not work for everything because of the nature of what we do which I will show later that we have subscriptions and subscriptions need sockets so you can either use the IPC socket which is like your local socket you use to talk to your note on your computer or you can use WebSockets so before we had this concept of the filter and this concept was rather confusing for many people so basically what you would have created a filter watching for lock events and then you watch it and then you get resolved or the lock at some point but this whole like it's not very descriptive and it's also in the JavaScript world not comment to do it this way and it confused people because they thought eh I can filter for a transaction for an address and I get all the transaction of this address there was also my first understanding of that function but that's kind of like wrong right it's it's not clear and makes no sense like this so the real way of doing this actually is subscribing to something and with the new locks it's actually even technically working as a subscription so you basically just subscribe to locks you pass in another options object which can be the topics in this case and then you just wait for the data changes to well three J's right now is like a big bulky library you have to use if you want to use web switches in the future this will be more split in separate packages where you also can require the large package web 3 which we have which will have everything you need for your dab or you only need the utility functions or your only detail functions only the swarm functions and one big part of the refactor is the way how we call functions so we currently had this way of calling function synchronous which is a terrible idea because in JavaScript when you have synchronous functions your interface freezes the assumption was that the responses from the node will be so so small that you never have a problem with that but reality teach to us that that is actually a problem and it's also not the way you can do that in JavaScript so from the future on everything will be based on promises but there's this special case and etherium that one action can have multiple end results I combine that with events and you basically get an promise event back so you can chain it and then will be called once the transactions mind but you can also listen for specific events for example when you want to get the transaction hash or like the mind event and in the future we could add more events we could add programmable a confirmation event or an event for each single confirmation up to 12 confirmations we can think of way more things we can actually look for on what happens on the field network with your action you did the same goes on for other functions the question here is do we need like the events here to that's to be seen but at least keeps consistency deploying contracts and the main change is that actually you now instantiate the new contract object using the nique new keyword you don't have a deploy function and this will be the same as the transaction you basically just the promise we solved once the transactions mind and you actually have to contract address object the contact address and the contract object attached with the address and you'll also have this event so basically you have two ways of doing it and there's also debate going on should we add two callbacks or not when you calling methods so that's actually a better way than we did it before so you basically will call the method you give it all the parameters and be caught because before we basically mixed parameters with the transaction object we had the problem that you could never pass a struct in as a parameter object because we're three J's would have detected this as being the options object for your sin transaction so doing it this way it allows us to basically pass any kind of parameter and it would be clearly only a parameter then you get an object back which has different functions like estimate gas which gives you the gas estimation for that kind of call and code which encodes you the the ABI for that kind of call which you could then use and pass it into in the contract for example if you have a proxy contract or you calling the function or sending the transaction for the function and this again will return a promise or an ester and events you also will have other utility function which you right now don't expose but they're very necessary if you want to build more complex application and you want to do things yourself means you can encode like you get the chase interface just of a method and you can code the whole thing if you want to do this in the contract object you already have the encode functions function you also have a constructor function which you cannot call or send transactions to but which you can also encode and there's more to come for example like passing in structs returning structural smart contracts and I would like to get feedback and ideas so my main idea is doing everything which is currently in the 1.0 milestone and working through it and doing it this way and then releasing an alpha getting feedback from the community and then we can go on and released at some point a web 3js 1.0 which everybody is happy with and which will be hopefully the only breaking changes for the next few years but there will be a few breaking changes but necessary ones so your feedback is welcome the keto Channel and the issues ideally and let's talk about what's what could be next Thanks thank you for the end did you want to take a question I can take questions yeah if I have time yes any questions for Fabian any questions come on yep perfect microphone with the next rewrite do you plan on utilizing type scripts to help make it cleaner and help to check for standard bugs and things like that yeah what makes sense right I want to keep it as minimal as possible if other people want to build on top like something like a typescript compiling version yeah that makes sense but I want to keep it as like a bare minimum library otherwise it's getting a point put opinionated again and then there's a bunch of discussions its cousins and other people would then use CoffeeScript and everybody wants to do use something else so I stick with the pure JavaScript anyone else okay well thank you very much Fabian