# jagenjo/litegraph.js

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/jagenjo-litegraph-js).**

7,871 stars · 825 forks · JavaScript · mit

## Links

- GitHub: https://github.com/jagenjo/litegraph.js
- awesome-repositories: https://awesome-repositories.com/repository/jagenjo-litegraph-js.md

## Topics

`blueprints` `canvas2d` `editor` `graph` `graphs` `javascript` `modular` `nocode` `node-graph` `nodejs` `nodes` `visual` `visual-programming` `workflow`

## Description

litegraph.js is a JavaScript dataflow framework and visual node graph engine used to define programmable logic and data flow. It provides a node-based visual programming tool for designing complex logic through connected functional blocks.

The library allows for the creation of hierarchical logic by nesting multiple nodes into recursive subgraphs. It also supports the development of custom node types with unique inputs and outputs, as well as custom widgets and live views that can hide the underlying graph structure to present a visual interface.

The engine enables the execution of logic graphs for real-time data processing across both web browser and server environments. It covers a broad range of capabilities including modular workflow design and visual interface prototyping.

## Tags

### User Interface & Experience

- [Visual Node Editors](https://awesome-repositories.com/f/user-interface-experience/visual-node-editors.md) — Provides a framework for building interactive node-based graph interfaces to define programmable logic and data flow. ([source](https://cdn.jsdelivr.net/gh/jagenjo/litegraph.js@master/README.md))
- [Nested Graph Encapsulation](https://awesome-repositories.com/f/user-interface-experience/visual-node-editors/nested-graph-encapsulation.md) — Enables grouping multiple nodes into single parent nodes to simplify complex logic and organize workspaces. ([source](https://cdn.jsdelivr.net/gh/jagenjo/litegraph.js@master/README.md))
- [Custom Widget Implementation](https://awesome-repositories.com/f/user-interface-experience/custom-widget-frameworks/custom-widget-implementation.md) — Provides custom UI controls inside nodes for real-time parameter manipulation during graph execution.
- [Visual Interface Prototyping](https://awesome-repositories.com/f/user-interface-experience/visual-interface-prototyping.md) — Allows development of custom widgets and live views that hide underlying graphs to present clean user interfaces.

### Business & Productivity Software

- [Custom Functional Node Development](https://awesome-repositories.com/f/business-productivity-software/workflow-automation/custom-functional-node-development.md) — Supports creating specialized functional blocks with unique inputs and outputs to extend graph capabilities.

### Data & Databases

- [Real-Time Data Processors](https://awesome-repositories.com/f/data-databases/data-processing-pipelines/data-processing/distributed-processing-frameworks/real-time-data-processors.md) — Executes logic graphs across browser or server environments to process and route data in real-time.

### Development Tools & Productivity

- [Node Type Definitions](https://awesome-repositories.com/f/development-tools-productivity/visual-block-designers/node-type-definitions.md) — Allows the definition of new functional blocks by specifying inputs, outputs, execution logic, and visual properties. ([source](https://cdn.jsdelivr.net/gh/jagenjo/litegraph.js@master/README.md))
- [Dynamic Plugin Registrations](https://awesome-repositories.com/f/development-tools-productivity/dynamic-plugin-registrations.md) — Allows new functional blocks to be defined and added to the runtime system without restarting the application.

### Graphics & Multimedia

- [Node Graph Engines](https://awesome-repositories.com/f/graphics-multimedia/visualization-mapping/node-graph-engines.md) — Acts as a JavaScript library for creating interactive node-based graphs to define programmable logic and data flow.
- [Canvas Rendering](https://awesome-repositories.com/f/graphics-multimedia/canvas-rendering.md) — Uses a 2D canvas to render the graph interface and node connections for high-performance interaction.
- [Graph Visualization Libraries](https://awesome-repositories.com/f/graphics-multimedia/visualization-mapping/graph-visualization-libraries.md) — Provides a library for rendering hierarchical data as interactive node-link diagrams with custom widgets.

### Programming Languages & Runtimes

- [Cross-Environment Runtimes](https://awesome-repositories.com/f/programming-languages-runtimes/runtime-execution-environments/javascript-runtimes/cross-environment-runtimes.md) — Executes the same graph logic across both web browsers and Node.js server environments using a shared API.
- [Visual Logic Programming](https://awesome-repositories.com/f/programming-languages-runtimes/visual-logic-programming.md) — Enables building interactive node graphs to define programmable data flow and logic without traditional linear code.

### Software Engineering & Architecture

- [Dataflow Frameworks](https://awesome-repositories.com/f/software-engineering-architecture/dataflow-frameworks.md) — Implements a system for executing logic graphs across browser and server environments using custom functional nodes.
- [Execution Graphs](https://awesome-repositories.com/f/software-engineering-architecture/execution-graphs.md) — Implements a directed network of connected input and output ports to trigger function calls and process data.
- [Hierarchical Nesting](https://awesome-repositories.com/f/software-engineering-architecture/workflow-nodes/hierarchical-nesting.md) — Supports grouping collections of nodes into composite nodes to create hierarchical layers of programmable logic.
- [Graph-Based Modularity](https://awesome-repositories.com/f/software-engineering-architecture/modular-design-patterns/graph-based-modularity.md) — Organizes complex logic by nesting multiple functional nodes into simplified subgraphs for better workspace management.

### Artificial Intelligence & ML

- [Live View Modes](https://awesome-repositories.com/f/artificial-intelligence-ml/generative-ai-resources/diffusion-visual-models/generative-ai-models/diffusion-models/visual-graph-interfaces/live-view-modes.md) — Hides the graph structure using a live mode to display only custom rendering or node widgets. ([source](https://cdn.jsdelivr.net/gh/jagenjo/litegraph.js@master/README.md))

### Part of an Awesome List

- [Visual Programming](https://awesome-repositories.com/f/awesome-lists/devtools/visual-programming.md) — Browser-based node graph editor.
- [Web Frameworks](https://awesome-repositories.com/f/awesome-lists/devtools/web-frameworks.md) — A graph node engine and editor similar to PD or UDK Blueprints, comes with its own editor in HTML5 Canvas2D.
