Android back button and cache

I was working on a weird functionality a counter for social media share. Basically after you have made the click it increases the counter by 1. The problem is that the sharing popup or window opens a new tab on Android. When you return to the original parent window it loses the dynamically update DOM and returns to the cached one (bfcache). I have tried to do some adjustments on focus return also attempted “visibilitychange” and unfortunately none of these worked out:

$(window).on('focus', () => {})
$(window).on('visibilitychange', () => {})

The only way I could solve this:

1.) On the click event I have increased the counter and also stored the new total in the hash:

window.location.hash = 'counter?='+newtotal;
then opening the new window (e.g. twitter share form)

2.) On load (return to the parent window) I have used the hash to retrieve the total and updated it back to the DOM.

	$(window).on('load', () => {
		if(window.location.hash) {
			var count = window.location.hash.split('=');
			if(count && count.length > 1) {

It is far from perfect but it works. You can read more on this topic here and here.


Android likes to cache even ajax queries regardless of that you returned to the windows and apparently everything has been re – rendered (re drawn from cache).
Something like this can be helpful as a cache buster:

$.get(uri + '?_=' + new Date().getTime())

Leave a Reply