Lighter Web UI through smaller image files, etc

Feature Requests Software
1

Hi, since there are well-known challenges with wi-fi connectivity and throughput, how about simple steps to lighten up the web UI?

For example, compressing the image files used in the web UI seems worthwhile. I compressed the standard image folder to test. The original set of images was 532k, but it was easy to get them down to 168k, with no noticeable quality loss. Roughly 1/3rd the file size!

You could also get the index.html down from 3.0 MB to roughly 2.6-2.8 MB just using an HTML minimizer.

I know that browsers cache images, so I tested before/after using web developer tools.

Before (original images) loading the images in the web UI took 18167 ms, or ~18 seconds.
After (compressed images) the images took 835 ms, or <1 second.

I tried to use identical A/B environment as best I could.
Regardless I think there’s lots of room for improvement in terms of making the web UI a lot lighter, which could improve users frustration when using the Web UI.

2

You had a 3:1 (at best) size advantage but a 18:1 loading advantage? Why?

3

Good question! I’m not a web front-end expert but I don’t think that there’s a 1:1 relationship between file size and loading time.
Regardless, my point is that given the Raspberry Pi is a relatively lightweight machine and the throughput of the web server is not great, here’s an easy change that could improve the overall web UI experience.

1 Like