Not at home with photoshop but here is a re-sized (500px x 335px) image I made with a random webapp that comes in at 22KB.
https://drive.google.com/file/d/1rbvRSDD7xErzxMSwj__fKFIjNYa...
If anyone is wondering why I took the 3 minutes to do this, think of the energy savings at scale.
Also, super cool looking device!
I suppose the real problem is that it's too difficult to provide appropriately-sized images for different user agents.
I use a <picture> element with multiple versions as a <source>. This allows the browser to choose which size and format is best automatically. Many site generators will set these up automatically, with the right plugin. See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/pi...
Compare: https://imgur.com/a/axLxDBT
Photoshop's "fair" JPEG settings result in something that's functionally indistinguishable and only 347KB.
I was just thinking it would be nice to have a bot/api/webapp that I could give my URL to and it would give me a set of links to at least a bit optimized images. Maybe something built into all IDEs, or is this a platform responsibility.
For example, the OP images were much larger in pixel size than necessary. When I look at them in their full size, it is also a noisy image. Certainly a 1/2 resize could be reasonable while not losing meaningful pixels. I know this is a game of trade-offs, but it would be nice to have a standard that had very low friction. I guess TinyPNG almost does this.
Now I am convinced JPEG XL is definitely the choice for me as next gen image codec.
By the way, the Download link usually works right away in these cases with google drive. The spinner is just the image preview loading. Although I've only previously seen this behavior while processing a video preview.