I am trying to use different background images from session to session. So if users open my website in a different session(e.g. Close and reopen the browser or wait for half an hour), they will see a different background image.
Following is what I am currently doing.
I created a HttpHandler class that handles background.axd.
First it checks whether there is an entry called BackgroundIndex in the HttpContext.Current.Session, if not, it randomly chooses a image from the ones that I have, than stores its index into the Session object.
Then it compares the index with the value of the If-None-Match header, if they match, simply return a response with 304 Not Modified.
If not match, or there isn't a 'If-None-Match' header in the request, it writes the content of the image file to the response and return it with ETag header set to the index of the image.
At last, I set the background image of my website to background.axd in my CSS file.
The problem is, it works correctly, but not efficiently.
The image file for current session can be loaded from cache. But if the session changes, the browser will have to download the image from my server even if it has been downloaded before.
Also, the browser has to make additional request to check if the image in cache has been out of date.
Is there a better solution for this?
Sorry for my bad English.
Related
I have a JSON resource, let's call it /game/1, which is being publicly cached with a long duration. Based on some client-side logic, I want to occasionally want to refresh this resource (for instance, when I know something should be happening server-side - a game ending, in my case).
Once refreshed, I would like all downstream caches to update with the new content, so any requests to /game/1 will fetch the refreshed content. Appending a querystring with a random parameter won't work in this case.
I have tried adding the following headers on the request, which seems to work in a temperamental fashion in browsers other than IE:
headers['Cache-Control'] = 'max-age=0, no-cache';
headers['Pragma'] = 'no-cache';
Using these headers, Chrome seems to sometimes refresh the content, presumably based on some internal heuristics.
Does anyone have any better ideeas for what I'm trying to achieve?
Try setting meta http-equiv="expires" content to zero.
Setting the 'expires' metatag to zero should force the browser to reload everything on each page visit. Forcing constant cache deletion will obviously slow down page loading (if all browsers obey it!) but maybe that's an acceptable trade-off. This won't help with downstream caches however, so it's far from a complete solution.
I am building a portfolio page, which contains quite anumber of images. I am pulling the image url's from a database, and creating thumbnails from the original source, and the dispaying the thumbnails. When clicked on, displaying the original full size pic.
Loading times are obviuosly affected and the site take some time before displaying anything...
I have tried putting all this in Ajax, but it seems ajax is only reqally effective if the site has initially loaded. As it is now, the site "hangs" while it waits for the on form laod work to be done.
Any ideas on putting a "please wait while iamges laod" section into the container where the iamges will eb displayed?
Thanks in advance.
Typically you create an HTTP handler that your page sends the image IDs to, something like
<img src="image-handler.ashx?id=SOME_ID" alt="..." />
The key to performance here is that you can then cache the images from this handler. You can save the generated thumbnails to disk and check for existence, and if then use something like Response.TransferFile() to send the file (or actually create the thumbnail files on creation of images, not loading them), or even better, apply output caching on the handler, with vary by param to the id key.
For the full images also you can use the same techniques. You can also in addition have some hidden images you keep setting their URLs by AJAX before clicking thumbnails, so, they are ready when a thumbnail is clicked and a full image needs to be displayed.
Those are just high level thoughts as per the amount of detail I get from the question.
I need to load almost 100's of images in a single page on my website. ( product image, lots of them ). Whenever image change for product, url for that image also changes. i.e. for one url corresponding iamge never changes. Now I want to make sure that for a same person browsing through website, the image must not load again.
Is expire header is good enough ? ( sometime the browser still try to load it when refreshed manually )
on server side my python script always return 304 when if modified since header available without checking its value as each image has unique url. It normally works good but sometime when images are partially loaded and user move to another page, user see half downloaded images next time he land on the same page as server return 304. so how reliable if modified since header is ? and what are other alternative ?
Thanks.
edit 2:
what should be the content length for 304 response ? should it be the original content or actual content ( i.e. 0 ) ??
When you reload manually, most browsers disregard the caching headers, so this is normal and expected behavior.
The Expire header should be sufficient for this purpose.
As for the partial load, it can happen that the TCP connection gets broken while the image is loading; if you didn't specify Content-Length when sending the image, some browsers may assume that the connection was closed because all the data were sent. If Content-Length (a.k.a. image size in bytes) is specified, the browser should note when it doesn't have the complete image and will re-download it unconditionally the next time.
When sending the 304 Not Modified, it's not necessary to send Content-Length.
I'm setting a cookie during http GET request of the .html pages with embedded images. I'm expecting the browser to return the cookies when getting all the embedded images, but apparently it does not happen for the first embedded image.
Is this how it's supposed to work or am I missing something ?
Make sure the domain name matches your domain and that you've set a valid expiration date/time for it. These are the 2 most common mistakes.
It would help if we knew how you were setting the cookies. Note that NRNR's response is a bit misleading - he/she's right about the domain, but there's no requirement to set an expiration. However you will get varying results unless you explicitly set a path too - even if it's just '/'.
Browsers do vary a lot in how they handle all sorts of things, including cookies - so I wouldn't be too surprised if there are browsers out there which start retrieving additional content before the response headers for the referencing html page are processed. This is not how its supposed to work though.
C.
I asked a question on what is style.css?ver=1 tag?. I learned that developers use style.css?ver=1 to let browsers read updated css, but W.Craig Trader pointed out that is is not good.
My question is, what is the best way to force a browser to read updated css without style.css?Ver=1 format?
Your server should take care of it. It will tell the browser when the file was last modified, and if the browser's cache is out of date, it will download the new version.
More in depth, each time the page loads, the browser does a head request on each item in the page (stylesheets, images..), which the webserver responds to by only sending the HTTP headers without the body, there is a header that specifies when the file was last modified (and possibly more about cache control), and if the browser's cache has a version of the file older than what the webserver says it has, it reloads that content.
An option is to version the filename, like style-1.1.css.