Jump to content

Connect SuperML | Leeroopedia MCP: Equip your AI agents with best practices, code verification, and debugging knowledge. Powered by Leeroo — building Organizational Superintelligence. Contact us at founders@leeroo.com.

Principle:FlowiseAI Flowise Node Registry Loading

From Leeroopedia
Attribute Value
Source Repository FlowiseAI/Flowise
Domain Chatflow_Creation
Workflow Chatflow_Creation
Last Updated 2026-02-12

Overview

Technique for loading the complete registry of available node component definitions from the server to populate a visual canvas editor. When a canvas editor initializes, it must load all available node type definitions from the backend. These definitions include input parameters, output anchors, credential requirements, and base classes, enabling the drag-and-drop palette and determining what nodes can be connected.

Motivation

A visual flow editor needs to know the full catalog of available component types before users can start building flows. Without a comprehensive node registry:

  • The drag-and-drop sidebar cannot be populated with available components.
  • The system cannot validate connection compatibility between node types.
  • Default parameter values and form field configurations would be unknown.
  • Credential requirements for external service integrations would not be discoverable.

Loading the registry at initialization time ensures the editor is fully operational from the moment the user begins interacting with it.

Description

The Node Registry Loading principle follows the Registry Pattern where a central catalog of component definitions is loaded at initialization time. Each definition is a schema describing a node's inputs, outputs, and metadata.

Initialization Sequence

  1. The canvas component mounts and immediately dispatches a request to fetch all node definitions from the server.
  2. The server responds with an array of NodeDefinition objects, each representing a component type (e.g., LLM, chain, tool, memory, vector store).
  3. The definitions are stored in the Redux store (via canvas.componentNodes) and passed to the AddNodes sidebar component.
  4. Each definition includes metadata for:
    • Input classification -- Which inputs are form-configurable parameters vs. connection anchors.
    • Output typing -- What base classes the node's output satisfies, determining connection compatibility.
    • Category grouping -- How nodes are organized in the sidebar palette (e.g., "Chat Models", "Chains", "Tools").
    • Credential binding -- Whether the node requires external API credentials.

Node Definition Schema

Each node definition contains:

{
  name: string,           // Unique component identifier (e.g., "chatOpenAI")
  label: string,          // Display name (e.g., "ChatOpenAI")
  type: string,           // Node type classification
  icon: string,           // Icon identifier or path
  category: string,       // Sidebar grouping (e.g., "Chat Models")
  description: string,    // Human-readable description
  baseClasses: string[],  // Output type classes for connection compatibility
  inputs: InputDef[],     // Array of input parameter/anchor definitions
  outputs: OutputDef[],   // Array of output anchor definitions
  credential: object,     // Optional credential input definition
  version: number         // Component version for sync detection
}

Theoretical Basis

This principle is based on the Registry Pattern, a well-established design pattern where a central catalog of component schemas is loaded once and consulted throughout the application lifecycle. Key properties include:

  • Single load, multiple consumers -- The registry is fetched once at initialization and consumed by the sidebar palette, the node initialization logic, the connection validator, and the sync detection system.
  • Schema-driven UI -- Rather than hardcoding UI for each node type, the editor dynamically generates form fields, connection handles, and visual representations from the node definition schema. This makes the system extensible without frontend code changes.
  • Version tracking -- Each definition carries a version number, enabling the UI to detect when a placed node is outdated relative to the current server-side definition and prompt the user to sync.
  • Lazy evaluation -- While the registry is loaded eagerly, individual node instances are only created when the user drops a node onto the canvas, deferring the cost of initialization.

Usage

Use this principle when initializing a visual flow canvas editor that needs to know all available component types. It applies to:

  • Populating a drag-and-drop component palette from server-provided definitions.
  • Validating edge connections based on type compatibility from node definitions.
  • Detecting outdated nodes that need to be synced with newer server-side definitions.

Related Pages

Page Connections

Double-click a node to navigate. Hold to expand connections.
Principle
Implementation
Heuristic
Environment