Extensions in ComfyUI are modular JavaScript modules that extend and enhance the functionality of the frontend. The extensions in this directory are considered "core" as they provide fundamental features that are built into ComfyUI by default.

Extension Architecture

ComfyUI's extension system follows these key principles:

Registration-based: Extensions must register themselves with the application using app.registerExtension()
Hook-driven: Extensions interact with the system through predefined hooks
Non-intrusive: Extensions should avoid directly modifying core objects where possible

Core Extensions List

The core extensions include:

Extension	Description
clipspace.ts	Implements the Clipspace feature for temporary image storage
dynamicPrompts.ts	Provides dynamic prompt generation capabilities
groupNode.ts	Implements the group node functionality to organize workflows
load3d.ts	Supports 3D model loading and visualization
maskeditor.ts	Implements the mask editor for image masking operations
noteNode.ts	Adds note nodes for documentation within workflows
rerouteNode.ts	Implements reroute nodes for cleaner workflow connections
uploadImage.ts	Handles image upload functionality
webcamCapture.ts	Provides webcam capture capabilities
widgetInputs.ts	Implements various widget input types

Extension Development

When developing or modifying extensions, follow these best practices:

Use provided hooks rather than directly modifying core application objects
Maintain compatibility with other extensions
Follow naming conventions for both extension names and settings
Properly document extension hooks and functionality
Test with other extensions to ensure no conflicts

Extension Registration

Extensions are registered using the app.registerExtension() method:

app.registerExtension({
  name: "MyExtension",
  
  // Hook implementations
  async init() {
    // Implementation
  },
  
  async beforeRegisterNodeDef(nodeType, nodeData, app) {
    // Implementation
  }
  
  // Other hooks as needed
});

Extension Hooks

ComfyUI extensions can implement various hooks that are called at specific points in the application lifecycle:

Hook Execution Sequence

Web Page Load

init
addCustomNodeDefs
getCustomWidgets
beforeRegisterNodeDef    [repeated multiple times]
registerCustomNodes
beforeConfigureGraph
nodeCreated
loadedGraphNode
afterConfigureGraph
setup

Loading Workflow

beforeConfigureGraph
beforeRegisterNodeDef   [zero, one, or multiple times]
nodeCreated             [repeated multiple times]
loadedGraphNode         [repeated multiple times]
afterConfigureGraph

Adding New Node

nodeCreated

Key Hooks

Hook	Description
`init`	Called after canvas creation but before nodes are added
`setup`	Called after the application is fully set up and running
`addCustomNodeDefs`	Called before nodes are registered with the graph
`getCustomWidgets`	Allows extensions to add custom widgets
`beforeRegisterNodeDef`	Allows extensions to modify nodes before registration
`registerCustomNodes`	Allows extensions to register additional nodes
`loadedGraphNode`	Called when a node is reloaded onto the graph
`nodeCreated`	Called after a node's constructor
`beforeConfigureGraph`	Called before a graph is configured
`afterConfigureGraph`	Called after a graph is configured
`getSelectionToolboxCommands`	Allows extensions to add commands to the selection toolbox

For the complete list of available hooks and detailed descriptions, see the ComfyExtension interface in comfy.ts.

README.md

Core Extensions

Table of Contents

Overview