I have made some "select and checkboxes - like mac and so on..." with custom images and styles with jquery, i want them not to be reloaded each time i do full postback.
Images are normally cached in the browser without much intervention. unless you are using dynamic names or something like that the browser will load them once then pull them from the cache on following requests.
Related
I've been trying to load an image onto an aspx page without revealing its request. I mean - when I monitor the page with Telerik's Fiddler I can see that the image is in the requests list. If I refresh the page, the request is not being shown anymore (apparently the image got cached the first time).
Question: Is it possible to load/cache the image silently, without the user even knowing it had been requested?
After a bunch of hours messing with various techniques involving requests, server side operations and what not, it turned out to be as simple as it can get..
In order to hide the image loading request I modified the previous page.
I have, for example, pages A and B. I need to cloak an image request for page B.
Page A loads a bunch of images already. Lets squeeze in one more? Image gets loaded and cached. When the user opens page B, image is still in cache and is used instead of requesting a new one. All we had to do was to put this
<img src="sampleImage.png" style="display:none" />
code in page A somewhere, so it got requested, loaded and cached, but not shown.Too simple solution to be more embarrased than proud to solve, but this is how I learn, I guess :D
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.
It's about making changes in design (css-files and images) on a website which is already online and in use. I wonder what is the best-practice to make sure that visitors see the changes without clearing there browser's cache manually. Things that came in my mind:
change meta-tag - dismissed because I do not want the site to be ALWAYS loaded from the server
include the css-file with a parameter (like timestamp) after made a change
change the names of included images so that they are reloaded - means also change names in the files where images are included
?
What else could achieve the loading from server? Did I forget some advantages/disadvantages?
Possible duplicate of this post: How to control web page caching, across all browsers?
My favoured solution is to set a random number after you call the file e.g.
css/styles.ccs?628454548
images/sprite.gif?8356484894
You could use javascript/php or whatever to set those random numbers every time the page is called to the browser.
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.
The task is relatively straightforward:
A Drupal website displays a list of articles with thumbnails. Some visitors would like to view it without images by clicking on a button/link and have that preference saved.
e.g. http://patterntap.com/collections/index/
The problem is all visitors are anonymous and given certain traffic, page cache is enabled.
My idea was to use some simple JavaScript to set a cookie, refresh the page and depending on the cookie values (or its presence/absence) display or hide the images.
Except Drupal serves cached pages quite early and the only quick way to modify the cached version that I could find is by hacking includes/bootstrap.inc and add a custom class to the body classes then hide the images with css.
A very wrong approach, I know. But I wonder if there is a way to save different versions of a page and serve the correct version?
Edit:
need to keep the same uri
the js to show/hide the images without reload and set the cookie is already in place
hook_boot() is not really called for cached pages, so can't do it via custom module
.htaccess mods?
Edit/solution:
In the end went with Rimian's suggestion. But it is possible to accomplish the task using our own cache.inc implementation as seen in the Mobile Tools module. Specifically, by extending cache.inc and updating settings.php to include
$conf['page_cache_fastpath'] = FALSE;
$conf['cache_inc'] = 'path/to/my/module/my_module_cache.inc';
So let me get this right. You wanna hide some images on a cached page if the user chooses to?
Why don't you write some jQuery or javascript and load that into your cached page with all the rest of the document?
Then, the client/browser would decide to run your script and hide images depending on some parameters you passed along with the request to that page or in the cookie? The script gets cached and only runs when you call it.
If you were hacking the bootstrap for something like that you'd really need to be rethinking what you were doing. Crazy! :)
Also take a look at cache_get and cache_set:
http://api.drupal.org/api/drupal/includes--cache.inc/6
I'm not sure I 100% understand what you are trying to do but here are my thoughts. One of your root problems is that you are trying to access what is essentially different content at the same uri.
If this is truly what you want to do, then Rimian's suggestion of checking out chache_get and chache_set may be worthwhile.
Personally, it seems cleaner to me to have your "with thumbnails" and "without thumbnails" be accessed via different uri's. Depending on exactly what you are wanting to accomplish, a GET variable my be an even better way to go. With either of these two options you would hide or show your thumbnails at the theme layer. Pages with different paths or get variables would get cached separately.
If you want the visitor to be able to switch views without a page reload, then jQuery and a cookie would probably suite your needs. This wouldn't require a page reload and switching back and forth would be quite simple.