Comments (9)
@Coldwine – wanna join?
from quickmockup.
@jdittrich as I was saying in the other issue it can be considered to use Flux / Redux instead of MVC with React or Vue.js for example
from quickmockup.
NOTES:
- Some processes, like deleting, duplication and in general, manipulating elements are likely to be easier using a MVC or React-alike.
- We use deeply nested data structures that are mirrored in the resulting HTML code. In many application I know mainly flat data and view structures are used. That is no hindrance, but should be considered
- Saving: One could use HTML just like an XML data format that in addition of saving data can be displayed too. It overloads it's use a bit, but I think that the show-and-send format and the save-data-for-editing should remain the same.
from quickmockup.
So one of my major issues with quickMockup (I did some wireframing this morning and have some thoughts, but sadly I forgot my notes so I can't remember them all :P) is that it can be pretty slow and unresponsive. This would probably be fixed by having a more robust DOM manipulator, but I'm not sure whether something like React or Angular, with their large load factors, would be useful.
I would recommend MithrilJS as it's tiny (https://lhorie.github.io/mithril/), but it's a bit more opaque for onboarding new users.
What I like about the current setup is that I can edit the existing document's HTML, add something via HTML, and it will add that to the manipulation. Maybe that's something worth losing though for the better functionality on data storing etc.
from quickmockup.
Thanks for your feedback!
it can be pretty slow and unresponsive.
Interesting, I never head this issues, but I might use it differently. Can you share the files this happens with? Also, is it slow loading or is it slow when interacting?
load factors
While I find it good if the page stays small, I suppose that loading 30kb more would not be too bad for a productivity application (if it has a useful outcome)
I would recommend MithrilJS...
I'm currently looking into vue.js. The problem is that the application is quite dependend on drag and drop and most libraries excel at input fields, lists etc. This might even be a reasons for using react, since it has lot's of components and binding libraries in it's ecosystem.
from quickmockup.
@jdittrich agree. React has a lot of already built component that can help building a responsive drag and drop application. I really like the component and moduling system of React, while I don't really like Vue.js when it comes to write logic inside the markup.
from quickmockup.
slowness
This happens in Firefox 45.0.1, it lags while interacting. Loading isn't a problem. I suspect it's the number of DOM elements floating around? Here's the file: https://oasis.sandstorm.io/shared/CN6zht3UrfTqZBWlM0THn_0nVAwHxutqG4bI4cLHmq9
If you're fine with a larger library for loading, I have no issue with either React or Vue or whatever :)
@steoo do you know of some drag and drop existing React libraries that we could have a look at?
from quickmockup.
slowness
hmm, works really fine for me, even on an old computer (FF45.0). Only the "clearrect" element does not display correctly, but the dragging is smooth.
from quickmockup.
Usually the dragging works fine - it's the toggling between elements that creates an issue, but I'll try to pay more attention to it, and track it if I pick it up again. I'll also create a new issue for it then, to stop derailing this one :). Clearrect was me experimenting with adding my own rectangles after the fact, so it's probably missing the styles? (also an aside and not really relevant).
from quickmockup.
Related Issues (20)
- official Docker image HOT 2
- Experiment with draw2D HOT 5
- v2: Add strokes to elements HOT 1
- v2: Add slight outline on elements that currently dragged elements would be grouped with HOT 5
- v2: extend inplace label editing with save/cancel buttons
- v2: Constraints/principle we should consider when creating functionality HOT 2
- v2: Duplicate elements easily via ctrl+D HOT 1
- v2: Have in-place toolbar HOT 1
- v2: Duplicated elements should be grouped with the container of the original elements parent
- Additional Widgets suggestion: charts HOT 1
- v2 visual representations of element in item collection bar. HOT 2
- v2 increase front size in on-canvas elements to 14px
- v2 keep element-cursor offset consistent when drop-adding elements to canvas HOT 1
- v2: Ease grouping elements HOT 4
- v2 code quality: Event initialization is messy, needs lots of files to be touched
- v2: represent element as soon as drag enters canvas HOT 3
- Cloning Window element is broken HOT 2
- Moving multiple selections into Container
- Elements being newly added are not grouped HOT 1
- Support images HOT 2
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 quickmockup.