One of the ways to do this might be to change the "depth" of the images.
Depth............................bit
(2) colors....................is (1) bit
(16) colors..................is (4) bit
(256) colors................is (8) bit
(32k) colors................is (15) bit
(64k) colors................is (16) bit
(16 Million) colors.......is (24) bit
If you know how to resize images in your JavaScript, then another way might be to make your images resized to the size that you want to be seen; starting with smaller images which when resized larger do not lose too much of the clarity that you want. Thus potentially less transmission to be lagged.
Example: If you want a 300 x 300 image to be seen, then make a smaller image, maybe 250 x 250 and resize it to 300 x 300 with your JavaScript and see how it looks. If it looks nice then try smaller like maybe 225 x 225 and resize that and see how it looks. Depending on your level of understanding JavaScript, you might get this to work. It could take a lot of time for this if each image is sufficiently different and if you want to make each image resize larger and keep sufficient clarity for that particular image.
You mentioned "lags." Many supposed experts have said that you should load all of your images first then show them, and other stuff like that. If your user has to wait on transmission lag, then you might be dealing with other than your image size. A user that has to wait and wait and wait while some silly JavaScript thing is circling around and around might get tired of waiting. The user might be better served by showing all of the text of the web page, and the forms, etc., while putting empty boxes where the images are to (when transmitted) be placed. It might not look so fancy for the user, but they might be less likely to get irritated with "you" and "your" website. They might accept that the "transmission" that they are using could be the difficulty and thus have less negativity toward your web page.
As a direct example:
I have a very fast internet connection. If a page takes more than about 10 to 15 seconds to load sufficiently for me to interact with it, then I might close the page. That is right. I hit the "X" and close that page. If it happens more than a few times and I remember that site, occasionally I have put such a web site in my page file and block the site completely. If JavaScript takes too long to load, and it does that multiple times, I might put that web site in my page file also. If the web site owner does not fix the problem on their end, then they might not get to show their entire site to me. I do not tolerate idiots and flippancy often. As an aside, I go to lots of sites and on them I see "Unable to connect" boxes. Ok, they had their chance. Try not to irritate your customers (if you are in business). Make your page show up quickly, then if you want images put a placeholder for them and your customer might be tolerant and wait for them.
Links to JavaScript resizing:
Reducing the upload sie by resizing image on the client side with JQuery [
https://dejanstojanovic.net/javascri...-with-jquery/]
Resize in general with JavaScript [
https://zocada.com/compress-resize-i...ript-browser/]
Here is another one [
https://gist.github.com/MikeRogers0/6264546]
Far more there than I feel like typing this time. If you do not understand them, then I suggest reading each page completely with all comments and not just scanning the page and grabbing the code as some might do.
In commercial use, it might be far more important that the negative response by the user is diminished, rather than making it easier for you producing the effect.
.
1
