Logo
ScienceStack
Table of Contents
Fetching ...
Sign In

Making Hybrid Languages: A Recipe

Leif Andersen, Cameron Moy, Stephen Chang, Matthias Felleisen

TL;DR

This paper addresses the rigidity of traditional linear programming languages by proposing a recipe to create hybrid languages that integrate visual, interactive syntax with text, enabling domain-specific visuals without disrupting existing workflows. The approach hinges on adapting an existing language and IDE, reusing an existing GUI library, and defining a simple, multi-phase interactive-syntax definition (state, render, elaborate) to support both edit-time visualization and run-time semantics. The authors demonstrate the recipe by instantiating Hybrid Clojure-Script with a CodeMirror-based IDE (elIDE), including a Diagram visual extension for Bézier curves, supported by a Stopify sandbox for safe edit-time evaluation. Their evaluation argues that the DOM-based design preserves and enhances typical workflow operations, enables reuse of libraries, and provides practical benefits across multiple case studies (REST protocol diagrams, board-game UI, and meta-extensions). The work offers a concrete path toward maintainable, backwards-compatible hybrid languages that can be extended to other languages and IDEs, with promising implications for developer productivity and domain-specific tooling.

Abstract

The dominant programming languages support only linear text to express ideas. Visual languages offer graphical representations for entire programs, when viewed with special tools. Hybrid languages, with support from existing tools, allow developers to express their ideas with a mix of textual and graphical syntax tailored to an application domain. This mix puts both kinds of syntax on equal footing and, importantly, the enriched language does not disrupt a programmer's typical workflow. This paper presents a recipe for equipping existing textual programming languages as well as accompanying IDEs with a mechanism for creating and using graphical interactive syntax. It also presents the first hybrid language and IDE created using the recipe.

Making Hybrid Languages: A Recipe

TL;DR

This paper addresses the rigidity of traditional linear programming languages by proposing a recipe to create hybrid languages that integrate visual, interactive syntax with text, enabling domain-specific visuals without disrupting existing workflows. The approach hinges on adapting an existing language and IDE, reusing an existing GUI library, and defining a simple, multi-phase interactive-syntax definition (state, render, elaborate) to support both edit-time visualization and run-time semantics. The authors demonstrate the recipe by instantiating Hybrid Clojure-Script with a CodeMirror-based IDE (elIDE), including a Diagram visual extension for Bézier curves, supported by a Stopify sandbox for safe edit-time evaluation. Their evaluation argues that the DOM-based design preserves and enhances typical workflow operations, enables reuse of libraries, and provides practical benefits across multiple case studies (REST protocol diagrams, board-game UI, and meta-extensions). The work offers a concrete path toward maintainable, backwards-compatible hybrid languages that can be extended to other languages and IDEs, with promising implications for developer productivity and domain-specific tooling.

Abstract

The dominant programming languages support only linear text to express ideas. Visual languages offer graphical representations for entire programs, when viewed with special tools. Hybrid languages, with support from existing tools, allow developers to express their ideas with a mix of textual and graphical syntax tailored to an application domain. This mix puts both kinds of syntax on equal footing and, importantly, the enriched language does not disrupt a programmer's typical workflow. This paper presents a recipe for equipping existing textual programming languages as well as accompanying IDEs with a mechanism for creating and using graphical interactive syntax. It also presents the first hybrid language and IDE created using the recipe.
Paper Structure (32 sections, 15 figures)

This paper contains 32 sections, 15 figures.

Table of Contents

  1. Mixing Text with Visual and Interactive Syntax
  2. Requirements for Creating a Hybrid Language
  3. The Ingredients
  4. Selecting High-Quality Ingredients
  5. Example Ingredients
  6. A First Taste
  7. A Recipe for Adapting a Language
  8. The Recipe
  9. Applying the Recipe to ClojureScript
  10. Working with the Adapted ClojureScript
  11. State
  12. The Renderer
  13. The Elaborator
  14. Adapting an IDE to Hybrid Clojure-Script
  15. elIDE Needs a Hint
  16. ...and 17 more sections

Figures (15)

  • Figure 1: Computing Bézier points
  • Figure 2: In-IDE view of the Bézier function
  • Figure 3: A close look at the Bézier-specific syntax extension
  • Figure 4: Desiderata comparison for interactive syntax designs
  • Figure 5: Interactive-syntax extensions at work
  • ...and 10 more figures