and today I want to talk about browser
3.0 how to build secure secure web 3
clients and I would like to start with
this quote there are two ages of the
internet before mosaic and after the
combination of protocols with a browser
which provided a great interface proved
explosive in 24 months the web has gone
from being unknown to absolutely
ubiquitous and I like this quote because
I think it's important to remind
ourselves that the Internet is not so
old and less than 25 years ago no one
was really talking about the latest web
development framework trends
no one was sharing stuff on social media
because the internet didn't really exist
and people were more concerned about
like infrastructure things and protocols
and how to scare this thing and only a
very small group of people actually had
the the knowledge and the tools the
money the resources in general to access
the Internet so it was very similar to
what we have with if you know but then
something something happened the browser
was introduced and now people actually
could access the internet and then mass
adoption started and we will probably
see this once the scalability and
protocol problems are solved and that
there's some kind of message option for
a theme as well and then some some funny
funny things can happen and I want to
show you how this looks like so we are
in the year 1994 its December 1994 and
Netscape Navigator 1.0 was released and
suddenly it is easy to access the
Internet and then this happens everyone
wants to go online everyone wants to
experience this thing before we had TV
shows that would make fun of the
internet that would laugh about it and
suddenly it is a thing and someone
noticed this and then someone is
Microsoft and when they saw what
happened they got really scared because
they were really the dominant force they
were completely completely owning the
home computer market and this was a big
shock for them so in July 1995 they
released Windows 95 and it came
pre-installed with Internet Explorer as
the default browser and some of you
might say hey that's good that's some
horrific on
but it was pretty much illegal and
recall this browser was 1.0 and it's not
called the browser disagreement of fight
no it's called browser Wars because a
big corporation used all the energy and
all available resources to destroy a
potential threat the internet was
becoming a thing browsers became too big
so they were going after developers on
an individual basis they tried to sue
them individually this ended with an
antitrust lawsuit United States vs
Microsoft they got charged with a legal
tying of Internet Explorer to the
Windows operating system and they had to
pay hundreds of millions and this is not
super interesting the interesting part
is really this someone tried to
monopolize and gain platform power over
something that is decentralized the
internet and this concept of platform
power is something that I want to
emphasize it means pretty much that the
browser's are not just the clients that
represent the infrastructure but clients
actually have the power to dictate
dictate the underlying infrastructure
and protocols and they create blocking
effects and they can they can be
gatekeepers that control who should have
access and what kind of access and if we
see it we see this even today when
Google is willing to pay 12 billion
dollars a year to Apple just to remain
the default search in Safari browser so
browsers are still a very interesting
and lucrative target for big
corporations and they really want to own
this this space and control it as much
as possible but this is not what we want
we want our tools and clients to be open
and free as much as possible we want
them to be an extension to the regular
web but they should have the full access
to the Ethier Network and all the
benefits that come with it such as
computational power smart contracts
cryptographic security safe sovereign
identity decentralized storage and
crypto payments and we can call chorused
where the browser 3.0 unfortunately this
too doesn't exist yet and someone needs
to build it so let's build a browser but
before we are reinventing the wheel we
should just shake
this would be and there's chromium the
open-source project for Google Chrome
and this project has 20 million lines of
code it takes around six thousand person
years to build the estimated costs are
320 million US dollars 35 programming
languages are used in this project more
than 50 engineers are working on it
full-time more than 60 gigabytes of RAM
are highly recommended to build it and
it takes roughly 24 hours on my machine
so that is not an option for us we don't
have these resources but there are
certain frameworks that can help us with
it and one of them is electron so what
is electron electron already comes with
chromium pre-built pre bundled it has no
js' integration to customize the the
browser behavior and it also has native
api's so that it runs on all major
operating systems it looks really
promising
it looks like a really good tool that we
can use and many many applications are
already using it and it's becoming a
really big thing and we see this for
classical and developer tools
productivity but also a lot of trips or
applications that are already using
electron and I want to focus on before I
go to this slide I should I should say
this is a security talk this was the
first part and I really wanted to
emphasize why we want to build this
browser but I think now it's becoming a
little bit more technical but if one of
you and the audience just recognizes one
of these icons here or you may be using
one of these products on your computer
that's also ask your private keys or
some funds on it then I think the next
part which is more technical technical
could still be interesting for you I
want to focus on these web 3 clients
which can be considered a subset of the
browser 3.0 so these are clients that
have access to the ethion network but
they can also host EPS decentralized
apps and they provide an interface so
that these apps can actually interact
with the network and the most prominent
ones are probably madam as brave then if
you missed and the parent parity client
and this is the approach that these
projects took so meta mask is really
convenient and it's a great tool it's a
Chrome extension then brave was built on
electron if you missed build on electron
and parity had a UI that was built on
electron and now they have a wallet that
is built with electron and brave were
probably the first that recognized that
electron is not the best tool to build
these kind of browser browser logic
applications and then they forked
electron to fix some of the security
problems and they call it moon and then
they realized this will also not help
and now they going completely away to
something that is closer to chromium and
the if you miss team also realized that
electron might not be the best choice
and we have an internal project called
Tao and I will talk a little bit more
about this in a second and that tries to
fix all these security problems but
before I talk more about electron why
it's not just every electron is not such
a great option why it's not everyone
just building a Chrome extension and I
really wanted to motivate this with the
first couple of slides and that we need
some kind of diversity and that platform
power is a big problem and besides this
being a browser plugin has more
limitations limited API X is not running
in chromium forks without extension API
such as electron it's perceived and a
type of coupled to the Chrome Firefox or
whatever the hosting application is and
it has no platform ownership which is
probably probably the biggest problem
because then this can happen someone
decides for you that your extension
should not exist anymore should not be
available anymore and this happened and
the Mirrormask extension was removed
from the store for a couple of days and
they are more crypto extensions that got
completely banned from the store well
this happens someone decides that all
applications should not exist anymore
and this also happened and there was
something called Chrome apps and they
got pretty much killed within the last
two years all of them okay now I want to
focus a little bit more on electron
security and there are a couple of ways
how to build an electronic application
there is a good way where you actually
build a user interface with web
technologies which is what you want or
you build your your DEP with web
technologies and then you need to make
some like extensions to the to the
the stuff that the browser does not
offer you a regular browser so you
design an API for this and then may need
more access to the operating system you
write the application logic that is that
is running in a separate process and you
have some kind of messaging mechanism
that is whitelist whitelisting certain
messages between these two processes
that's good but it's also harder to
build and you can also do this with
electron you can build the whole your
user interface code that is running in
the browser then you don't really need
an API and you can just write your whole
application code that is also running in
the in the browser window and that's for
most applications a really bad idea and
this is possible because of a feature
one of the core features of electron
which is called node integration so node
integration allows you to access all the
node Rhea's api's from within the
browser window you don't need the
separation of these processes anymore
you can do really crazy stuff you can
accept the filesystem just from a
regular web page this is possible
especially because the electron project
removes the sandbox from the browser
which is one of the core security
mechanisms so that's really bad and it
opens a really large attack surface for
these applications and we should be
aware of this and there's there's our
application code but this is only at the
top our application has its own
dependencies to NPM or yours then it's
running in the electron framework and
the electron framework has dependencies
to chromium nodejs v ID and some
lower-level api's and we need to be
aware of the fact that every single
layer can be attacked and was attacked
so far so we saw on an infrastructure
level there was a DNA attack against my
ether wallet then for electron we've
seen a bunch of node integration
bypasses so you can actually turn the
node integration off for these browser
windows but then we've seen cases where
an application that was running in the
browser window could turn it on again
which completely defeats the purpose of
it and if this was not working they will
just create a new window
that had note integration on and they
would load itself there themselves into
the new window and then they get full
access to the operating system and it's
this is the security nightmare and then
they have full access to all your keys
and files and whatever you store on your
computer on the dependency level we've
seen NPM modules being hacked
so someone created an NPM module and
they did not really protect their
account someone was able to hack into
this account they modify the the module
code and then this module is a
dependency of millions of other projects
and they can infect in fact millions of
other of projects on the application
level we see a bunch of cross-site
scripting attacks which is probably the
the most dominant thread they are
especially don't cross-site scripting
for electronics another big really big
thing for us updates that are security
critical and I want to show you why
so for with mists for example in version
10 10 we have dependency two-electron
1.8 in version 11 we have a dependency
two-electron - so I I said it before
electron has its own set of dependencies
so electron 1.48 for example has a
dependency to chromium 59 then node 88.2
and v8 5.9 and electron two has a
dependency to chromium 61 node 8.9 and
v8 6.1 and the latest version is for
chromium 71 for note it's 11 and for v8
and 7 and you don't have to remember all
these numbers I will break it down for
you the latest version is 71 the version
that is used as a dependency of our
electron dependency a 61 that's a 10
version difference chromium has a
release cycle of 6 weeks that's a 60
week difference in Petra's security
updates bug fixes more than a year
outdated and it's even worse because we
get this the responsible is closed our
timeline for v8 bucks for example is not
one year it's a couple of weeks so we
have documented exploits such as this s
this v8 integer overflow and you can
find it online this is a is an attack
that works in old outdated browsers it
also works for every
electronic that is still on 1.8 for
example another big problem
who is reinstalling their browser when
they want to refresh a web page I hope
no one does this because this is what
crazy people do but this is our update
model right now with all the electron
apps so in order to push a very very
simple change to the user interface we
would have to go through the whole
process or process of reinstalling all
the binaries that come with it which
gives you a sec 60 megabyte update you
need to download a new installer and
then run through the whole process of
updating a new browser basically just
for very small changes so we saw these
problems and we wanted to fix them and
we did this with our internal project
called tau so what is tau tau is also
chromium it's not yes it has native
api's but we're doing a bunch of things
in a different way so for example
there's no node.js integration anymore
we are also not using the chromium
content that is used in electron but
we're using CF and CF is maintained by
Spotify and they're doing a really great
job in providing really recent updates
for the chromium v8 and Noem chromium
and v8 dependencies for the browser we
also have the advantage that chromium
embedded framework allows us to enable a
full sandbox and for the back-end
process we can use whatever we want so
we can update to the latest v8 version
which which is version 7 and we can
update to the latest node.js which is
version 11 and then we get this nice
benefits so the 8 version 7 was released
two weeks ago and it comes with web
assembly support for 4 threads and
that's pretty cool if you think about
all the stuff that we have on our
roadmap for it wasn't for example that
rely on newer features that are not
available in all browsers yet we also
have these advantages because we get all
the benefits all the changes to no js'
all these like bug fixes and
improvements to the crypto API for
example and many of the crypto
algorithms that we need to achieve our
goals with a theorem getting implemented
are already implemented in your note
versions so that's that that's a
have benefit as well so who's using Tao
pretty much no one is using this except
maybe our little like proof-of-concept
project and that's a good thing because
electron is a one-size-fits-all solution
and you have to think about it they're
going through the full bureaucracy
the full backporting they need to
coordinate with Microsoft with get up
with slag and all the other applications
that we just saw when they want to make
a breaking change it will take forever
just because they need to coordinate it
very well they cannot just break all
these applications and we have the
benefit that we can actually we can
break things we can move first so it's a
really small project so far I think it's
extremely promising it's not meant
really for the mainstream but I think
it's it's good that that we that we're
bringing out this message now that it
exists and it already has pre-built
binaries so you can actually test it out
it the pre-built binaries are working on
Mac and Windows so far they're they are
known for for Linux but we will probably
provide them within the next weeks and
this is how it looks like you won't see
a difference to a regular Chrome browser
or electron application you will see
this is our new mist UI react
running in one of the tower windows so
it's it's a browser window and we can
control and customize it and we can run
application code and it has all the
updates that we need and all the
benefits that we want and we also
introduced this new update mechanism to
avoid this these painful long release
cycles where we actually split our
application into multiple multiple paths
so the user interface is updated
separately and then we have something
that we call the shell or the browser
window and this becomes interchangeable
so we can switch between electron or tau
as long as we have an API that the user
interface communicates with and our
application logic communicates with we
can run updates pretty much every day or
every week have for all these parts and
this is the what we call the app shell
model and there will probably be a blog
post following on our on our medium blog
we also have a bunch of modules and
reference implementations if you're
interested to check it out there
the mist UI react project that is
working in Tao and an electron was just
recently adopted by the etherium if
human getup repository and then there's
create direct create react app
extensions which turns every react app
into an electron towel container as you
can call it then there's an update that
does hot updating for these containers
for electron or Tao apps and then we
have a reference implementation for the
electron shell and the tour shell that
can actually host one of these electron
react apps for electron water and that's
it
and if you're interested in any of this
you can come talk to me or you can just
reach out via my github or my mail
thanks
my thoughts about note WebKit yeah I
think one of the of the cool benefits of
electron is the the community so I I
said it's a disadvantage it can also be
considered as an advantage because you
actually have this like large community
and we have the same forum you see the
benefits of many projects already using
these technologies you get already tools
for black building update and update
mechanisms signing applications or
creating installers and I think this the
whole ecosystem for electron is just
better than for node then for node
WebKit but I think node WebKit is a cool
project and it it also goes in a very
similar direction so yeah so you said
that Tao is kind of like in a kind of
beta sandbox development and you're not
really saying hey let's start using Tao
at what point should those other
applications start using Tao and
integrating that yeah that's a good
question there was no like real roadmap
there was never the idea that this could
become something really big and I think
that it was also not the intention to
make it a competitor to electron for
example and we started with a proof of
concept the proof of concept look really
promising and now we're seeing like all
these additional benefits and and
possibilities how it could integrate
with other aphelion projects such as
remakes or the the holy was enough for
efforts and swarm and I think yeah I
think it looks really promising and
we will probably focus all of our energy
to make it the perfect fit for these
applications and not any other like
mainstream applications they should
probably try to use electron and just
put some pressure on them so that they
they fix their about security of
you perform any security I Tonto and
second question have you put into the
like continuous integration filling
systems that have been built by Martine
and indeed oh the answer is no and no
Soto is not was not going through a
security audit and missed of course was
going through a very very complete
security audit we learned a lot from
from these lessons and from this audit
and we try to incorporate all the these
things that we learned into tau but it
is not in this stage where we would
perform a security audit on it and the
other thing is the other question was if
we have integrated into any kind of
continuous integration or continuous
delivery mechanism and the answer is no
because we are and this was on one of
these slides I've mentioned it really
briefly we are rolling out our own
mechanism for this pretty much where we
have these reactive containers and we're
also thinking about stuff like how to
properly sign these containers and
modules because and this is something
that we're really missing in the whole
note reyes ecosystem you can actually
put check sums on stuff but they are the
these these modules are not never really
signed and we have these advantages we
know how to do it and we could
potentially incorporate it in our own
mechanism okay thank you so that style
has like an in will like kind of some
sort the principle would be the same as
for mist so we will try to interact with
Goethe room for example or with parity
with some external client that we would
download and try to update through our
update mechanism they are of course yes
of course a potential we saw a lot of
him like development for the ethion Jas
project and there could be the the
option to try all these like JavaScript
libraries to make it more like a full
client at some point but so far there
are no plans to turn it into a light
client full client whatever
okay so you mentioned the update process
of tower vs. electron-electron obviously
is you got to download the whole app
even if there was a minor change on the
App 60 megabytes whatnot
I quite didn't get the update process of
tau as in like if I want to update some
HTML or CSS or something along the lines
do you download a smaller copy of the
app or or how does it work so like let's
say the whole app is like still 60
megabytes right yeah and then you want
to update smaller processes how do you
go about doing that yeah so the the user
interface this yellow box is packaged
separately and then we have a frame for
this which is the browser frame that
includes the update mechanism and it
will actually check for newer versions
of this UI it's pretty much like a hot
hot updating mechanism for electron apps
only that you don't have to press f5 but
someone else will do it for you and they
will check our github releases page for
new updates and we also provide like all
the tools to publish these updates they
include check sums they include
versioning a channel if it's better
release we can even make staged rollouts
so we can say it's something like 10%
should update now and then the the shell
will update this new like packages these
containers and run them
you