Expire updated CSS and JS files - asp.net-mvc

We have a site (MVC4 on Azure) on which we change our JS an CSS files occasionally. The updates are not scheduled and some times - quite often. I don't want to go into IIS and change settings or work with header files that have countless references to files and dates.
Currently, we are changing the file names but you can imagine how much work it requires.
Some time ago I read that we can expire these files on demand by keeping the file names of the files that change often in one file and whenever anything on that file changes, the browser is forced to reload those files.
Is this something I should do and how?

You can simply add version numbers to files that changed. You can read the actual version with php, and append it to the modified filenames automatically.
Version sample code:
<link rel="stylesheet" type="text/css" href="style.css?v=12345678" />
This forces the browser to download the files again.

Related

CN1 - unable to use localization after activating css

Recently I switched over from the legacy css integration to using the current method of css support via the CN1 Preferences dialog. Ever since then, I've had repeated problems accessing strings from the localization resource file.
A few important points:
I have two theme files, but even importing the strings as a csv file into the theme generated by css doesn't work
I've tried all possible combinations of theme initialization with the two theme files, including initializing just one of them, with no consistent success (occasionally it works, but then if I modify the css and the theme file gets regenerated it stops working again)
I created a brand new project and copied my code into it, imported the string files, and it worked - until I turned on css support. Then I was back to square one
When it fails to work, the method UIManager.getL10NResourceNames() returns an empty array
Any help would be greatly appreciated!
CSS controls the file and as a result you can no longer change the theme.res file by other means. You need to keep a separate localization.res file and load that strictly for the localization functionality of your application. You can use Resources.open("/localization.res") to load an arbitrary resource file.
After much poking around, I found the solution. It turns out my situation was the result of a few non-standard things I did. First of all, I had a theme.res file which I renamed using IntelliJ's Refactor >> Rename function, which renamed the hardcoded css theme name in the build.xml file to my new name. I needed to manually revert that string in order to prevent the css compile task from overwriting my theme file. The second thing I noticed is that sometimes (I'm not clear on what caused this) the theme file was not being refreshed in the /out directory when running the app locally. This would manifest itself, for instance, when I would add an image in the theme file, but when running the code it wouldn't be able to find it in the Resources hashtable. Every time this happens, I now know to just delete the contents of /out, thereby forcing the IDE to rebuild/recopy the theme file (I could probably just copy it manually to the /out directory, but I think deleting it is safest).

Wampserver localhost opening wrong files?

So, I'm trying to update my homepage for my school project, and I've made some noticeable changes in my html file, but when I open localhost, it shows the old ones.
Yes, I have tried saving, and it still opens the old ones. I tried emptying the www folder and putting the files back, but that doesn't work either.
I did notice that it's accepting the changes in css files, but it doesn't want to update html files.
Might be cache problems. Just clear you browser cache and try.
Make sure you are putting the right file, sometime the file you are editing and the file you have in the server might be different.

Force SquishIt to refresh/recreate minified files

Am looking to integrate SquishIt with our webapp. What I have noticed from the testing locally is, SquishIt generates the file only once. Based on other SO answers and reading the SquishIt code I gather that the file generation happens if the HttpCache doesn't contain a value of the generated hashed key.
If without restarting the app, or without clearing the HttpCache, if I delete the generated minified file, then SquishIt doesn't recreate the file.
Is there any way to force SquishIt to recreate the file, if it doesn't exist?
Earlier we were using RequestReduce and we noticed the it didn't always pick up css/js changes if only the css/js files were edited (ie, web.config was not edited and the app was not restarted). To ensure that the changes are picked up, we always delete all generated files when deploying.
Will SquishIt ALWAYS detect the changed code, even if web.config is not modified, the app is not restarted and the HttpCache is not cleared?
The [BundleCache.Add] (https://github.com/jetheredge/SquishIt/blob/master/SquishIt.Framework/BundleCache.cs#L40-54) method's code helps answer this question
Can I force SquishIt to generated files by simply deleting the generated files?
After thinking about the scenario I need to handle, this is the wrong question to ask.
EDIT:
What are the cache headers sent to the client for these generated files?
My scenario is as follows. I switched from the default JS minifier to JsMinMinifier. After deleting the files (RenderOnlyIfOutputFileIsMissing is set) and restarting the app, the minified files got generated. However, they had the same name as the previous files (I wrongly assumed it would have a different name).
Refreshing my browser showed that the newly generated files were sent by the server. How did this happen? If the assets had a long expiration cache header set on them, then the browser shouldn't have requested the new file from the server. (Inspecting the assets in Firebug, I am unable to understand the cache policy. To me it looks like it's set to cache for a couple of mins).
EDIT 2:
My take away is, there is no need to delete the generated file to cause regeneration. If the corresponding source files change, SquishIt WILL generate an appropriate file.
It should - we are adding cache dependencies for source files (not the generated ones) so if one of them is edited the entry in the bundle cache should be invalidated. See BundleCache.Add
No - once an entry is in the bundle cache we assume the output file will be there, so you'd end up with the file not being found. This is by design, we haven't really heard a compelling case against it.
Deleting generated files when deploying should be fine though, even if not strictly necessary - don't you need to restart the app then anyway?
If you are really concerned about files lingering you may want to consider using SquishIt without the file system

HTML5 Application Cache need explanation

Can someone show a complete example of application cache with html, css, js, appcache file including CACHE, NETWORK and FALLBACK section. Also updating the manifest. Where should the coding be written?
http://www.html5rocks.com/en/tutorials/appcache/beginner/#toc-updating-cache
As per updating cache from the above link, where should the coding been written?
The code for updating the manifest is written by your sever somewhere.
Either in PHP or Node.js you must write and serve this file with the correct mime type as specified in the link you posted.
You can auto generate this from the css and js files on your server. Don't include html files unless they are dynamic pages.
The first line in the file must be CACHE MANIFEST
Now it assumes your are putting things into the CACHE section, which is where you need to include all the paths to your css and js that you want the user to be able to use offline.
To create a NETWORK section, simply print out the word on it's own line.
Under this section you should include pages that should only be used online.
Under the FALLBACK section include a page to show if there is no offline version available.
This is a brief explanation but you should be able to easily find a tutorial that will help you auto generate this file.
For more details about the cache manifest itself:
http://diveintohtml5.info/offline.html
Offers the best explanation IMHO.

Using a cache manifest in a PhoneGap app

I have a typical phone gap application with an index.html and assorted other .js and .css files in the /www folder.
Now, how should I go about updating these javascript/css files? (Other than pushing a new app). I thought I might use a cache manifest, but that requires them to be on the same domain so I don't think that will work...
The only thing I can come up with is source online copies of the scripts after the local ones, overriding all the function definitions in the local file, but that seems really lame.
<script src="script.js"></script>
<script src="http://online.com/script.js></script>
put your code won googlecode.com , update your javascripts there , link your app add the external host in your phonegap.plist to match *.googlecode.com and alter your code in there, it will automatically update the app with the new one

Resources