Thanks very much everybody for coming here to the graphics room to listen to another
talk about building native compiled applications that are going to work everywhere. I had the
title of the slide up and realised it didn't actually say go on the title slide so I just
wanted to get that out there right away. It's very exciting to be here in the graphics dev
room and to be presenting in the same place that fantastic people over the last decades
have shown great new features in KD and Nome and fantastic discussions around all of that
and hopefully I could bring something new and interesting to the room as well. Just out
of interest to get this right I recognise some faces from the Go Dev room yesterday so maybe
a show of hands if people have programmed Go at all. Wow, okay cool probably unusual
for this room and anybody then that is a C developer just in case I need to go back to
some common ground. Right, okay cool well thanks very much. So just a little bit about
myself. Hi my name is Andrew it's really nice to meet you all. I am a software engineer
have been for 20 years I think now, I stopped counting. I work a lot in startups either my
own or other people's companies solving interesting technical and personal challenges, building
teams all that kind of stuff and I've written some books gone on a couple of podcasts on
the topic of building applications like the ones I'm going to show you today. I have a
background in open source if you've seen me here before it might have been talking about
the enlightenment project where I spent a lot of my time and before then the Maven
project as well. I started the Find project which I'm going to present today to build
graphical applications built on top of Go in 2018 and I have been a Go developer since
two weeks after the project was founded. I'll tell you a little bit more about Find as we
get into it but I didn't pick up a language I wanted to learn and decided needed a graphical
toolkit. I had an ambition to make getting into graphical application development so much easier
I knew what I wanted to achieve and then I hunted for programming language and I don't know if
it's a good or a bad thing to say I wanted it to be rust I so wanted it to but I couldn't figure
it out and so I picked up Go and I haven't looked back I've never felt more productive. My day job
is at Fine Labs which is a company that's set up to help businesses get more out of the types of
platform agnostic technology that I'm going to show and so we have products and services that
could help companies working in this space. So I don't know whether or not people would think
that Go is a strange choice of programming language for building graphical applications. It's
certainly what the Go development team have said over the past few years although I think they're
coming around now they've seen how easy it is but just to summarize the benefits for anybody
that doesn't know much like Dart in the previous presentation it's going to allow you to write
applications that compile natively to absolutely any device so they can pretty much run anywhere
from desktops through mobiles, wasm on the web browser through into embedded devices as well.
It's important to me also that there are no runtime dependencies. These pieces of software
should drag and drop or install through a store in the usual manner without any need for additional
steps, no runtime setup, no hidden pre-conditions required to get the applications running.
We may have to do some as a developer but we take the pain so that our users get the big benefit.
We're going to deliver native performance. These applications are compiled down into the same
machine code at the TIN level that any piece of software built with C or other built for
specific platform technology is going to offer but fundamentally I thought it was important to
lower the barrier to writing graphical applications, help people to realize it's not so difficult.
It's something that you can see and do and have installed on your device very very quickly indeed
and Go provides the ability to do that whatever platform you're on but also the standards and
the pros and the tools, the techniques in the language help to make everything easier to understand.
It's good documentation, it's standard ways of writing things, unit testing built right in,
all of those good things helping to promote good engineering principles.
And so for me this is why it made such a good fit and it's why the fine toolkit picked up Go
because we're wanting to be the simplest way possible to get people building beautiful and
usable native graphical applications and to not have to think about any changes that might be
necessary to get them running on any particular device.
So the fine project like I said started in 2018 so that is now six years old I think possibly as of
this weekend actually, complete coincidence I was not sitting in a Fosden room when I thought of
the project which is same, would be a good story. It has become the most popular graphical
toolkit for Go which is pretty exciting. Over the years there's been actually quite a few have
started and it's nice to have choice. They have started perhaps with different technologies
under the hood some are using embedded web browsers for example and others are interested in
enabling more control, more power where we're focused on the simplicity and the ease of use I
suppose. OSS Insight if you track them on Twitter, X, wherever they are have ranked a sixth out of
all cross-platform graphical tokens which is very exciting although for some reason Qt and GTK
don't seem to list in the top 10 so how they came up with the numbers I don't know but it puts us
up there with others like Flutter, React Native and other names that you would have heard of and
just last week I realized that we had got into GitHub's 1000 most popular repositories across
the entire entirety of their code base if that's the right word which I think something like
350 million repositories and as part of the Go ecosystem we make use of the really excellent
and welcoming community that they have established over there and across Slack, Discord, Matrix and
in-person meetings we've got about 2,000 people that like to get together and talk about building
applications offering help for people who want to get started. So let's get a couple of pictures
on these slides as well. This is the fine demo application so if you're interested in checking
it out you can load this right now it's in the standard repository that we have we ship a few
demo applications and if you're on the Google Play Store you could download this right now onto
your phone and see how it renders on a mobile device. Hint looks exactly the same except it's
adjusted for the different screen sizes and of course I mean as a developer at heart Light Mode
is no good to me we ship the dark mode by default as well sorry they're both in there by default it
will pick the right variant of the theme depending on your user preferences. So let's get started
and build an app. I'm not going to overwhelm you with complex code which is perhaps a relief to
people who don't know Go or C but I'll step through what we do have. Go is known for being easy to
compile across all different platforms from whatever developer device you have which is fantastic
it's a good place to start but because we're going to be doing some graphics programming and we want
optimized binaries that are going to use your hardware acceleration we've got to get a little bit
of C in there under the hood you're never going to see it but we do need a compiler installed as
well so you'll need to install Go and GCC or Clang or a compatible compiler. If you're unsure
whether you've succeeded setting up a development environment we have a fine setup tool which will
verify the runtime yeah the runtime it's linked from the Getting Started pages which I'll add
reference later and that's just going to check that the Go compiler, the C compiler, are found and
catch typical challenges around just having your path set up properly so that tools are
indiscoverable and we have a tool called Fine that's going to be useful for our packaging later.
So there are a couple of steps that we need to do to get started with a project nothing like if
we were going to be starting with a C code base but nonetheless it's something to be aware of we
need to make a directory for our code we need to initialize the Go module this is a step that was
introduced recently it adds for much more powerful dependency management on the Go project it used
to be that you could just open a file save it run it and you would have an application displayed
and I'm trying to coax the Go team to allow that as a default for really early stage because the
mantra is start with the smallest thing possible and then add to it over time so apologies we've got
a couple of steps there that you need to know we're calling Go get which is going to grab the
library and goes looking all of the stuff up on the web through pretty efficient caching mechanism
but as you can see that's a URL it's finding the source code and that's going to download it into
the module that you've just created actually it's referencing in the module and putting in a common
space so you don't need to download it again for another project and then we're going to edit our
Go file I'm calling it UI.go because I'm really good at naming this is the code that we're going to
put in it not adventurous to live code I'm afraid I'll step you through it we have package main
because every application enters through the main package we're importing two packages they're in
the same namespace of find.io slash find slash v2 because this is our second major API and it's the
app and the widget sub packages that we're going to be using the app package sets up the runtime
pools in the appropriate drivers for the device that you're running on and then is going to bootstrap
the application and the widget package we're using to add something into our window our main function
again probably no prizes here forgetting that's the entry point for a Go app is creating a new
find application that's invoking the driver is creating a new window from the application with
hello as its title so if your device has title bars hello gets popped in there and then the one line
which is basically our entire user interface says set the content of the window to a new widget
a new label widget that says hello fine and then we then call show and run on the window which is
a little shortcut for show my window run my application if you're not familiar part of the
challenge with graphical apps is they do have to run in an event thread the operating system has
specific requirements for things we just bundle it up as simply as possible so there we have I think
four lines of code and a couple of import statements we can type go run full stop the period there is
just say the current directory you could equally have said main.go because we only have one file
and it's going to load this picture this window here says hello fine I was running this on a desktop
in dark mode at the time which is why it looks that way wow yeah I can see you're really really
excited about a hello world application I mean I was the first time it appeared on the screen but
that was a few years ago so let's do something a little bit more interesting and show that it's
still going to be easy to do something useful going to make a markdown editor for you we have
built into the standard widget package and an entry widget that seems to say editor it's an entry
widget that's going to take the user input we're going to use a rich text in our application to
render the output part of the reason this is going to be really straightforward is that a rich text
understands markdown as a source for the information to mark up a text document and a horizontal
splits container for laying out our user interface I showed you widgets before but containers are
sort of like a type of widget where you have multiple things in it and it has a layout that's
going to describe how things should lay out on screen you don't position widgets manually you
have an area and a container fills it which means that we can adapt to screen sizes orientations
very easily widgets don't have to think too much about how they're placed what type of device
they're running on it's actually very powerful when you're not really wanting to think too much
about what system you're going to be running your application on and I'm going to hook the two
together with an unchanged callback so that when the user edits their text the runtime will change
it okay so I described four lines it is a little bit more than four lines of code but we have the
same imports with the addition of the container package and we're starting the application and
window in the same way although as you can see a very exciting new title is going to appear on our
window the editor field the oh sorry the editor field can't seem to point sorry anyway you can
read it's not a lot of text is a new multi-line entry which is a standard entry widget but has
more than one line in it we don't need to specify how many because it will fill the space available
we have a new rich text we're saying load markdown but we're loading nothing as you can imagine
if you passed in a string a markdown string there it would actually render that as it was
loading for the first time then the hook that I mentioned is again one line of code the unchanged
on entry passes a string to whoever is interested in what changed and the parsed markdown function
of our preview accepts a string because you would parse your markdown from a string so we're able to
set one function to to the other one so when unchanged happens it fires parsed markdown so we
can avoid signal slots string based IDs and comparisons to connect multiple widgets together
and just use a single line of code instead and then the most complicated piece of code in this
entire snippet is the container we're using an adaptive grid which is like a grid but it adapts
to is the number of columns slash rows that it should it should have if you had a standard widget
a standard grid it would have columns or rows specified and as it reaches the end it flows
onto another with an adaptive grid it's going to decide whether it's columns or rows based on the
space available so if we were loading this on our phone in portrait mode one will be above the other
and if it's in landscape one will be to the left and one will be to the right
so sorry about the sneak preview before but this is a markdown editor there we go that's better
thank you thank you you're too kind as you can see this is not difficult we have the entry widget
on the left we've typed some markdown into it and it has rendered on the right there is a link
which you could tap and it has referenced a local image as well that's quite cool but this is cooler
it's exactly the same software that has been packaged as an IPA and dropped into my iPhone
simulator actually it's a dot app because it's a simulator not a real device but exactly the same
so the code could be dropped onto a device as well as you can see it's also running in landscape so
the arrangement is the same so there that is the application running across multiple different
platforms how did we get it there so compiling for targets that aren't your current machine is a
little bit more complicated but let's start with what if you are compiling locally the fine tool
the helper that I mentioned before is pretty important and very helpful as many help helpers are
you can get it from the URL there and that go get command is going to download it and put it
into your path and then you can use it to do helpful things like package the application or
install it locally as I'm sure you're aware a binary that you get out of a compiler is fantastic
and efficient and you can move it around because it is portable it doesn't look good and you can't
put it in your start menu so fine package is going to give you a binary with whatever metadata
around it is necessary so it will inject an icon into an XE for Windows or it will put the icon
and desktop file into the appropriate places on your Linux system and fine install on that second
line there is doing all of that for the current system and installing it into the right place for
you so user local probably for most people here or the start menu or your applications folder on
Mac line three there is how do we do it for a different platform because we can't just invoke
the compiler we also want to package it differently the XE is going to appear instead of whatever
our native system is that is going to use local tools and so if you're familiar with cross compiling
and see having a tool chain specifying the CC variable is going to be likely needed for some of
these cross ports we'll come back to that in a second the fourth one there is to build an Android
application on our platform to do that you just need the Android SDK installed essentially quite
straightforward and relatively portable the only reason we it's a bit more complex is we need to
say what the application ID is because the sandboxing and the operating systems rules say you can't
just be an anonymous piece of software so we pass that in there is also metadata file that you can
do if you prefer to avoid command line arguments all the time fine app.toml I'm not going to cover it
but it's there and can help you save a little bit of pain but what if you don't want to manage
multiple developer tool chains installing packages even if it's for your local environment you just
might not want to you might not be able to so contributed to the project is fine cross from
Luca Corbo and Cedric by who many of you will know and another guy Jacob on our project have
pulled together a Docker based build system with a very standard command line front end so you could
much like you would say fine package OS windows you could say fine cross windows and it's going to
take your application bundle it up inside the Docker container put the binary back into your
current directory and and exit the container so helps you to avoid all of the setup if you don't
mean running Docker or podman on your local instance that's going to be super super helpful
very briefly want to touch on some more interesting parts of the toolkit because it's not all about
just showing dialogue sorry showing graphical elements on screen one of the hard things about
making applications portable is the file system we take it for granted but we shouldn't it's not
always there so we've provided dialogues to open and save files and a package that helps you to
manage storage in an abstract way even more abstract actually than the recently added go
file system package it doesn't assume file paths it uses URIs to uniquely identify any data source
so you could have your your data remotely on a network somebody made an application to bores
their steam library they connected it through the storage api and they used the file open dialogue
to browse their steam library cool but why it's really cool is the picture on the right here
i've asked my application to open a file i've put that onto my iphone simulator
yes and it has shown me this file picking dialogue i don't know if people are familiar or not but
this is what's going to come up if you have an iphone set up with an iCloud account i can pick
data off the cloud or i can back out and i can go to the dropbox picker where i might have something
stored so third-party applications can provide data as though they were files because we're not
making the assumption that they're files and if you get further into this and you want to separate
your ui from the data that you're managing internally separate state from from rendering
then we have a binding package so you could pass around a string binding
not have to remember that it's going to a label or you could multiplex i have some data it's going
to go to two or three widgets and most of the standard widgets will provide a with data constructor
so i can pass the data binding in and that's a two-way data binding everything's always going
to be kept up to date so two pretty helpful things but i wish i had more time to tell you more
obviously there's a full widget library or i wouldn't be shouting about hey everybody you
should try this we have a dialogues library and full featured forms as well which surprisingly
is one of the things that could be a little tricky to get working on a mobile app menus
some more complex containers than i have shown you we have notification integration system tray
for desktop and popping in and out wherever it happens to be appropriate for the device you're on
and we've provided native access to apis that you might not have in go so if you need to use a
library it's not available in go you can call out to that natively through a c api the go team
have done a fantastic job with making that integration really easy you just essentially import c
and call it with a c namespace and it works pretty much transparently again there's some
complications if this is android and you want to access the end the k you need the jvm instance
so we've provided some native integration that that give you the context necessary
i'm not going to step through that today however there is a little bit more than that it wouldn't
be a presentation in the graphics dev room if i wasn't able to say but hold on a second um
we built an entire desktop system using this this api stack the presentation that i've just
run through is in an app called slides it is a markdown file we support markdown rendering
that is pulled together in a fine app the terminal here another fine app in fact the desktop system
everything in front of us it's all rendered in fine it is go apis and very very easy to understand
so there you go i feel like i've fulfilled what's necessary to to consider ourselves a serious
graphical contender if you would like to learn more well i'm here i'll hang around outside if
anybody wants to chat there's a lot of documentation online the like i said the project's been going
for a while so you can find a lot of what we have at docs dot find i o there's also a pretty good
video channel um at fine i o on youtube where you can find tutorials examples and do search for
fine tutorials outside of what we have because there's translations in okay i'm not going to list
them in case any of them politically insensitive but plenty of different languages for folks who
find that they want to try um a platform that's this different to the standard ones available
perhaps um there's a book available about fine that i wrote you don't have to buy it but it's out there
um if you would like to contribute and we would really love it if some people came along and
helped us to improve this project everything is on github including the documentation the
websites the examples you can all find it in the organization and the main repository is simply
called fine and you can find the source code to everything i've shown you today we're of course
looking for sponsors but who isn't if you love it you know help out in whatever way you can
appreciate your time thank you so much and i'll take any questions that you have
excuse me please yes um
we do a lot of complicated stuff to make oh i'm sorry of course so what's the support like for ios
is it more complicated than android it is very complicated for us it is trivial for you the
developer who's using the toolkit you don't need to think about it you don't need to do anything
at all the tools that i've shown you will create any type of application from your code um the one
proviso is that if you want to put it into an ios into an onto an ios device apple is going to
insist that you own some hardware that they have produced it may or may not be possible to do it in
other ways but that's the license um but no fundamentally this is this is platform agnostic
the apis are all guaranteed to work absolutely everywhere um sorry the the fuzz done to fit yeah
yeah i was just wondering if you could um i if you could provide a sense of are there any certain
kinds of application that are both particularly good bits and maybe less good i good good bit
the video in this framework yeah so are there applications that are good fit or not a good
fit um for using fine i think the easiest answer is going to be that if you have a document rich
piece of um content if you're helping people to browse archives of um documents and things like
that you'd probably be better with a web framework honestly because i mean that's what it's built for
if it's more interactive if it's graphical driven um then that's something that we're going to be
much better place to do fundamentally if you want to get this out to many people we're going to um
alleviate a lot of the pain of getting it out there quickly and some of the things that other
toolkits might offer as built in or community add-ons might take a little bit of time to
implement but you've saved a lot of time up front i wouldn't go and implement games because we don't
offer the 3d acceleration as part of our api we just use it internally for the speed improvements
but it has been used for such a wide variety of things we have remote desktop application screaming
uh 60 frames a second um full screen so that that kind of thing that's pretty cool and can we
squeeze one more in yeah um just there please uh yes you mentioned about uh using open gel as the
back end under ios for instance are you going straight to metal or are you using say angle or
some other solution okay so yeah what are the graphical back ends that we're utilizing um
it is open gel on the desktop you're you're quite right and we are using gles on the mobile
platforms ios and android i'm aware that some of these have been deprecated and they may change
over time um on the desktop mac is trying to kill off um open gel they've not really said that they're
going to kill gles on mobile but it's inevitable that they will want to we're looking in the future
to build more back end sorry more platform specific uh engines because you know performance
also it offers slightly better portability ironically if you build for everything separately
internally but we've designed the api so we don't need to make those decisions it's really easy to
use it's going to work and over time we're going to adapt the back ends to be more efficient or
or whatever is needed by the platforms um and so we're offering we do updates every um six
months four to six months so that we can keep up with the the specifics of each of those platforms
so if we have to look at a different one it'll be there before you have to worry about it
thank you so much everybody enjoy the rest of your day