DEV Community

Discussion on: 🎊 You don't need SVG! Creating animated loaders for content with Tailwind CSS

Collapse
 
koddr profile image
Vic Shóstak • Edited

Hi,

Yes, if you use inline SVG, it will be just as fast as my version.

But in this article I specifically mentioned a variant of SVG loaders, which I met in a huge number of projects on the Internet. Namely, a file like ./src/assets/images/loader.svg, which is not even on the CDN, and not optimized via SVGO... That's why such a provocative headline was born. :)

Compared to this approach, a bunch of Tailwind CSS + HTML will be much faster, since it's the markup and CSS have priority over loading, and only then everything else (as far as I remember the spec).

The main point I wanted to make is that you don't have to use SVG at all, if wonderful Tailwind provides all tools to implement loaders (of any complexity and appearance) through plain CSS. That's all.

EDIT: I'm not even talking about different solutions like this. Where they suggest installing additional dependencies in the project, for the sake of creating what Tailwind can do out of the box with just a few CSS classes. Or your inline SVG option.