Why is my page getting cached (but only sometimes)?

[wgxli]

I’ve been messing around with GitHub pages for a while, and noticed some very confusing behavior. Long story short, I spent a few hours debugging the problem and have boiled the problem down to the following two scenarios:

Scenario 1

1. Clear the entire cache of the browser being used.
2. Visit url <A> (exact url listed below).
3. Visit url <B>.
4. The browser incorrectly displays the index.html of the url for <A> instead of <B>. I have found no way to resolve this issue besides clearing the cache and following Scenario 2 below.

Scenario 2

1. Clear the entire cache of the browser being used.
2. Visit url <B>.
3. The correct index.html page for <B> is displayed.
4. Even after visiting URL <A>, the browser always correctly displays the page for <B> and no further issues arise.

I honestly have no idea what’s going on, and any help would be much appreciated. I’ve reproduced this behavior in Firefox and Chrome on both desktop and mobile.

Specific URLs in question:

<A>: https://wgxli.github.io/

<B>: https://wgxli.github.io/complex-function-plotter/

[wgxli]

I ended up solving the problem. I was using create-react-app, which automatically registers service workers to locally cache page content. I just disabled the service, and the problem went away.