3 ms·

We ran into this issue while building our HTML5/Mobile Webkit panorama viewer. It took a long time to figure out what was going on, I almost feel that webkit wo

We ran into this issue while building our HTML5/Mobile Webkit panorama viewer. It took a long time to figure out what was going on, I almost feel that webkit would've been better to just skip the image and log an error to the console, since by resizing your image without your permission typically causes rendering bugs since they literally resize your image down in-line without telling you. We didn't realize it could be circumvented with PNG's, that's an interesting idea, though it certainly hurts on the bandwidth side.

rorrr 15y ago
You could just slice it into multiple JPGs. It's probably even better for parallel download.
- gokhan 15y ago
  Better? Wrong. Please read "Minimize HTTP Requests" here: http://developer.yahoo.com/performance/rules.html http://developer.yahoo.com/performance/rules.html
  - wisty 15y ago
    If you use domain sharding you can get more parellel downloads on older browsers which reduces the problems some due to more requests (parellel request limit on old browsers and unneeded cookies for static resources, but theres still overhead), but that's a separate issue. It's best to avoid the problem altogether by minimizing HTTP Requests (as you suggest).
  - huxley 15y ago
    That's a great rule for general purposes, but it's intended for situations where you have lots of small assets that you are asking the client to download. In this instance we're talking about 2 megapixel images, so the extra HTTP requests are not even going to register in the mix. With modern browsers pulling down 6+ parallel downloads, breaking the image up might make plenty of sense.
  - rorrr 15y ago
    It's not wrong. If you have only a few slices, they will load in parallel in most browsers.
- apinstein 15y ago
  Well we already slice our images, and even those slices are too big. We were annoyed to have to maintain another set of files just for the iPad. So we just use a smaller (and blurrier when scaled up) image at the moment. I was hoping they would just open it up :)
artursapek 15y ago
Try switching your PNG's from RGB to Indexed color - depending on what the image is it can dramatically lower the file size.
- apinstein 15y ago
  Photos don't do so well in 8-bit color.
brudgers 15y ago
>"it certainly hurts on the bandwidth side." I expect the iPad3's high resolution to cause a lot websites pain on the bandwidth side. When it comes to the web, people aren't as picky with their high resolution desktop displays as they are likely to be with their iPads.

rorrr 15y ago

You could just slice it into multiple JPGs. It's probably even better for parallel download.

gokhan 15y ago
Better? Wrong. Please read "Minimize HTTP Requests" here: http://developer.yahoo.com/performance/rules.html http://developer.yahoo.com/performance/rules.html
- wisty 15y ago
  If you use domain sharding you can get more parellel downloads on older browsers which reduces the problems some due to more requests (parellel request limit on old browsers and unneeded cookies for static resources, but theres still overhead), but that's a separate issue. It's best to avoid the problem altogether by minimizing HTTP Requests (as you suggest).
- huxley 15y ago
  That's a great rule for general purposes, but it's intended for situations where you have lots of small assets that you are asking the client to download. In this instance we're talking about 2 megapixel images, so the extra HTTP requests are not even going to register in the mix. With modern browsers pulling down 6+ parallel downloads, breaking the image up might make plenty of sense.
- rorrr 15y ago
  It's not wrong. If you have only a few slices, they will load in parallel in most browsers.
apinstein 15y ago
Well we already slice our images, and even those slices are too big. We were annoyed to have to maintain another set of files just for the iPad. So we just use a smaller (and blurrier when scaled up) image at the moment. I was hoping they would just open it up :)

artursapek 15y ago

Try switching your PNG's from RGB to Indexed color - depending on what the image is it can dramatically lower the file size.

apinstein 15y ago
Photos don't do so well in 8-bit color.

brudgers 15y ago

>"it certainly hurts on the bandwidth side." I expect the iPad3's high resolution to cause a lot websites pain on the bandwidth side. When it comes to the web, people aren't as picky with their high resolution desktop displays as they are likely to be with their iPads.