Comments (4)
Folders seem like the way to go. Thanks. Closing for now
from sequential-workflow-designer.
Hello @hchaudhary1!
Wow, this algorithm is huge. I thought that the stress test example is big, but your example is bigger (2871 steps). 😅
I think the main problem is not the designer but your design overall. Even if the designer would be better optimized and use less memory, then still with that many elements on the canvas the user experience would be poor.
I think you need a way to apply the "don't repeat yourself" principle by your users. You can achieve that in many ways like creating a way to reuse a logic. For example you can create a step that executes another flow.
Another way is to move conditions at the step level, in this example you can see that, each branch has own "condition". It's a simple string but it could be a complex editor. Additionaly check this example.
Also, you could use the folder step component to group some parts of your logic.
from sequential-workflow-designer.
Thanks for reviewing this. Our users are not programers unfortunately, and didn't understand the concept of functions, instead they just copy-paste the logic everywhere. Perhaps we can run a script that automatically groups the sub-routines.
A few follow-up questions:
- Folders -- The JSON will still stay very large. Is the slowness due to large JSON or is it due to graphics rendering?
- Any hope to offload rendering to WebGL for better speed?
- Here is a zoom-in of the canvas... what do you mean by "move conditions at the step level"?
from sequential-workflow-designer.
-
I suppose the cause is a large amount of HTML nodes in the DOM. The designer is not responsible directly for rendering, it generates the DOM structure by using SVG and CSS. So less elements = faster rendering.
-
I don't see any chance at the moment. This would completely change the way how the designer works.
-
You as a designer can design how steps look like. For example you can enforce users to use the switch step instead hierarchical conditions (check this example).
For example you may limit depth of conditions.
Or maybe this executing logic may be placed inside a single step. This don't have be a graphical structure inside the canvas.
Another idea is to prepare a template with folders for main branches. This will guide users to continue with the proposed split.
Generally speaking it's very important how you design your steps and the initial template.
from sequential-workflow-designer.
Related Issues (20)
- How can I make the step a leaf step of the flow? HOT 4
- Convert JSON to Flow HOT 6
- Y-Scroll offset for step container HOT 2
- How to add new context menu item? HOT 2
- Expose walker publicly on Designer HOT 2
- Is there a way to highlight a step in the designer without actually selecting the step? HOT 2
- User defined conditionals? HOT 3
- public mutation events and pragmatically create actions HOT 1
- Customization of drop positions and styling HOT 5
- Property value of dynamically rendered component in designer isnt updating immediately HOT 5
- Can I change Ui template for task or switch HOT 5
- Start from a specific step HOT 2
- How to know is finished ? HOT 2
- Cannot use sequential-workflow-designer-react with React 17 and lower HOT 2
- Copy/Paste for steps HOT 2
- package 'sequential-workflow-designer' not found HOT 5
- Svelte Support for Sequential Workflow Designer HOT 3
- Scrolling issue in toolbox HOT 2
- Backspace key delete step HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from sequential-workflow-designer.