Comments (3)
I previously thought that using canvas api would better the performance of the canvas. Turns out that it is not true. Adjusting scale
, transform
with canvas api actually harms performance than actually calculating the position and rendering it. https://stackoverflow.com/questions/41060789/html5-canvas-transform-vs-manual-offsets Seems like we need to stick to the current version of calculating the positions and then rendering it on the canvas!
from dotting.
Plus I also found a meaningful MDN article from mozilla on optimizing canvas. TLDR; It says that you should use multiple canvas if you are going to separate logic. Also you should consider using adequate canvas apis such as clearing the canvas with clearRect() instead of fillRect().
I also found a Firefox article that goes into more depth on how to optimize your canvas. It says that you should use webgl instead of contex2d since webgl allows you to use GPU.
from dotting.
Closing this issue because the PR related to the issue has been merged
from dotting.
Related Issues (20)
- Expose `mouseDown` `mouseUp` `mouseMove` for users to manipulate
- Create an importable utilities file for separating internal functions and external functions
- Create a base template for `donwloadFile`
- Allow pan zoom to be adjusted to fit the grid canvas inside the canvas
- Optimize panning and zooming HOT 1
- Optimize performance for onmouseup after grid is changed
- Reduce dependency reliance for layers regarding data information
- Allow extension to continue when user extends beyond the bounds of the editor
- Allow painting with alpha value (transparency)
- Proposal: minimum grid scale parameter HOT 3
- Bug: selection not working with layers
- Feature request: allow assigning a different color to the right mouse button HOT 3
- Feature request: improve resizer
- Bug: addDataChangeListener constantly firing HOT 3
- Feature Request: allow dragging with middle mouse button / add drag tool
- Feature request: add additional tools, e.g. line drawing tools HOT 2
- Feature: Implement features for layer previews HOT 1
- Bug: resizing not working smoothly HOT 3
- Paint bucket currently only works if you drag the mouse after clicking
- useBrush to paint icons (SVG/PNG) to grid HOT 3
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 dotting.