New Javascript (AnimeJS) spinners for website (examples & source code)

Hello everyone

My name is Devang Saklani and I am a freelance Front-end Web developer from INDIA. I like creating things like websites, animations and writing blogs (however this is my first blog let's see how it goes😅).

I have been learning JS from few months and in first sight i loved it it's syntax, power and it's uses. Then I got into touch with JS libraries for extra functionality like ReactJS and then I came across AnimeJS. I was amazed at first by it's syntax and it's power, it's a amazing animation library through which you can do simple as well as super complex animations.

Don't know Anime JS? here's a quick intro!

What is AnimeJS?

• Anime.js is a small, lightweight JavaScript library with a simple and small powerful API.
• It works with the DOM element, CSS, and JavaScript object.
• and the final thing is It's really Underrated.

How to use AnimeJS?

• First of all Install it. The installation steps are quite simple as we can use either a CDN network to use it or can directly install it through NPM. See official installation details here.

Basic usage:

• I would recommend you to go to the official documentation for instructions because it is Super simple and Super interactive.

Now what I made using it:

I have made Some loading spinners using AnimeJS. These are some images/gifs:

This one is a really viral animation called B&W loading animation 9 by Lilian Tedone:⏬

Check out these animations live at this website.

Features (highlights):

• Easy to use (simply copy & paste).
• Source code is already minified.
• Awesome animations.
• 2 themes till now (stroked and filled) and a theme switch button.
• A automation theme save feature which saves your theme even after page reload.
• A Slider for better UX and keyboard compatible (use arrow keys to navigate).

Known issues

I know these animations are sick but this seriously needs some improvement and optimizations.. That's why I need your help in solving these bugs* and make some performance improvements.

Known bugs:

• Sometimes the code source viewer does'nt shows anything.
• The CPU also gets 100% used when using a old computer and causing frame drops 😥.
• and Many other small bugs that haven't discovered yet.

This is the Github URL of this repo. You can help me by contributing here also If you want to contact me this is my email (devangsaklani@gmail.com) I'll surely reply you.

Thanks for reading and I would love to read your thoughts on this in comment section😁.