November 2016
Intermediate to advanced
354 pages
8h 39m
English
book
High Performance Images
by Colin Bendell, Tim Kadlec, Yoav Weiss, Guy Podjarny, Nick Doyle, Mike McCall
Content preview from High Performance Images
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.
Chapter 12. Client Hints
Responsive images solve the problem of art direction, variable widths (including DPR changes), and alternate formats. While they provide a lot of flexibility, following all the best practices can result in very large amount of boilerplate HTML. (See “2014 Responsive Images HTML Spec” to see how this plays out in practice.) This approach is prone to error and exposes details on how you generate your images that can be exploited by bots.
Additionally, responsive images don’t help to address websites where we can’t control the HTML (such as many CMS platforms) or help with native applications that request images over HTTP but don’t use HTML for the UI.
Client Hints takes responsive images to the next level using content negotiation. This helps separate the delivery from the presentation. Client Hints is a standard that utilizes HTTP to negotiate between the browser and the server—just as we do for Gzip compression. With Gzip compression, the client tells the server that it is smart enough to decompress content (Accept-Encoding: gzip) and the server responds, with compressed content (Content-Encoding: Gzip). For example, the server could decide to compress CSS, but not Gzip WOFF (because WOFF is already Gzipped internally). It’s a nod and a wink between the browser and server to get bits across the network faster. The web developer and end user don’t have to worry about these details; they just know it results in a better user experience.
For ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access
More than 5,000 organizations count on O’Reilly
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.Julian F.
I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.Addison B.
I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.Amir M.
I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.