Images in ASPX

[Guest]

Hi,

I have a picture gallery type application that loads up several photographs,
due to the file sizes of the images the page load is slow - Yes I know I need
to thumbnail and reduce image for display just havent got round to it.

Each photo has been displayed using HTML <IMG> Tag within a link. When the
photo is clicked, it opens a full size version in the browser within an
ASP.NET ImageButton control.

As the Photos render (pixel by pixel) if you click the photo to display the
full image, it still only displays the part of the photo that rendered before
the photo was clicked. This suggests that ASP must be caching the image
somehow.

So if only the top 1/3rd of the photo has rendered on the main page, click
the photo to call another page that displays the image larger size, on the
top 1/3rd is rendered in the large size. If you allow the image to render
completely on the main page then click the photo then it displays correctly.

Any suggestions?

Thanks Pete.

 

[Hans Kesting]

Hi,

I have a picture gallery type application that loads up several
photographs, due to the file sizes of the images the page load is
slow - Yes I know I need to thumbnail and reduce image for display
just havent got round to it.

Each photo has been displayed using HTML <IMG> Tag within a link.
When the photo is clicked, it opens a full size version in the
browser within an ASP.NET ImageButton control.

As the Photos render (pixel by pixel) if you click the photo to
display the full image, it still only displays the part of the photo
that rendered before the photo was clicked. This suggests that ASP
must be caching the image somehow.

It's not ASP that does the caching, it's the browser.

So if only the top 1/3rd of the photo has rendered on the main page,
click the photo to call another page that displays the image larger
size, on the top 1/3rd is rendered in the large size. If you allow
the image to render completely on the main page then click the photo
then it displays correctly.

Any suggestions?

If I understand correctly you display the full image with smaller height/width
to create a "thumbnail". If you then link to that same image with the
original size (or no size specified), then the browser "knows" it already has
that particular file so it will not reload it. It uses the cached version instead.

If you change the link to add a dummy parameter with some dummy value
then the browser thinks that you want a new file and reloads it.

thumbnail: <img src="myimage.gif" width=30 height=30>
full version: <img src="myimage.gif?size=full">

Hans Kesting

 

[Guest]

Hans,

Thanks for the reply - after posting I set out on trying to work out what
was going on and I had just figured that it was client side caching as if I
deleted the temp. Internet files the images (if left to render) rendered fine.

Thanks for the tip on changing the URL to force new version. I can see some
uses for this - as in opening the large verison of the image but if the main
page with the thumbnails is refreshed as the client has already cached the
partial image, then it just refreshes with the partial image.

Could I use
Response.Cache.SetCacheability(HttpCacheability.ServerAndNoCache); in the
page load so caching is still performed server side but no client side?

Thanks Pete.

 

[Kevin Spencer]

Try pre-loading the image, using JavaScript.

--
HTH,

Kevin Spencer
Microsoft MVP
..Net Developer
Neither a follower nor a lender be.

 

[Steven Cheng[MSFT]]

Hi, Pete,

AS for the images rendered via the <img> tag, they're part of your main
page and is actually requested at the clientside by the browser (not output
by your page). Also, since the static content such as image or script files
, css styles files are all directly served by IIS server( rather than
asp.net service) , the cache control set in your page's code won't take
effect on the images.

However, since you're building a image gallery, I think you can take
advantage of the .net's GDI+ feature to manually generate the image file's
thumbnail and use the asp.net's Application Cache to cache them. All of
this can be encapsulated in a HTTPHander. Here is a msdn tech article
dicussing on this:

#Using ASP.NET HTTP Handlers to create a photo album
http://www.microsoft.com/belux/nl/msdn/community/columns/desmet/httphandler.
mspx

Hope helps.

Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)