> ## Documentation Index
> Fetch the complete documentation index at: https://dripart-feat-openapi-i18n.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# 서브그래프 - 워크플로우를 간소화하세요

> ComfyUI의 서브그래프 기능에 대한 소개로, 서브그래프 생성, 탐색 및 관리 방법을 포함합니다.

<Note>
  서브그래프 기능은 ComfyUI 프론트엔드 버전 1.24.3 이상을 필요로 합니다. 이 기능이 보이지 않는 경우 다음을 참조하십시오: [ComfyUI 업데이트 방법](/ko/installation/update_comfyui)

  * 이 문서의 이미지는 야간 버전 프론트엔드로 제작되었으며, 실제 인터페이스를 참고해 주세요.
  * 서브그래프를 노드로 다시 변환하는 등의 일부 기능은 향후 지원될 예정입니다.
</Note>

<Tip>
  프로그래밍 방식으로 서브그래프를 다루는 개발자 문서는 [서브그래프 개발자 가이드](/ko/custom-nodes/js/subgraphs)를 참조하십시오.
</Tip>

<iframe className="w-full aspect-video rounded-xl" src="https://www.youtube.com/embed/xgQoGT-VpxE?si=hD5196gcX0RW-0Ko" title="ComfyUI 선택 도구상자 신기능" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />

서브그래프는 복잡한 워크플로우를 하나의 재사용 가능한 서브그래프 노드로 묶어 관리와 공유를 쉽게 해주는 강력한 ComfyUI 기능입니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=17f07af2b315727c067117bfaaf00b97" alt="서브그래프" width="3080" height="814" data-path="images/interface/features/subgraph/subgraph.jpg" />

서브그래프를 워크플로우의 '폴더'라고 생각해보세요—관련된 노드들을 그룹화하고 전체 컬렉션을 하나의 통합된 서브그래프 노드로 사용할 수 있습니다.

**서브그래프를 활용하여:**

* 복잡한 워크플로우를 간소화하세요
* 자주 사용하는 노드 조합을 재사용하세요
* 모듈식 구성 요소를 통해 더 효율적인 워크플로우를 구축하세요

## 서브그래프 생성하기

