anitab-org / anitab-org/anitab-org.github.io

Optimize Images

Đang mở
#198 22 bình luận 2 reaction 1 người được giao Được @aditi5050 nhận Xem trên GitHub
Category: User Interface
Ngôn ngữ chính
JavaScript
Star
155
Fork
190
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Mô tả

### Describe the bug
Large sized images slow down the web pages which creates a less than optimal user experience.
We can reduce the image’s file sizes to help improve our website’s performance.

### To Reproduce
Steps to reproduce the behavior:
1. Go to https://anitab-org.github.io/
2. Right Click -> Inspect Element -> Go to Network Tab
3. Check out the file sizes and loading time

### Expected behavior
We can reduce the image sizes without compromising the image quality.

### Screenshots
Here's an example
![anitab_issue](https://user-images.githubusercontent.com/54268438/105041392-f35de080-5a88-11eb-9cf7-5670219b2b9b.JPG)

Also, the about image is of 1.1 MB which is very large and takes very long to load in a poor internet connection and needs to be optimized.
image-about

### Desktop (please complete the following information):
- OS: Windows 10
- Browser : Chrome
- Version : 87.0.4280.141 (Official Build) (64-bit)

### Additional context
I tried optimizing a image from the website and the size reduced significantly with no reduction in quality.
Before Optimization : Size -> 470.8 KB
![landing 1c27c683](https://user-images.githubusercontent.com/54268438/105042349-2359b380-5a8a-11eb-85ee-1a68d8bb4a50.png)

After Optimization : Size -> 66.2 KB
![landing 1c27c683 (1)](https://user-images.githubusercontent.com/54268438/105042381-2eacdf00-5a8a-11eb-9c5f-7722dc64c72a.png)

![after-compression](https://user-images.githubusercontent.com/54268438/105042458-48e6bd00-5a8a-11eb-9deb-385d1634c457.JPG)

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.