Comments (10)
The initial framework for spatial grid mapping has been laid out and implemented in particle overlapping. See: #222
Further integration with this system will prove to have more performance improvements.
The next step ideally will be integration with the Interaction manager which definitely has its own design hurdles. All three behaviors contained in the Interaction manager have independent distance checking, meaning that an implementation either needs to do checks independently for all three or one that runs at the furthest of the three distances.
from tsparticles.
I've managed to hotwire the linker function to utilize the spatial neighbor checking. It's still very early stages but comparing numbers it looks like I've managed to bring down frame compute time from 22ms to `16ms.
from tsparticles.
I checked some particles system with spatial hashing and I've seen some bad performance there too. This require more study.
from tsparticles.
This codepen https://codepen.io/matteobruni/pen/bGdyrmK seems to work fine. This can be a starting point
from tsparticles.
Porting the code to typescript. Might need some assistance in its use once it's ready.
from tsparticles.
So from the looks of the class itself, everything seems to be ok. I'm not exactly sure where this implementation will fit compared to the rest of the code. Implementation into the Particle class would be huge and unreasonable due to the huge reliance on the Particle Array.
Hence I would suggest a partial implementation. I'm investigating using it purely for just the collision detection of particles.
This is what I've achieved so far.
The class
from tsparticles.
Hi @TylerBurnett, thanks but the two classes I referenced here were already ported, and then deleted.
The main issue is how to use them, there's a lot of configurations that can have different distances and create a map for every distance doesn't seem the right solution.
Probably I'm doing something wrong but I'm focused on other activities that I would release first, like the Vuejs component (https://github.com/matteobruni/particles.vue) and I didn't spent some good time on the map.
If you have some ideas we can discuss them.
from tsparticles.
No worries, there wasn't any closure on the ticket so I assumed it was ongoing. To be fair I'm not making much head way either. It seems both methods create huge arrays for the purpose of this. Which isn't productive. I'll leave it for the moment.
from tsparticles.
@matteobruni, I reworked it.
Generic method
AVG = 0.012741932990931
Spatial Grid - 20 cell size
AVG = 0.0052941151593319
Optimizing it at the moment to further the improvements. I believe at higher densities there should be larger improvements. This was only tested on particle collision.
from tsparticles.
Good job! About half the time, it's awesome!
from tsparticles.
Related Issues (20)
- Help me, display the particles in only one area and wherever the hover goes, it will follow. HOT 3
- [Bug]: Class extends value undefined is not a constructor or null HOT 1
- [Bug]: `Range` class from this library overwrites browser's native `Range` class
- [Bug]: change the background to a picture but it doesn't work HOT 1
- Can't remove position fixed from tsparticles-slim on next.js HOT 1
- Absorber Split on Click or Size limit reached HOT 1
- Canvas position is stuck on fixed HOT 1
- [Bug]: 'z-index' is not work HOT 1
- [Bug]: Everything is fine in localhost but after deployment on netlify, initial page is loading is too slow HOT 2
- [Bug]: The package particles.js can't be installed with tsparticles, since it can lead to unexpected behaviors, please uninstall particles.js and remove it from the package.json file. HOT 1
- [Bug]: autoprefixer Gradient outdated syntax Warning ( Tailwind ) HOT 3
- Feature Request
- [Bug]: Confetti flat option is not passed to new calls HOT 2
- Issue : Need an appropriate loader to handle file type HOT 1
- [Bug]: HOT 6
- [Bug]: Responsive object not working in options object for ReactJS HOT 2
- Feature Request : Return particles to original position after repulse on hover
- [Bug]: Page unresponsive when attempting zIndex grouping
- Feature Request: Deterministic rendering independent of system clock HOT 1
- Particle JS above text in div 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 tsparticles.