5 reasons to use tsParticles and not Particles.js

Hello,

I'm the author of tsParticles (obviously, why anyone would spend time about my little project?) and I'll show you some reasons to replace particles.js with the new tsParticles.

1. tsParticles are fully compatible with the particles.js configuration.

   Seriously, you just need to change the script source et-voilà you're ready.

   Cool, isn't it?

   If you are too lazy to Google it (*Who isn't) you can replace the actual particles.js script with this
   

   <script src="https://cdn.jsdelivr.net/npm/tsparticles@1.9.2/dist/tsparticles.min.js" integrity="sha256-5kED68Spy7K2CEbfu4CjV92DmZR5ZQFUoIR5qmPzZWg=" crossorigin="anonymous"></script>
   

   Remember to checkout jsDeliver for latest version

   

   If you have installed with npm or yarn you can install it from there too
   

   npm install tsparticles
   

   

   or
   

   yarn add tsparticles
   

2. tsParticles have a frame per second (fps) limiter, so they don't let the client CPU 🔥 suffer more than necessary.

   By default it's limited at 60fps (I thought it was enough). How do you setup it? fpsLimit: 60 in the config/json root (like retina_detect) and boom! 💥 You're done!

3. tsParticles have a lot of new features.

   A lot? YES!
   If you don't believe me checkout these

   Well 7 codepens are not a lot, but you can see more than 6 features here:

   1. Masking background with unveiling particles (WOW!)
   2. A line particle (Who cares about lines?)
   3. Use a SVG path (for now single) to draw particles (inline, inside or outside) (OK it's cool but where I use it?)
   4. Rotating particles (Imagine a rotating line, like an helicopter)
   5. Multiple images (You can use all the images you want as a particle, Remember to not use big ones!)
   6. Random particles color (Stop using big arrays for having a lot of colors, Embrace the CHAOS)
   7. Mouse hover particles connection (So you can distract your users for hours)
   8. Characters and text particles (You can write the Odyssey and use it as a particle... Ehm... Please don't do that)
   9. You can use FontAwesome icons as particles (That's awesome! Yes, like the font)

4. tsParticles development is active. The other project was abandoned about 5 years ago. You can request new features or report issues and you'll get it done. Well, if it's a reasonably request, I won't make an OS out of particles.

5. If you're not convinced yet, well, give it a try.
   
   Replacing a url is not an expensive task and you can revert easily.

Comments

[anon987654321]

I can't wait for this project to gain more traction. You have my full support!

[ChiaraLyn]

Hi Matteo! Can I link your articles into mine (it was that one about Particle.js...) to advice others to switch to your wonderful tsParticle? Can i have your permission to cite you in my article?

[Matteo Bruni]

Yes, sure. Feel free to link to every article you need.

[GOSHROW]

I came across this in a GitHub Issue as well. And with its second mention, I am sold. Just replaced the CDN address and it works fine. Looking forward to experiment more on this.

[lorenzofay]

This project is great!
Is there any way to change lineLinked -> opacity as an hover effect?
I have seen this effect but i can't achieve it without the modes connect or grab.

[Matteo Bruni]

Thank you very much!
Actually, that feature is not possible, you can open an issue on GH so it can be scheduled in a future release