ComfyUI
ComfyUI copied to clipboard
[Announcement] ComfyUI Frontend Modernization: Transitioning to a New Era on August 15, 2024
ComfyUI Frontend Update Announcement
Summary
Effective August 15, 2024, we will be replacing the legacy frontend currently hosted in this repository with our new frontend (https://github.com/Comfy-Org/ComfyUI_frontend).
Why a New Frontend?
Our current frontend is built using vanilla JavaScript ESM modules without package management, which has led to significant challenges in development. We've been reinventing solutions for problems that already have established, efficient answers. The new frontend leverages TypeScript, Vue, and Vite, offering a more robust and maintainable codebase. We've also developed a custom shim extension in the Vite build process to ensure full compatibility with our existing frontend extension ecosystem. This new tech stack will dramatically accelerate the development of new frontend features.
New Features
The new frontend introduces numerous quality-of-life improvements. For a comprehensive list, please visit: https://github.com/Comfy-Org/ComfyUI_frontend#qol-changes
Early Adoption
If you're eager to experience the new frontend before the official transition, you can opt-in now by adding the following command line argument to your ComfyUI launch script:
--front-end-version Comfy-Org/ComfyUI_frontend@latest
This will use the latest release of the new frontend. If you prefer to use a specific version for stability, you can specify a version number:
--front-end-version Comfy-Org/[email protected]
Legacy UI Access After Deprecation
Following the transition on August 15, 2024, we will preserve a snapshot of the legacy UI in a new repository: Comfy-Org/ComfyUI_legacy_frontend. Users who need to revert to the legacy UI can do so using the following command line argument:
--front-end-version Comfy-Org/ComfyUI_legacy_frontend@latest
We're excited about this update and the improvements it brings to ComfyUI. Thank you for your continued support and feedback as we evolve our platform.
is this true? @comfyanonymous
Yes
Yes, if you have any concerns you can go test the new frontend and report any issues you have.
Is the new frontend still noodle junction or is it actually made for regular people now?
EDIT : Never mind just tried it and noticed it's still made without regular users in mind.
Is the new frontend still noodle junction or is it actually made for regular people now?
EDIT : Never mind just tried it and noticed it's still made without regular users in mind.
The current stage is more about laying the foundation rather than focusing on the outwardly visible aspects. The UI/UX will be improved gradually in stages.
I try it on Mac M2. I get a white screen. Nothing appears.
I try it on Mac M2. I get a white screen. Nothing appears.
Any browser console logs? (Toggle dev tools with f12)
I try it on Mac M2. I get a white screen. Nothing appears.
Any browser console logs? (Toggle dev tools with f12)
This time the screen is not white. ComfyUI appeared after something seems to load
Error: Invalid ComfyNodeDef: {"input":{"required":{"data":["*",""],"text":["STRING",{"multiline":true}]},"hidden":{"prompt":"PROMPT","extra_pnginfo":"EXTRA_PNGINFO","unique_id":"UNIQUE_ID"}},"output":[],"output_is_list":[],"output_name":[],"name":"ImpactLogger","display_name":"ImpactLogger","description":"","python_module":"custom_nodes.ComfyUI-Impact-Pack","category":"ImpactPack/Debug","output_node":true}
Validation error: Array must contain at most 1 element(s) at "input.required.data"
validateComfyNodeDef apiTypes.ts:292
getNodeDefs api.ts:253
registerNodes app.ts:1968
registerNodes workflow-component.js:328
setup app.ts:1901
setup GraphCanvas.vue:45
createHook runtime-core.esm-bundler.js:1808
callWithErrorHandling runtime-core.esm-bundler.js:195
callWithAsyncErrorHandling runtime-core.esm-bundler.js:202
__weh runtime-core.esm-bundler.js:1788
flushPostFlushCbs runtime-core.esm-bundler.js:379
render3 runtime-core.esm-bundler.js:5805
mount runtime-core.esm-bundler.js:3062
mount runtime-dom.esm-bundler.js:1530
@tpcdaz if you want a friendlier non-noodle frontend to the Comfy core you can use https://github.com/mcmonkeyprojects/SwarmUI
@Creative-comfyUI
The impact pack def is fixed in the latest version. https://github.com/ltdrdata/ComfyUI-Impact-Pack/pull/674
The WAS def is still an unmerged PR to fix. https://github.com/WASasquatch/was-node-suite-comfyui/pull/440
These erorr messages only affect the corresponding nodes only (Not the whole pack). If you don't use these nodes. You should be fine.
@Creative-comfyUI
The impact pack def is fixed in the latest version. ltdrdata/ComfyUI-Impact-Pack#674
The WAS def is still an unmerged PR to fix. WASasquatch/was-node-suite-comfyui#440
These erorr messages only affect the corresponding nodes only (Not the whole pack). If you don't use these nodes. You should be fine.
That is, if I disable these nodes, will I see the new interface? I hope WAS will fix it before the release date
@Creative-comfyUI The impact pack def is fixed in the latest version. ltdrdata/ComfyUI-Impact-Pack#674 The WAS def is still an unmerged PR to fix. WASasquatch/was-node-suite-comfyui#440 These erorr messages only affect the corresponding nodes only (Not the whole pack). If you don't use these nodes. You should be fine.
That is, if I disable these nodes, will I see the new interface? I hope WAS will fix it before the release date
The new frontend is replacing the underlying code. You should still see the same ComfyUI interface you use in the legacy JS. There is a beta UI in progress, which is not part of this release, but you are welcomed to try it:
The node def errors you see in the console do not block the normal functionality of the other frontend code. So you don't need to disable any node pack.
@comfyanonymous @huchenlei the main feature I'm looking for is subgraphs. i.e. the ability to hide parts of the graph in subcomponents (or even have workflows themselves be subgraphs) so that we can compose things without creating monstrosities. @space-nuko @rsamf have both worked on their own versions of this , but with this rewrite will we get an officially supported version of this? thanks!
@comfyanonymous @huchenlei the main feature I'm looking for is subgraphs. i.e. the ability to hide parts of the graph in subcomponents (or even have workflows themselves be subgraphs) so that we can compose things without creating monstrosities. @space-nuko @rsamf have both worked on their own versions of this , but with this rewrite will we get an officially supported version of this? thanks!
While it's not happening immediately, we are developing a roadmap for frontend improvements through various discussions.
Is the new frontend still noodle junction or is it actually made for regular people now?
EDIT : Never mind just tried it and noticed it's still made without regular users in mind.
The limitations of the current vanilla framework are hindering the dev's ability to enhance user friendliness. Building a robust frontend is challenging when the underlying foundation is not optimal.
The new frontend aims to address these issues, among other enhancements. A recent improvement in regards to user friendliness is the addition of tooltips that appear when hovering over nodes.
While these changes take time, recent commits that the developers have made indicate they are working at a very fast pace.
Love the new UI! In addition, can the menu bar on the left be made left and right selectable?
I like the new UI Direction, but with over 1000 custom nodes and ZOD schema to validate the types, I see a lot of problems coming up for people. If one of the nodes works against the ZOD scheme, the workflow will no longer work. The majority of users will not have any dev experience and will struggle with debugging.
Any plans on building a custom text area that doesn't use the html one? In order to avoid that ugly thing where the textareas' z-index takes precedence over anything else on the canvas.
Awesome. Just wondering if you will/already are implementing a new font or the ability for the end user to select a font.
Many thanks!
Haw can we access to manager?
Haw can we access to manager?
Manager supports New UI, already.
I like the new UI Direction, but with over 1000 custom nodes and ZOD schema to validate the types, I see a lot of problems coming up for people. If one of the nodes works against the ZOD scheme, the workflow will no longer work. The majority of users will not have any dev experience and will struggle with debugging.
The node def validation only drop the nodes with invalid defs. It should not block you using rest of nodes. We have tested most popular node packs and submitting fixing PRs to their repos to fix a few invalid defs. Please make sure your custom nodes are updated to include these fixing PRs.
Haw can we access to manager?
Manager supports New UI, already.
]
I cant see that
Haw can we access to manager?
Manager supports New UI, already.
] I cant see that
You probably need to update your ComfyUI manager.
yes. you are right.
did we lost the search button? (when we drag from an output slot)
did we lost the search button? (when we drag from an output slot)
I can confirm this, the search is missing. Was it removed or just temporarily missing?
I think this menu should open to above itself.
Just played for a few hours, and I'm unable to copy nodes and paste them. Right click menu is missing the Paste (Clipspace) option after right clicking on a node and selecting Copy (Clipspace).
did we lost the search button? (when we drag from an output slot)
I can confirm this, the search is missing. Was it removed or just temporarily missing?
Release with shift brings up the searchbox. We might want to make that as default behavior without shift later.

] I cant see that