One Rendering Tree

Girba, Tudor. “One Rendering Tree.” Medium , February 7, 2020.

A peek behind the graphical stack of Glamorous Toolkit

tudor girba — 2022-04-05 via discord […] Bloc is a completely new graphical stack that is not related to the Pharo infrastructure at all. Underneath it relies on Skia, which is the low level graphics support for Firefox and Android. Bloc is vector graphics by design. I am not aware of support for Spec 2, but Bloc offers all sorts of options. As for Roassal3, Bloc is already a visualization engine. Perhaps this might shed some light: medium

tudor girba — 2022-06-19 via discord Implementing a graphical stack is not an advisable investment for anyone, and even less so for a small team. We did not make this choice lightly. We did it because typical stacks we found around do not allow us to build the interfaces we want (it's still the case today). You can find a brief write up with some examples here: medium

Context: Single Rendering Tree

Implementing Mondrian in Glamorous Toolkit

ROHRBACH, Cyrill J., 2021. Implementing Mondrian in Glamorous Toolkit Online. Bachelor Thesis. Software Composition Group, Institut für Informatik, University of Bern, Switzerland. [Accessed 1 February 2023]. Available from: https://scg.unibe.ch/archive/projects/Rohr21a.pdf

One important part of Glamorous Toolkit is its all new graphical stack called Bloc. The special thing about Bloc is that every element shown to the user, be it some graphic, text or even the environment itself is rendered in one big Tree.

In most development environments visualizations are confined to their own world, a world that is different from the one all the widgets and other parts of the environment are rendered in. This differentiation between the visualization and the environment world leads to poor integration of the visualizations within the environment and makes it hard to combine the two.

Especially for moldable development, where the environment should be adapted to and developed with the software, it is important that the visualizations, used to help understand the software, do not live in their own world, but are integrated into the environment. Exactly this is achieved with the one rendering tree, as all elements live in the same world and can interact with each other.

Since all elements can be combined and used in any context, it is necessary to have a way to mark objects according to what they represent, as graph or inspector for example. Normally this is done using higher level models that then interact with or even create the rendering tree. But since this is complicated and incompatible with a single rendering tree Glamorous Toolkit works with Annotations instead. The annotations are used to create tiny objects that know the element and extend their interface with specific functionality needed for its context. An element annotated as graph node for example can return all connected edges.

[…] Figure 3.2: The rendering tree for all elements displayed in the scene