Getting Started with AdaWebPack
This is a modal window.
The media could not be loaded, either because the server or network failed or because the format is not supported.
Formal Metadata
| Title |
| |
| Title of Series | ||
| Number of Parts | 287 | |
| Author | ||
| Contributors | ||
| License | CC Attribution 2.0 Belgium: You are free to use, adapt and copy, distribute and transmit the work or content in adapted or unchanged form for any legal purpose as long as the work is attributed to the author in the manner specified by the author or licensor. | |
| Identifiers | 10.5446/57022 (DOI) | |
| Publisher | ||
| Release Date | ||
| Language |
Content Metadata
| Subject Area | ||
| Genre | ||
| Abstract |
|
FOSDEM 2022171 / 287
2
4
6
8
12
17
21
23
31
35
37
41
44
45
46
47
50
62
65
66
67
68
71
73
81
84
85
86
90
92
94
100
102
105
111
114
115
116
117
118
121
122
124
127
131
133
135
137
139
140
141
142
145
149
150
156
164
165
167
169
170
171
172
174
176
178
180
183
184
189
190
192
194
198
205
206
207
208
210
218
220
224
225
229
230
232
235
236
238
239
240
242
243
244
245
246
249
250
253
260
262
264
267
273
274
277
282
283
287
00:00
DemosceneOvalVideoconferencingDiagramEngineering drawingJSON
00:28
Sign (mathematics)Internet forumYouTubeSpacetimeWebsiteOnline chatEmail
01:02
Web applicationPhysical systemElectronic mailing listOcean currentSoftware developerResultantRule of inferenceSurfaceComputer animation
01:34
Form (programming)Cartesian coordinate systemComputer animation
01:57
Web browserChainLibrary (computing)Web browserWorld Wide Web ConsortiumRun time (program lifecycle phase)Keyboard shortcutBoom (sailing)Virtual machineFormal languageWhiteboardFamilyBinary fileIntegrated development environmentTable (information)Electronic mailing listSoftware developerComputer animationXML
02:54
Patch (Unix)CompilerFile formatWeb browserParsingPermianPrologClient (computing)Source codeMoving averageWeightImplementationStandard deviationCodePlot (narrative)CalculationCore dumpRepository (publishing)Level (video gaming)Scripting languageJava appletPortable communications deviceStructural loadIndependence (probability theory)Front and back endsIntermediate languageChainPresentation of a groupComputer animationXML
03:14
InformationCodeIntermediate languageWorld Wide Web ConsortiumCompilerBuildingBinary codeHigh-level programming languageElectric generatorFront and back endsInformationBitIntegrated development environmentProjective planeInternet service providerPhysical systemDegree (graph theory)AdditionSurvival analysisTable (information)Computer programmingArithmetic meanComputer animation
05:52
CompilerInformationMessage passingCodeBit rateInformationCurveType theoryIndependence (probability theory)World Wide Web ConsortiumComputer fileComputer configurationProjective planeImplementationWhiteboardSymbol tableMultiplication signSemiconductor memoryTable (information)Task (computing)Group actionException handlingSpiralLocal ringBuildingObject (grammar)CompilerBinary codeComputer programmingOcean currentLine (geometry)Run time (program lifecycle phase)Matching (graph theory)Electronic mailing listVapor barrierSource codeJSON
08:09
Resource allocationData structureMemory managementWorld Wide Web ConsortiumAlgorithmImplementationRun time (program lifecycle phase)Resource allocationMultiplication signSemiconductor memoryAdditionIntegrated development environmentPredictabilitySoftware developerCategory of beingOperator (mathematics)Core dumpAuthorizationBridging (networking)Bus (computing)Virtual machineUniform resource locatorInsertion lossComputer animation
09:01
Pointer (computer programming)SpacetimeMessage passingVirtual machineMappingWeb 2.0IntegerComputer programmingObject (grammar)Direction (geometry)IdentifiabilityBridging (networking)Process (computing)Local ringComputer animation
09:52
Element (mathematics)IdentifiabilityObject (grammar)System callWritingAttribute grammarReading (process)Web 2.0Keyboard shortcutCore dumpString (computer science)Computer animation
10:17
String (computer science)UsabilityString (computer science)Web 2.0AbstractionData conversionObject (grammar)
10:39
Event horizonAsynchronous Transfer ModeWeb browserWeb 2.0Web pageRepresentation (politics)Bridging (networking)Presentation of a groupWindowEvent horizonElement (mathematics)Type theoryForm (programming)World Wide Web ConsortiumProcedural programmingNetwork topologyFunctional (mathematics)Texture mappingCorrespondence (mathematics)Dimensional analysisAsynchronous Transfer ModePrisoner's dilemmaMedian
12:36
Client (computing)MedianCommunications protocolCartesian coordinate systemWeb browserWeb 2.0Web applicationStandard deviationServer (computing)Computer fileDigital electronicsCommunications protocolElement (mathematics)Theory of everythingClient (computing)Process (computing)MedianDean numberDirection (geometry)JSON
13:54
Element (mathematics)WindowString (computer science)Procedural programmingCodeData structureDemo (music)Category of beingElement (mathematics)Computer programmingGraph coloringTouchscreenError messageSimilarity (geometry)Archaeological field surveyCausalityPrisoner's dilemmaSolitary confinementIntelligent NetworkLibrary (computing)Clique problem1 (number)Goodness of fitService-oriented architectureWorld Wide Web ConsortiumSource code
15:04
Cartesian coordinate systemVirtual machineStructural loadMathematicsFamily
15:26
ImplementationProjective planeMathematicsLine (geometry)CodeFamilyLevel (video gaming)Repository (publishing)Web applicationSoftware developer
15:59
ImplementationMetropolitan area networkImplementationGoodness of fitInteractive televisionOcean currentServer (computing)Division (mathematics)Different (Kate Ryan album)Decision theoryMereologyRoundness (object)Data storage deviceComputer fileRepository (publishing)Cartesian coordinate systemState of matterLatent heatPhysical systemWeb applicationClient (computing)Web-DesignerGUI widgetSoftware developer
17:34
ImplementationNumeral (linguistics)Demo (music)Pointer (computer programming)Cube
17:58
CloningLibrary (computing)Source codeLink (knot theory)Interface (computing)Repository (publishing)Computer-generated imageryWindows RegistryInstallation artScripting languageGame theoryGamma functionGEDCOMCompilerDegree (graph theory)Repository (publishing)Web pageBinary codeData managementMedical imagingBuildingRippingSource codeServer (computing)NP-hardFile formatIntegrated development environmentGoogolBridging (networking)Game theoryKey (cryptography)Line (geometry)Forcing (mathematics)Flow separationArithmetic meanFerry CorstenUsability
19:38
Right angleComputer animation
20:01
Source codeMultiplication signConnected spaceDemosceneAreaEndliche ModelltheorieTunisConstructor (object-oriented programming)Repository (publishing)Computer fileMereologyMeeting/Interview
21:28
Multiplication signWeb pageSource codeRepository (publishing)Well-formed formulaComputer animationMeeting/Interview
22:18
WebsiteBenchmarkFormal languageBitComputer animation
22:44
BenchmarkMeeting/InterviewComputer animation
23:03
Cartesian coordinate systemService-oriented architectureBroadcasting (networking)Computer animationMeeting/Interview
23:34
Computer animation
Transcript: English(auto-generated)
00:13
Hello, in this video I'll tell you about ada webpack, what is it and how to get started with it.
00:22
This video is for FOSDEMO 2022, a short about me. I'm from Ukraine and since 2002 I'm developing a website for people interested in ada on ex-USSR space.
00:46
We have a website, mail list, forum, telegram chat and recently YouTube channel. You can reach me on GitHub, telegram or GitHub.
01:04
So what is ada webpack? This is toolkit to develop web application using ada. Currently web application is very promising technology because there is a lot of device that support web applications.
01:28
The list of supporting device start from desktop system, laptops, tablets, phones, car navigation system and so on and so forth.
01:46
Since you develop application using this technology, it will be run on any such device. ada webpack includes web assembly to chain, customizer ada runtime library and web binding for API supported by browser.
02:14
What is web assembly? This is a virtual machine with table binary format for executables.
02:28
This virtual machine is capable to embed in a host environment and this includes browsers and currently every modern browser support virtual machine for web assembly.
02:46
The web assembly development are language independent and if you look at the list of supporting languages, you will find most of them use LLVM as back-end.
03:09
LLVM is a toolchain built around well-documented intermediate representation. This package contains many front-ends that takes high-level language such as ada and generate intermediate representation.
03:32
Also, it has many back-ends that from given intermediate representation generate binaries for some target, for example, web assembly.
03:46
For current projects, we are interested in ada front-end and web assembly back-end in LLVM. Both of them are currently available. For front-end, we use not-llvm.
04:05
This project on GitHub and it join not front-end for ada and LLVM back-end to generate binaries. After compiling not-llvm, you will have a bunch of executables like LLVM GCC.
04:29
This is a compiler. You can feed them with hello world adb and get binaries generated by LLVM.
04:41
What is also interesting for us is that this toolchain is known by repair build tools. There is a dedicated target and when you call repair build with target LLVM options, repair build will find LLVM toolchain binaries and use them to generate the code.
05:11
How to compile ada to web assembly? First, you need to pass the target LLVM reach to the compiler.
05:22
This will tell LLVM the target system. Secondly, you also need to provide target dependent information to HANA.
05:40
Otherwise, HANA will use your host environment as a target. This is not correct because your host is 64 bits and web assembly is 32 only. Target independent information contains the size of some basic types like integer, float, double, pointers, and so on.
06:08
Target information locates in a file that we provide for web assembly and you point to this file with not-et option on command line.
06:25
As I mentioned before, you also need target LLVM if you use repair build to build your project. This way you will get two target options if you use repair build.
06:41
One option for compiler and another option for repair build. It's a bit strange but it's required. Then you will have binaries but this is not enough because to get working executable you need runtime.
07:03
Not runtime. Based on POSIX and this doesn't match a web assembly environment. This is why we developed a custom runtime based on a barrier board, not runtime.
07:22
Such runtime exposes restriction of web assembly and a list of this restriction includes no exception except local exception handling. No nested program access because access to nested program requires Trump lines and this is not possible in web assembly currently.
07:54
Also you cannot use task and protected object because web assembly doesn't allow stack manipulation required to task.
08:09
Also our runtime contains a custom memory allocator based on TL-SF algorithm which has nice properties like simple implementation and predictable time of operations.
08:29
This allocator use host environment to get additional piece of memory when it lacks space.
08:44
Besides not runtime, we also provide some packages to support web assembly development and the core. Such package is wasm.objects.
09:01
It allows you to pass pointers from JavaScript space to Ada. Web assembly virtual machine is separated from JavaScript machine and you cannot pass JavaScript pointer into Ada space.
09:28
For Ada object you can get the access and convert it to integer and pass to JavaScript but this doesn't work in other direction. To overcome this, we provide a package that contains mapping from JavaScript object used in your program to some integer identifiers.
09:55
Then you can use such identifiers to call JavaScript methods and read and write object attributes for JavaScript objects.
10:07
To work with Web API in the browser, we provide Web API binding and the core package of this binding is Web strings.
10:21
It provides abstractions that represent strings and you can convert usual Ada strings to object from this package and then use such object in Web API elsewhere. Most rich Web API is Web DOM.
10:45
This API here allows you to interact with representation of the page in the browser. If you worked ever with DOM API, you will find this very familiar.
11:01
The DOM contains types for notes, documents, elements of the documents and corresponding functions like get element by ID. It also provides types for events, event target, event listener.
11:22
Using a procedure like add event listener, you can attach a handler for some events on notes in the DOM tree. On top of this binding, we provide a Web HTML package that lets you work with HTML elements like buttons, inputs, forms and so on.
11:57
The top-left element is a web window that lets you wait to get access to the document and start working with the page.
12:14
Another interesting binding is WebGL. WebGL is an API to render two-dimensional and third-dimensional graphics.
12:27
This API includes objects, buffers, shaders, textures and so on. This standard is supported by most modern browsers and lets you develop very nice looking applications.
12:47
To communicate between server and clients, we provide binding for Web Circuits and XML HTTP request. Web Circuits is a bi-directional protocol while XML HTTP request lets you execute simple requests like GET, POST, PUT and so on over HTTP.
13:13
So, how the simplest web application looks like?
13:26
Firstly, you need an HTTP file with elements to interact with the user. In the current demo, this is a paragraph with hello world text and a button with hello data title.
13:48
The button is initially disabled and the text is hidden. On the other side, we declare a listener that will react on a click event.
14:02
This handler will find the paragraph by id and set hidden property on this element to false. To initialize the demo, we provide a procedure to initialize the demo that
14:27
finds the button and attaches a listener to this button and enables the button. The overall structure of the ADO program contains an empty main to demonstrate that actual code execution is on the JavaScript side.
14:50
The main includes a demo package and the initialization of the demo package is in the package body.
15:04
To launch this application, you need a piece of JavaScript. This is required because JavaScript used to load WebAssembly application and start the WebAssembly virtual machine.
15:26
JavaScript code is very small and doesn't change much between the project. You can just copy-paste these several lines to your project and this should work.
15:41
As you see, ADO Webpack contains a lower level to develop web application and perhaps to create a future application, you need more high-level stuff. We provide several repositories to help with this.
16:05
The first repository I would like to mention is Adagel. It's a common API for WebGL and OpenGL and contains a common specification and two different implementations.
16:22
One for native OpenGL application and another for WebGL web application. It simplifies development a bit. Another repository is Adaweb UE. It is the state of widgets to simplify web development.
16:47
The third repository is an implementation of distributed system annex in a reference manual that you hide all details for client-server interaction.
17:15
You describe the client-server like usual ADAP package and then split your application to two parts.
17:29
One of them will be on server and another will be on client. To demonstrate what we already can do, I shall show you a simple demo.
17:45
This is a rotated cube and you can interact with it with a mouse pointer.
18:02
How can you get started with Adaweb? There is a dedicated repository on GitHub. It provides all required sources and instructions how to start. You can build it from source, but it's a bit hard because it requires synchronized commits from server or repository.
18:29
So, instead, we recommend to use Docker. Our page contains some instructions. You just create a Docker image and use this image as a replacement of ripper build.
18:50
There are also binaries released on the page. The current release has RPM for Fedora and binaries for Ubuntu.
19:08
Besides this, we also provide MCS2 package in binary format. You just install this as usual with your package manager and get the working environment.
19:30
After that, you can compile examples. We have several examples in the repository.
19:41
And that's all for me. If you have any questions, you're welcome. All right.
20:05
Yeah. Instruction to install is on GitHub repository in the readme file. It suggests to use source to build from sources.
20:21
But there is difficulty with it because you need synchronized commits from several repositories. You should synchronize a lot of VM sources with NAT sources.
20:40
And this is the most difficult part because sometimes not a lot of them... Did we lose the connection?
21:29
There appear to be some technical problems. You were dropped out for some time. I know Fer is gone as well. You may want to repeat the last answer that you gave.
21:44
Okay. I mean that the height for building a NAT VM is on the hub page of a NAT VM source. And you need to get the sources and build it from source.
22:03
But it's difficult because you need synchronized commits from NAT sources and NAT LLVMs. Those are two different repositories. Okay.
22:21
I must confess I'm lost a bit in what questions have already been answered as I was busy in another room. Was the question answered about whether there are any performance benchmarks? Is it known how ADA WASM compares to other languages?
22:42
Is one question? No. So the question was whether there are any performance benchmarks available. I see Fer is back. We didn't do such... Oops, we're having quite some technical issues.
23:13
Okay. It's not important for us to have a high performance for GUI application.
23:23
But I expect that ADA is as good as other languages. Okay, I see that the broadcast will stop.