Marrying Collabora Online and LibreOffice WASM
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 |
| |
| Subtitle |
| |
| Title of Series | ||
| Number of Parts | 542 | |
| Author | ||
| 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/61569 (DOI) | |
| Publisher | ||
| Release Date | ||
| Language |
Content Metadata
| Subject Area | |
| Genre |
FOSDEM 2023187 / 542
2
5
10
14
15
16
22
24
27
29
31
36
43
48
56
63
74
78
83
87
89
95
96
99
104
106
107
117
119
121
122
125
126
128
130
132
134
135
136
141
143
146
148
152
155
157
159
161
165
166
168
170
173
176
180
181
185
191
194
196
197
198
199
206
207
209
210
211
212
216
219
220
227
228
229
231
232
233
236
250
252
256
258
260
263
264
267
271
273
275
276
278
282
286
292
293
298
299
300
302
312
316
321
322
324
339
341
342
343
344
351
352
354
355
356
357
359
369
370
372
373
376
378
379
380
382
383
387
390
394
395
401
405
406
410
411
413
415
416
421
426
430
437
438
440
441
443
444
445
446
448
449
450
451
458
464
468
472
475
476
479
481
493
494
498
499
502
509
513
516
517
520
522
524
525
531
534
535
537
538
541
00:00
Presentation of a groupData conversionComputer animation
00:32
Server (computing)SynchronizationCollaborationismDirac delta functionMobile WebClient (computing)Local ringWeb browserPrototypeLine (geometry)Open sourceCompilerChainCodeFormal languageCompilerLevel (video gaming)Game theoryVirtual realityVirtual machineVertex (graph theory)Software framework1 (number)VolumenvisualisierungComputer fileProcess (computing)Software development kitInstallation artEntire functionJava appletScripting languageStandard deviationSubsetType theoryLibrary (computing)Exception handlingPortable communications deviceMultiplicationNetwork topologyCore dumpBuildingDirectory servicePatch (Unix)Source codeMobile appSimilarity (geometry)Data structureOffice suiteMobiles ProgrammStructural loadAndroid (robot)Web pageNetwork socketCASE <Informatik>Projective planePatch (Unix)Binary codeMathematical optimizationDifferent (Kate Ryan album)AreaLink (knot theory)Open sourceMultiplication signBitCore dumpConnected spaceData structureComplete metric spaceFormal languageRun time (program lifecycle phase)Function (mathematics)File formatAndroid (robot)CodeStructural loadWeb pageFront and back endsInformationOffice suiteStandard deviationCartesian coordinate systemPortable communications deviceWeb browserBuildingLibrary (computing)Functional (mathematics)Machine codeFlagServer (computing)CompilerSlide ruleVisualization (computer graphics)outputCompilation albumDefault (computer science)Computer animation
05:41
MIDIDrum memoryPresentation of a groupDatabaseOffice suiteInterface (computing)Open sourceCoprocessorDefault (computer science)Inflection pointMUDMaxima and minimaUsabilityFreewareSuite (music)EmulationComputer fileUniformer RaumParameter (computer programming)Data conversionBuildingSoftware frameworkData conversionTesselationMathematical optimizationArithmetic progressionMedical imagingBitProduct (business)Multiplication signWeb browserVideoconferencingSoftware frameworkCore dumpComputer animation
06:47
MIDIWechselseitige InformationComputer fileCore dumpFile formatComputer animation
07:22
FreewareLine (geometry)Web browserResultant
07:29
Web pagePlanningComputer animation
07:38
Directed graphJava appletScripting languageComputer configurationKeyboard shortcutCodeRange (statistics)Function (mathematics)Variable (mathematics)Integrated development environmentPlanningComputer configurationCodeFunctional (mathematics)CodeKeyboard shortcutCompilation albumNatural numberIntegrated development environmentVariable (mathematics)Computer animation
08:50
Program flowchart
Transcript: English(auto-generated)
00:05
Cool. Hi everyone, my name is Balazs Volgo, and I'm working at Alotropia, GMBH. And this presentation I would like to talk about WebAssembly, MScript and technology running the Collabra online in WebAssembly,
00:23
and headless conversion stuff in WebAssembly as well. So let's get started with the Collabra online in WebAssembly stuff. So it was a common project with Collabra. We were together with Tor and Mihai Estan.
00:41
The goal was to approach offline document editing. On this slide there is a visual sketch design for this. The goal was, is that when the connection is breaks, and in a browser, an application is activated, and that contains the Collabra online server functionality.
01:03
And when connection is restored, the document will be edited in the Collabra online server again. I think Tor will talk about it a bit more. But to make it work, first we had to build it, build it in a WebAssembly. For that, we are using the MScripton compiler toolchain.
01:27
So let's talk about that. The MScripton is a complete open source compiler toolchain to WebAssembly. Using MScripton, you can compile C and C++ code, or any other languages that uses LLVM into WebAssembly,
01:45
and you can run it on the web, or Node.js, or the other runtimes. The MScripton generates small and fast code, and default output format is a WebAssembly, and highly optimizable executable format
02:02
that runs almost as fast as the native code. Little bit about the MScripton toolchain. The main tool is the MScripton compiler front-end. This is a drop-in replacement for a standard compiler, like PCC or C lang.
02:22
The EMCC uses klang and LLVM to compile to WebAssembly. EMCC also emits JavaScript that provides API support to the compiled code. The JavaScript can be executed by Node.js,
02:41
or from within HTML in a browser. There are more information there, but you can read that, about porting code, use MScripton support for portable C and C++ code is fairly comprehensive,
03:02
supported for the C standard library, the C++ standard library, exception, et cetera. It's very good, and also the OpenGL supports. Okay, the multi-threading is supported, but depends on shared array buffer, which is still being standardized and implemented by browsers.
03:24
Now let's see the porting, how it works. In the case of Kolobora online, the building for Wasm with MScripton is a bit immature, and some projects needed patching to make it work. First, we need to build the Brophy score.
03:42
With MScripton, earlier, the best was to use the future Wasm branch, but nowadays, it's working with the upstream. Must have been on the Qt5 framework, and then it needed to build the Kolobora online dependencies, the ZSTD libraries, the Poco library. It's required two patches to make it work.
04:08
And then it's necessary to build Kolobora online code, and then linking all the binaries and executables together. Linking Wasm executable uses a lot of memory,
04:22
and without optimizations or with the O1 flags, it should work anywhere, but there are different kind of flags, like the O2 area flags, which is the default, and some link time optimization happens that uses very much RAM,
04:42
and because of that, this causes segmentation error, so we are using the O1 flag in case of online and also in case of the LibreOffice core. A little bit about running, but Tor will talk about it more.
05:00
Its structure is quite similar to the Kolobora office iOS and Android applications. There are one difference, is that in case the mobile app, the C++ code is not transferred, and then loads the HTML page into WebKit,
05:20
in which the JavaScript runs in the WebAssembly application the other way around the web pages. Naturally, the one that is loaded and then the JavaScript code then starts running the C++ code as a WebAssembly.
05:41
You can see an image about it. It's a document tile in the browser. It's running in WebAssembly. There are some depth tools where you can debug. It's working, but it still needs some optimization work, which is in progress. If you have an image in the document, it's quite slow,
06:01
but we are working on that as well. And let's talk about a little bit some another WebAssembly work at Allotropia. We have also worked on a headless conversion product last time in LiboCon,
06:20
the little demo about it, but it wasn't completely a headless conversion. But now I make a video about it and let's see how it works now. We are not using the Qt5 framework anymore. And we're also using the unique HTML, which is created the LibreOffice core by Emscripten.
06:46
So let's hope the video works. It's working. Yeah, so this is the very basic HTML page, but it can be make it any kind of HTML work. There's just a button. You can select multiple files
07:03
and using the convert to arguments, you can convert the document and you can convert it any kind of format so the LibreOffice core can do. And then you can document it, download it,
07:20
and you can see it in the browser as well. And there is a common line in the browser where you can see the results. But the HTML page can be edited and that's the future plan to make it much more. Nicer. Also, some future plans.
07:42
At Alotopia, we would like to, calling UNO API function calls from JavaScript and scripting for that UI. The Emscripten provides various options for connecting normal JavaScript and compile code, which range from functions to compile C++
08:03
from JavaScript and via versa. So it's accessing environment variables from compile codes. These options are the Web IDL, binder, and the unwind. It's binding between C++ and JavaScript and allowing C++ code entities to be used
08:23
in a natural manner from JavaScript. That's also our future plan. I think that's all. Thank you for your attention. Thank you.
08:43
We've got one minute for questions, maybe one question and an answer, if there's any.