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.

1
2
3
4
5
6
7
8
9

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

It is far from perfect but it works. You can read more on this topic here and here. UPDATE ONE: 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:

1
2

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