Particles.js loading problem

Hi everyone,

I want to use particles.js in my hype Project.
It is loading and showing up on Desktop with HTML Widget, but is not visible in mobile browsers.

There are also big perfomance drops when it is visible in the Hype App viewport.

This is my code to load it:

<div id="particles-js"></div> <script src="${resourcesFolderName}/particles.min.js"></script><script src="${resourcesFolderName}/app-p.js"></script>

Maybe theres a better way to implement this?

I am thankful for every answer.

best,
Max

There are quite a few open issues on the Git repo for particle.js. And some of those point to “slowness” or performance issues. Also, the repo itself hasn’t been touched for a couple of years so I would expect to see perf issues on newer browser versions. I, personally, wouldn’t use it because of that.

That being said, you have mentioned you’ve got it loading so I don’t see setup being an issue. I would gather it’s something to do with the latest mobile browsers not liking the library.

If you tell us more on why you want to use this library there may be something else that can be done.

1 Like

Thank you for your great answer.

I want to use it to enhance the visual presentation of the “App” I am making.
I have tested the library on codepen with my iphone/ipad ect. so no browser problems should be there.

It may be useful to attach a zip of the .hype document along with any details on what specifically is slow or not showing up.

1 Like

or share the codepen so we can grab the code to test. Also, the library should probably work fine it’s just the combination of the library + hype that could be the issue. Hence why we need to see something as we can’t speculate with fine detail on what could be going wrong. :wink:

1 Like

I looked at particles.js for some of my game projects in Hype. Performance was a problem. Also, it was a bit overkill for my projects. So instead, I wrote my own particle system. You can see examples here...

With just some JavaScript and SVG, a lot can be done.