Live, Rich, and Composable Programming with Engraft

Title of the Paper

Engraf: An API for Live, Rich, and Composable Programming

Paper Information

• Research Area: Human-Computer Interaction, Programming Environment Design, Visualization/Interactive Programming Tools
• Keywords: live programming, visual programming, end-user programming, composition, computational notebooks, GUIs

Research Background and Problem Statement

• Identified Challenges and Problems:

  1. Traditional programming tools and interfaces are centered around plain text editing, lacking support for real-time feedback and composability.
  2. Although various live and rich tools exist, such as data visualization tools (e.g., Lyra) and data cleaning tools (e.g., Wrangler), their use cases remain relatively limited and fail to address a wide range of programming tasks.
  3. Live and rich tools are not easily integrated with traditional codebases or other toolsets, lacking composability with other tools or environments.

• Significance:

  • Visual programming and real-time feedback can lower the learning curve, enabling more users to accomplish complex tasks more easily.
  • The composability potential of live and rich tools has not been fully explored; achieving this could significantly enhance development efficiency and tool applicability.

• Research Motivation and Objectives:

  • Propose a highly extensible architecture (Engraf API) to support three forms of tool and environment composition:
    1. Composition of Tools in Environments.
    2. Nested Composition of Environments in Environments.
    3. Composition of Tools and Environments in the Outside World.
  • Implement this architecture to enable broader tool integration and practical use cases.

Solution

• Method and Framework:

  • Engraf API is a component-based API designed to embed live and rich tools into larger programming environments (e.g., computational notebooks).
  • The core functionality of the API is based on a unified component/host interface, enabling recursive nesting and decoupling of tools and environments.

• Innovations:

  • Proposed and implemented three types of composition:
    1. Embedding tools within computational environments (e.g., embedding graphical tools directly into Jupyter Notebook cells).
    2. Supporting nested environments (e.g., embedding one notebook within another to represent multi-level code structures).
    3. Embedding tools and environments into external systems (e.g., traditional codebases, command-line systems, or standalone applications).
  • Provided recursive interfaces to support multi-level nesting and diverse contextual operations.
  • Abstracted tool descriptions as serialized objects (rather than generating traditional code), enabling more flexible tool design.

• Implementation Steps:

  1. Developed components and tools using the web platform, supporting interoperability via a unified interface.
  2. Built an extensible component tree (Slots) to support hierarchical nesting of tools and environments.
  3. Implemented an incremental computation framework (Refunc) to reduce unnecessary recalculations during programming, enhancing real-time interaction performance.

Research Outcomes

• Key Results:

  • Developed the Engraf API, an open architecture supporting various real-time programming tasks.
  • Implemented 25 example components (including notebooks, command-line tools, data transformers, etc.), demonstrating the flexibility and applicability of the API.
  • Created a toolset that can be embedded into multiple real-time development systems (e.g., React, UNIX shell).

• Advantages Compared to Existing Tools:

  • Compared to existing tools (e.g., mage), Engraf supports higher levels of nested composition and recursive nesting, covering more computational scenarios.
  • Provided adaptive interfaces for tools, reducing the complexity of data interaction between tools for developers.

• Experimental and Evaluation Results:

  1. Multiple case studies demonstrated the success of components in composability, real-time feedback, and multi-platform applications.
  2. Analyzed using the "Technical Dimensions of Programming Systems" (TDPS) framework, verifying the system's advantages in interaction modes, symbolic composition, composability, and self-modification capabilities.

• Limitations and Future Directions:

  • Limitations:
    1. Currently, Engraf components and tools still rely on traditional JavaScript implementations and have not achieved fully self-contained "self-sustainable" development.
    2. In its current form, interactive tool users may face a high learning curve when interacting with different components.
  • Future Directions:
    1. Enhance compatibility between tools and traditional version control systems (e.g., Git), improving JSON conflict resolution functionality.
    2. Expand meta-components that allow users to create new tools based on Engraf, increasing flexibility.
    3. Explore more embedded use cases, especially in non-programming applications (e.g., animation editors).