Device Memory & Save Data Flag

[00:00:00]
>> Device memory. This is available on some browsers. Again, why is this important? Just for the context. You have more context. It will give us the number expressed in gibiytes, okay? And it's giving just 1, 2, 4, or 8. That's all. For example, my Mac has 64, but it's not going to give me 64 gigabytes of RAM.

[00:00:27]
It's navigator.deviceMemory. Pretty simple. So we go to navigator.deviceMemory, 8. Let me show you that that's false. It's 64. Anyway, the idea is to reduce fingerprinting. So whoever wrote that part of the spec, believe that having 8,16, 34, 64 from a web perspective is just the same. You don't need to know more details.

[00:00:59]
I didn't write the spec. Don't look at me like that. That's what the spec says. So as of today, it will give you up to 8. I mean, for WebGL or WebGPU apps, games, yeah, that might be important, but anyway. In this case, the idea is to actually know when you are in a low-end device, like an Android cheap phone.

[00:01:23]
And if that's the case, you wanna reduce as much as possible code execution client-side. Okay, make sense? That device, Save Data Flag. So I mentioned before, it's navigator.connection.saveData. And for example, an Android, on Chrome on Android, that's how it looks like. So you will enable that in settings.

[00:01:48]
And if you enable that then in JavaScript or through HTTP clients hints, you will get to your server the flag. It's up to you if you wanna do something or not about that. Okay, that's Save Data. So just a summary of this part of API's. We can use all the API's that I mentioned and there are more I'm just giving you like a quick rough idea.

[00:02:16]
To apply these reactive web performance techniques, okay, to serve better responsive images. So now, the current device has a device pixel ratio, that's the resolution of four. So it's four times the resolution of a classic standard display. Well, based on that, you may wanna provide an image that is four times by four times bigger.

[00:02:46]
So 16 times bigger, unless you realize that the memory is not good enough or the latency is not good enough. So it's not just about one data, it's the mix. The mix of information that will let you have better conclusions about this.