<Steps>
  <Step title="노드 선택">
    ComfyUI에서 그룹화하려는 노드를 선택하세요
  </Step>

  <Step title="서브그래프 아이콘 클릭">
    <img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph_icon.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=695dbd38055738fa08e37066a923218e" alt="서브그래프 아이콘" width="1517" height="700" data-path="images/interface/features/subgraph/subgraph_icon.jpg" />

    도구모음에서 서브그래프 아이콘을 찾으세요
  </Step>

  <Step title="서브그래프 생성 완료">
    <img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/workflow_using_subgraph.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=6751f1ad087edb110fad4aa2e5e507cf" alt="서브그래프 사용 워크플로우" width="1820" height="884" data-path="images/interface/features/subgraph/workflow_using_subgraph.jpg" />

    ComfyUI는 선택한 노드의 입력과 출력을 기반으로 자동으로 서브그래프를 생성합니다
  </Step>

  <Step title="서브그래프 맞춤 설정">
    [서브그래프 편집하기](#editing-subgraphs)를 참고해, 서브그래프를 편집하고 정리하여 완벽한 기능의 노드로 만들 수 있습니다

    <img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph_after_edited.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=deb5a377f19a5801e0ae4269f9a566e1" alt="서브그래프 사용 워크플로우" width="1820" height="884" data-path="images/interface/features/subgraph/subgraph_after_edited.jpg" />
  </Step>
</Steps>

## 서브그래프 작업하기

### 기본 작업

서브그래프는 일반 노드와 똑같이 작동합니다. 다음과 같은 작업을 할 수 있습니다:

* 색상과 이름 변경
* 비활성화를 위한 바이패스 사용
* 모든 표준 노드 작업 적용 가능

### 서브그래프 편집하기

**편집 모드 진입 방법:**

* 서브그래프 내부의 빈 영역(위젯이 아닌 곳)을 더블클릭하거나,
* 서브그래프 편집 버튼을 클릭하세요

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/editing_subgraph.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=80c7645ef390362e133354ee7b69729c" alt="서브그래프 편집 모드" width="1820" height="1203" data-path="images/interface/features/subgraph/editing_subgraph.jpg" />

**편집 모드에서는 다음을 확인할 수 있습니다:**

1. **탐색바**: 현재 서브그래프를 나가고 상위 레벨로 돌아갈 수 있습니다
2. **입력 슬롯**: 외부에 노출된 내부 노드 입력
   * 출력을 일반 노드처럼 슬롯에 연결하세요
   * 연결 지점을 **마우스 오른쪽 클릭**하여 노출 슬롯의 이름을 바꾸거나 삭제하세요
3. **출력 슬롯**: 외부에 노출된 출력(입력 슬롯과 동일한 기능)

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph_slot.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=1f9c410714e7f49801e370a23bb04979" alt="서브그래프 슬롯" width="1736" height="921" data-path="images/interface/features/subgraph/subgraph_slot.jpg" />

**슬롯 작업하기:**

1. **기본 슬롯**(라벨 1): 새 입력/출력 연결을 추가할 때 사용하세요
2. 기존 슬롯을 **마우스 오른쪽 클릭**하여 이름 변경, 삭제 또는 원래 노드와의 연결 해제를 하세요

> 참고: 슬롯 연결은 표준 데이터 유형 검증 규칙을 따릅니다

### 매개변수 패널

ComfyUI v0.3.66 이상에서는 서브그래프에 들어가지 않고도 매개변수 패널에서 바로 서브그래프 매개변수를 편집할 수 있습니다.

원하는 서브그래프를 선택하고 "서브그래프 위젯 편집" 버튼을 사용해 매개변수 패널을 열 수 있습니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/parameters_panel_open.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=465d26b4a90dc08c3cb2e0ab7d55f26c" alt="매개변수 패널 열기" width="1330" height="1176" data-path="images/interface/features/subgraph/parameters_panel_open.jpg" />

열린 후에는 매개변수 패널에서 서브그래프 위젯의 순서와 가시성을 직접 편집할 수 있습니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/parameters_panel_edit.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=05ff4522308a5c72ef79dceeea78ad0b" alt="매개변수 패널 편집" width="1456" height="1492" data-path="images/interface/features/subgraph/parameters_panel_edit.jpg" />

1. 순서 변경: 위젯을 마우스 오른쪽 클릭한 채로 드래그하여 원하는 위치로 이동하세요
2. 가시성: 눈 아이콘을 클릭해 위젯의 가시성을 확인할 수 있습니다

### 중첩 서브그래프

서브그래프 안에 서브그래프를 중첩해 더욱 복잡한 워크플로우를 만들 수 있습니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph_nested.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=97213fe7571e821ae93d297f631bfe32" alt="중첩 서브그래프" width="1820" height="1203" data-path="images/interface/features/subgraph/subgraph_nested.jpg" />

탐색바는 현재 레벨을 보여주며 중첩된 서브그래프 간에 쉽게 이동할 수 있게 해줍니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph_navigation.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=966be113f79e6a5d57a8c48546e6d0ce" alt="중첩 서브그래프 탐색" width="1820" height="1203" data-path="images/interface/features/subgraph/subgraph_navigation.jpg" />

### 서브그래프 나가기

서브그래프를 나가고 상위 레벨로 돌아가려면:

* 캔버스 상단의 **탐색바**(이미지의 라벨 1)를 사용하거나,
* **Esc** 키를 누르세요

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/editing_subgraph.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=80c7645ef390362e133354ee7b69729c" alt="서브그래프 편집 모드" width="1820" height="1203" data-path="images/interface/features/subgraph/editing_subgraph.jpg" />

탐색바를 클릭하거나 Esc 키를 누르면 현재 서브그래프를 나가고 상위 워크플로우로 돌아갑니다.

## 서브그래프를 노드로 풀기

서브그래프를 만든 후 필요하다면 다시 노드로 변환할 수 있습니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph_to_nodes.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=dcd76192d1224c8af7dcbc0ba08dd398" alt="서브그래프를 노드로" width="912" height="548" data-path="images/interface/features/subgraph/subgraph_to_nodes.jpg" />

1. 서브그래프 노드를 선택한 후 마우스 오른쪽 클릭 메뉴의 "서브그래프 풀기"를 사용해 다시 노드로 변환할 수 있습니다.
2. 선택 도구상자에서 "서브그래프 풀기" 버튼을 클릭해 다시 노드로 변환할 수 있습니다.

## 서브그래프 블루프린트

ComfyUI 프론트엔드 버전 1.27.7 이상에서는 서브그래프를 노드 라이브러리에 게시할 수 있습니다.

이 기능을 통해 서브그래프를 `서브그래프 블루프린트` 노드로 변환할 수 있으며, 이는 재사용 가능한 서브그래프 노드임을 의미합니다.

### 서브그래프를 노드 라이브러리에 게시하기

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph_publishing.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=bc7bb5cbad0c0d1e9e4e6f8aa8be12bf" alt="서브그래프 게시" width="1286" height="1214" data-path="images/interface/features/subgraph/subgraph_publishing.jpg" />

현재 두 가지 방법으로 서브그래프를 노드 라이브러리에 게시할 수 있으며, 모두 선택 도구상자에 있습니다:

1. 선택 도구상자의 `책(게시)` 아이콘을 클릭하세요
2. 선택 도구상자 메뉴를 열고 `라이브러리에 서브그래프 추가` 메뉴를 사용해 게시하세요

`책(게시)` 아이콘 또는 `라이브러리에 서브그래프 추가` 메뉴를 클릭한 후, 다음과 같은 대화창이 나타납니다:

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph_naming.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=78ced3dae938da144cb182e35e7128ab" alt="서브그래프 명명" width="1286" height="840" data-path="images/interface/features/subgraph/subgraph_naming.jpg" />

기본적으로 서브그래프는 서브그래프 노드의 이름을 서브그래프 블루프린트의 이름으로 사용합니다.

게시 후에는 노드 라이브러리에서 서브그래프 블루프린트 노드를 확인할 수 있습니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph_blueprints.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=d102fcbdf667e2cbc29c95227de5a95b" alt="서브그래프 블루프린트 노드" width="2003" height="1242" data-path="images/interface/features/subgraph/subgraph_blueprints.jpg" />

이제 일반 노드처럼 서브그래프를 드래그하거나 검색할 수 있습니다. 서브그래프 블루프린트에서 추가된 새로운 서브그래프 노드는 여전히 격리되어 있어, 워크플로우에 추가한 후에도 독립적으로 편집 가능하며 서로 영향을 미치지 않습니다.

### 서브그래프 블루프린트 편집하기

서브그래프 블루프린트를 편집하려면 아래 이미지와 같이 편집 버튼을 클릭하면 됩니다. 삭제도 가능합니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/edit_subgraph_blueprints.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=544349ed3d08220cfe366c4ff6cd77a3" alt="서브그래프 블루프린트 편집" width="2000" height="1245" data-path="images/interface/features/subgraph/edit_subgraph_blueprints.jpg" />

이렇게 하면 서브그래프 편집 모드가 활성화됩니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/subgraph_editing_mode.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=c1fa9e531ddcf6589be7266c735214ea" alt="서브그래프 편집 모드" width="2000" height="1359" data-path="images/interface/features/subgraph/subgraph_editing_mode.jpg" />

서브그래프 블루프린트를 편집한 후에는 상위 레벨로 가서 서브그래프를 미리 볼 수 있습니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/EaUP8P-2F-ZeIkZ9/images/interface/features/subgraph/save_updated_subgraph.jpg?fit=max&auto=format&n=EaUP8P-2F-ZeIkZ9&q=85&s=e1ee8259095f59ce10e57c57bb12d549" alt="서브그래프 블루프린트 업데이트" width="2000" height="1359" data-path="images/interface/features/subgraph/save_updated_subgraph.jpg" />

업데이트된 서브그래프 블루프린트를 저장하려면 저장 버튼을 클릭하거나 단축키 Ctrl + S를 사용하세요.
