UI libraries for HtmlDialog user interfaces

SketchUp traditionally ships not a huge API for OS-native user interfaces (see the UI module, UI.messagebox). This would always have limitations in regard to what UI ideas developers can realize and distract focus and effort away from SketchUp’s core expertise, 3D.

Frameworks have been suggested, like jQuery UI, Angular, React.js and Vue.js (recommended by several of SketchUp’s own projects). In contrast to jQuery UI, the latter require more developer setup (like npm, typescript or transpiling/building). They have some downsides like

  • big library size (Angular), whereas most HtmlDialogs (like a messagebox alternative) are single-page web apps with often exactly one page (no routing)
  • higher barrier of entry: When building steps are necessary, the dialog does not run from the raw source code and users or potential contributers might be less likely to join. But from experience, most open-source efforts for SketchUp extensions didn’t grow a community. Typically the main developer is the only developer.

Does anyone have experience with svelte?

It would solve the first issue: You can use modern JavaScript with templating, but it builds a light-weight plain JavaScript app at compile-time so that there is no heavy framework doing the templating at run-time and it leaves away all functions that your simple single page dialog does not actually use. Seems ideal for simple HtmlDialogs!

1 Like

I’ll have look at that on as my pet peeve is we only need to consider embedded chromium and all the libraries are bloated…

Have you ever looked at slim


Sorry for being late to the party.

I’ve had some code that addressed event binding, communication between the dialog & SU, and allowed common CSS to be used. It did not deal with assembling the hmtl, but did allow for a limited set of operations on the DOM.

So, is html assembly what people want, or is it more about event binding & communication?