Running Qt Applications in a Browser Using the WebGL Plugin

An interesting feature that came in Qt 5.10 is a new Qt back-end that uses WebGL for rendering. This allows Qt applications (with some restrictions) to run in a web browser that supports WebGL.

What it is?

The new back-end uses WebGL, which stands for Web Graphic Library . WebGL is a JavaScript API for rendering 2D and 3D graphics in any compatible web browser without the use of plugins. The API is similar to OpenGL ES 2.0 and can be used on HTML5 canvas elements.

The new back-end will be introduced as a technical preview feature in Qt 5.10.0 and included in Alpha and Beta versions (Currently, Qt 5.10.0 is a beta version in Phase 1).

Latest source code is also available in Qt git at http://code.qt.io/cgit/qt/qtwebglplugin.git/ .

The plugin is distributed either under the GPLv3 license or under commercial licenses. Please note that it is not available in the LGPL. One of the consequences of the GPL license is that if you link to it (even dynamically), your application code is covered by the GPL.


How to use it

Let's assume that you have built Qt 5.10 with the WebGL plugin, the plugin will be available as a back-end. To use it, pass the -platform webgl option to your application and then open a web browser at http://localhost:8080/ .

The plugin supports the configuration of the network port used by the built-in HTTP server. If you want to use the default HTTP port, you can, for example, use the -platform webgl:port=80 option.

The plugin is installed in QTDIR /plugins/platforms/libqwebgl.so (the path is similar on Windows).

Limits

With the Alpha and Beta 1 releases of Qt 5.10.0, the WebGL plugin worked successfully on an Ubuntu Linux 17.04 system using the Chromium browser.

It should work with other browsers that support WebGL, including mobile and embedded browsers. It is suggested that you can also run it in a QtWebEngine view instead of a regular browser. There is no documentation yet (because it's only Beta 1), except for a few blog posts.

The plugin only supports QML applications. It is unknown if it will support widgets. According to the developers, widget support will be difficult to achieve with good performance because they rely on rasterization.

You might think that running in a browser means that the application will run in a sandbox and not be able to access any resources outside the browser, such as files. However, the browser only renders, and the application itself runs like a normal application (however, it may not run on the same computer as the display).

An experience

As of Qt 5.10.0 Beta 1, the few QML examples that have been tried have worked reasonably well. Some of them ran into some issues and some didn't start at all. Here are screenshots of several examples.

Qt Quick Controls Text Editor:

Qt Quick Controls Gallery:

QML Photoviewer:

SameGame:

Conclusion

In the past, the decision to develop an application that can run natively or in a web browser usually involved using vastly different strategies (eg using Qt/QML versus using HTML5). Assuming the WebGL plugin becomes stable and complete, it will offer an attractive approach for developing web applications using Qt and for turning a QML-based native Qt application into a web application with minimal effort. However, be aware of the licensing implications when deciding whether to use the commercial or open source version of Qt.

I'm looking forward to the WebGL plugin being documented and more complete in Qt 5.10.0 release later this year

Links

  1. http://blog.qt.io/blog/2017/10/09/qt-5-10-beta-released/
  2. http://blog.qt.io/blog/2017/09/13/qt-5-10-alpha-released/
  3. http://blog.qt.io/blog/2017/02/22/qt-quick-webgl-streaming/
  4. http://blog.qt.io/blog/2017/07/07/qt-webgl-streaming-merged

Article written by: Jeff Tranter Wednesday, October 25, 2017

We recommend hosting TIMEWEB
We recommend hosting TIMEWEB
Stable hosting, on which the social network EVILEG is located. For projects on Django we recommend VDS hosting.

Do you like it? Share on social networks!

Comments

Only authorized users can post comments.
Please, Log in or Sign up
AD

C ++ - Test 004. Pointers, Arrays and Loops

  • Result:50points,
  • Rating points-4
m

C ++ - Test 004. Pointers, Arrays and Loops

  • Result:80points,
  • Rating points4
m

C ++ - Test 004. Pointers, Arrays and Loops

  • Result:20points,
  • Rating points-10
Last comments
i
innorwallNov. 12, 2024, 6:12 a.m.
Django - Tutorial 055. How to write auto populate field functionality Freckles because of several brand names retin a, atralin buy generic priligy
i
innorwallNov. 12, 2024, 2:23 a.m.
QML - Tutorial 035. Using enumerations in QML without C ++ priligy cvs 24 Together with antibiotics such as amphotericin B 10, griseofulvin 11 and streptomycin 12, chloramphenicol 9 is in the World Health Organisation s List of Essential Medici…
i
innorwallNov. 11, 2024, 11:50 p.m.
Qt/C++ - Lesson 052. Customization Qt Audio player in the style of AIMP It decreases stress, supports hormone balance, and regulates and increases blood flow to the reproductive organs buy priligy online safe Promising data were reported in a PDX model re…
i
innorwallNov. 11, 2024, 10:19 p.m.
Heap sorting algorithm The role of raloxifene in preventing breast cancer priligy precio
i
innorwallNov. 11, 2024, 9:55 p.m.
PyQt5 - Lesson 006. Work with QTableWidget buy priligy 60 mg 53 have been reported by Javanovic Santa et al
Now discuss on the forum
i
innorwallNov. 12, 2024, 4:56 a.m.
добавить qlineseries в функции buy priligy senior brother Chu He, whom he had known for many years
i
innorwallNov. 11, 2024, 6:55 p.m.
Всё ещё разбираюсь с кешем. priligy walgreens levitra dulcolax carbs The third ring was found to be made up of ultra relativistic electrons, which are also present in both the outer and inner rings
9
9AnonimOct. 25, 2024, 4:10 p.m.
Машина тьюринга // Начальное состояние 0 0, ,<,1 // Переход в состояние 1 при пустом символе 0,0,>,0 // Остаемся в состоянии 0, двигаясь вправо при встрече 0 0,1,>…

Follow us in social networks