Skip to content

Speeding up the Layout Editor

For more years than I’d like to admit, the Layout Editor has been slow in terms of dragging controls around. As you add more controls, it gets worse. For web layouts, it’s been even worse. That’s primarily because we have to draw everything for a web layout whereas for a desktop layout, the OS draws the controls for us.

In an engineering meeting, I mentioned a discussion I had with a user about the speed of the Layout Editor and Travis said he had recently been reminded of how slow it was too. While most of the time issues in Xojo are carefully calculated and prioritized for maximum bang for the buckĀ (as we say around here), that’s not always how it happens. After the meeting, Travis decided to dive into the Layout Editor code and see what could be done to speed it up.

The results are pretty remarkable.

The video below tells the story best.

The difference is greatest for layouts with a lot of controls.

To optimize for speed, we made two changes:

  1. On all platforms, selecting and dragging controls now only re-renders those controls that are selected. A buffered image (picture) is taken with everything but the selected controls, and thus only the selected controls have to be drawn on top of that as they move. This is an improvement from before, where every control was re-rendered in every frame whether it was moving or not.
  2. The second optimization is Mac-specific. Some controls take a long time for macOS to draw and composite. In particular, controls like Group Boxes in Dark Mode can take a while. We now keep a cached copy of the rendered control from the operating system, and use that unless its size or properties change. That way, we don’t need to wait for macOS to draw the control every time we want to display or move it on the screen.

If you have layouts with lots of controls, check out 2019r1. You’re in for a pleasant surprise.