How to save my images in my front-end repository?

Issue

I need to save some images to use in my front-end repository. I was save the images always in svg or png format in my assets/images but I don't know if this is the right way to do it.

A friend told me to save like a txt format to make it lightweight, that's correct? I can save my images in png or svg format to production?

What is default?

Thank you and sorry for my English.

I always save my images like png or svg format but I don't know what is default or what make my images lightweight.

Solution

Your approach to saving images in SVG or PNG format for your front-end repository is quite common and generally a good practice.

SVG (Scalable Vector Graphics):

Best for: Icons, logos, and other graphics that need to scale well at different sizes.
Advantages: SVGs are vector-based, so they can be scaled without losing quality. They are often smaller in file size for simpler graphics and are excellent for high-resolution displays. Usage in Web Development: Ideal for graphics that need to stay sharp at various sizes, like icons in a responsive web design.

PNG (Portable Network Graphics):

Best for: Images that require transparency or have a lot of colors, like photographs.
Advantages: PNGs support transparency and don't lose quality with compression (lossless). They're great for detailed images and work well on the web. Usage in Web Development: Best for complex images where quality is a priority, and transparency is required.

• For scalability and simplicity: SVG is often preferred.
• For detailed images with or without transparency: PNG is a better choice.

In summary, you can confidently save your images in PNG or SVG format for production, choosing each based on the type of image and its use case. Both are standard, well-supported formats in web development.

Answered By - SasiDharan SD