Using Figwheel with cljs projects gives me unreliable caching. Sometimes saving the project doesn't load Figwheel, and then if I refresh the page, instead of loading the latest version of the app, it takes me to an earlier cached version of the app. How can I make caching more reliable in Figwheel, so that when I reload, I'm at the latest version of the app and not the old version?
With Figwheel there are certain ways to structure your code to make it "reloadable". Your caching problems sound much like some internal state persists between changes. Check the documentation here for some tips: https://figwheel.org/docs/reloadable_code.html
Related
we are developing a VueJS based application. We have huge caching problem.
Team members are constantly updating the site but we are getting feedbacks about the solved problems such as typos and miss placed elements.
I personnaly tried the inspect this situation, I found that Chrome reads the files from disk cache or memory cache until the page is refreshed. Even though sometimes chrome still loads the old page when we are re entering the site again (after the refreshing process (ctrl + shift + r)).
I' m sorry for my bad english but I tried my best to explain what I encounter. Also I found a topic about the problem, OP has explained the what I was encounteing. You can also check that out.
How to clear cache of service worker?
I created a website on IIS (local machine windows 10), published the project and tried to reaching it with local ip adress (127.0.0.1:8093), in the network tab I can see the .js and .css files being downloaded then I restart the browser and tried again, this time files are being served from disk cache, I tried couple of times and sometimes files are served from cache and sometimes downloaded.
I tried to add serviceWorker but I got empty handed. Also I created a base project to test some vuejs features and I added same serviceWorker code to the project. It cached again.
Our servers is windows 2012 server with IIS 8.
If it is possible we want no-caching approach or we want to manage what's cached and not. If you can help we would be appreciated.
You can checkout the base project
vue-base project
What I tried
As I said above I tried to add service workers as github commit,
https://github.com/vuejs-templates/pwa/pull/21/files
Also I tried deleting the cached data caches.delete(cacheName) did not seem to work.
I don't know if the serviceworkers related to this problem but did not solve my problem. May be I could not add the code properly. If you can help I would be very appreciated.
Thank you for your helps.
Edit1: Screen GIF
I dont know what you have been using to bundle your code and assets, but with webpack it is possible to create the files with a hashcode, which means that everytime the browser finds a new file reference in your browser it will download it.
Ex: you deployed yesterday a code which contained main.34534534534.js
Today you deploy again but the file is main.94565342.js. Your browser will automatically invalidate cache.
I've tried gradlew html:clean and then gradlew html:dist
however, it never uses the newest code. It will continue to grab the code from somewhere else and compile older versions of it. I got it to use the newest code once but I am not sure what I did to get it to do that. I'm not sure what files to post here to help.
For development, there are two ways possible:
If you don't need to debug and did not already compile: Use html:clean and html:superdev and make sure to delete the browser cache => You will get a fresh version of your game
If you need to debug or the game is already running: Use html:superdev if you did not already, head to localhost:8080/html, click the button to enter superdev mode (at the upper left corner) and hit recompile => You will get a fresh version of your game ready for debugging
For releasing an update of your game:
You need to enforce that all users get a fresh copy of your game. You cannot rely on all users deleting their browser cache, therefore you need to use other tricks for that (changing the directory of the game for every build, using HTTP headers...). I recommend you to use game hosting sites like GameJolt ot itch.io. They do this magic for you, and are trusted sites by players.
I found out the answer was to Shift-F5 to hard refresh the page. Chrome was caching the old info.
Looking for high-level guidance as I'm not sure where I'd even start w/ this.
I'm making a web app where most (if not all) of my users will have installed a Chrome extension I've written.
What I'd like to do is include large libraries in the Chrome Extension, and have the web app load the libs from the extension when the user visits a site.
e.g., both the extension & web app use React (same version).
When user visits www.mywebapp.com, the extension would inject the React library into the page and skip downloading the script.
Is this possible and/or advisable?
That's probably not a good idea, because you don't directly control updates of your extension. And the two have to be more or less in sync.
Suppose you need to update your site. Then you want to update the extension as well. That's at mercy of Google, and takes time. It's best if such updates are fully controlled by your web app server.
There are much better mechanisms to speed up (subsequent) load time by using client-side caches such as ApplicationCache. Here are a few resources to start:
A Beginner's Guide to Using the Application Cache # HTML5Rocks
Your first offline web-app # Google Developers
Application Cache is a Douchebag (for some gotchas)
I am about to start, working on a offline web application using HTML5, indexed db.
I have been reading a lot about it. But I got little confused thinking if the user deletes the cache of the browser, my app cache would also got deleted. And then there would be no way to use the application offline, until we got connected to internet, and browser creates a fresh cache.
Is this assumption true..or Is there a way to protect the app cache from getting deleted accidentally.
No. There isn't.
This is a normal behaviour which is similar to mobile apps. If users've removed their native apps, they need to redownload them whenever they want to reuse those apps. Appcache is not a silver bullet for the case.
Lets say we have an online application written in AS3 and served from a server as a SWF. The first version to go out is V1.0.
Several users, some behind a proxy server, use the V1.0 application and now there is a cached copy on the client machines and the proxy server.
V1.1 is released and placed on the server. All users should see V1.1, but results will vary, some will be served the fresh copy, some will for a period receive their cache's copy, and finally some will be served the cache'd copy in the proxy server.
I can be code in the V1.0 that checks a server variable to see if it's out of date. BUT if it is out of date, is there a way in AS3 to force it download a fresh copy, or apply the differences into itself?
Considering that I don't have access to the proxy server and can't manually or automatically clear the cache.
Is the SWF the only thing getting cached? If so then you could use a cachebuster when the page gets loaded.
Refer to your SWF like so: main.swf?timestamp=7062956829 this will cause the proxy server to think its a different file and not serve up the cached resource.
You may have a wrapper-preloader which requests the latest version number from the server each time the application starts, and then loads the application swf of the latest version.
There are also wise solutions for updates distribution like http://treetide.com/swfcontrol/
I think citizen conn provides a simple solution, albeit it introduces unnecessary server load.
You could use citizen conn's approach but instead of a timestamp, just use the app's version tag.
main.swf?app_version=1.1
A different approach would be to force the refresh from the app itself using DigitalD's approach.
But, since you are using this in the container html page, the container might be cached as well, so you need to force the reload of the container...