recently I decided to create a Tumblr using this theme
I'm a Firefox user, and I noticed that this theme slows down the browser a lot. After some investingation and asking, the culprit seems to be the possibility to add an animated particle background that, even when disable, causes high cpu usage. This particle function is inside a script called "s.js", that contains other part of the theme.
Is there any way to clean up the code from everything related to this particle background, and still leave the theme functional?
Thanks
OK
Option 1:
Search for all of the libraries that are being called from the js file you linked to s.js apart from ParticleJS.
Images Loaded: https://unpkg.com/[email protected]/imagesloaded.pkgd.min.js
Isotope: https://unpkg.com/[email protected]/dist/isotope.pkgd.min.js
Infinite Scroll: https://unpkg.com/[email protected]/dist/infinite-scroll.pkgd.min.js
Fitvid: https://cdnjs.cloudflare.com/ajax/libs/fitvids/1.2.0/jquery.fitvids.min.js
Photoset grid: https://cdnjs.cloudflare.com/ajax/libs/photoset-grid/1.0.1/jquery.photoset-grid.min.js
Magnific Popup: https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js
Caveat, these are specific versions of each file and you could run into compatibility issues, if you need to link to a specific version.
Combine all the code from these files into a single file, then you could run it through a minifier: https://javascript-minifier.com/
For this solution to work you also need somewhere to host the file somewhere.
Option 2:
Link to all of the above files individually in your template. For example before the closing
<body>
tag you would need to add<script type="text/javascript" src="https://unpkg.com/[email protected]/imagesloaded.pkgd.min.js"></script>
... then add each of the other scripts. There may be a dependency order to these also, hopefully they are the same as in the header of the s.js file.
The drawback with this is instead of making a single http request to return a single js file, the template will request 6 separate js files (so this might be slower than the current system you have now).
Option 3:
If you can't host the file somewhere, you would have to actually copy the code from each js file into your template.