How to form a sprite correctly?

Question

css

I would like to learn best practices from serious game developers.
We have a browser game .
There is a little chaos in it now with sprites: they are gigantic and there are a lot of them.
I want the content to adapt to different resolutions (and hence the elements to increase). But the elements are "drawn" by sprites, so changing their size will not work so easily. Therefore, a separate sprite with enlarged elements is loaded for each resolution (not to be confused with retina).
How to do "right" in this situation?

Answer 1

Put all the sprites in a spritesheet, and then scale it to the right resolutions, and you don't have to load them all, just one spritesheet