4

I'm trying to create a website on GitHub Pages, but for some reason, my CSS is taking a very long time to update. I just want to be clear that my CSS does load, it just isn't updating. I tried everything, like clearing the browser cache. But when I go to deployments, my changes were never deployed, and the CSS file https://virxec.github.io/CSWeek/assets/main.css also hasn't updated. The page is here: https://virxec.github.io/CSWeek/MiniGames/ and the file is here https://github.com/VirxEC/CSWeek/blob/master/assets/main.css Is there a way to make GitHub Pages updated CSS files faster? I checked in the commits and it actually says that it hasn't built the page with the edits to the CSS file - only the other pages.

UPDATE: I just waited for a while and then made another small change and then committed it. It updated immediately. Why does this happen? Why didn't it just auto-rebuild?

VirxEC
  • 998
  • 10
  • 22
  • 1
    Consider updating your HTML that references the CSS when it changes. Something like `href="assets/main.css?v=123"`. – Heretic Monkey Sep 13 '19 at 15:39
  • Possible duplicate of [How to force the browser to reload cached CSS/JS files?](https://stackoverflow.com/questions/118884/how-to-force-the-browser-to-reload-cached-css-js-files) – Heretic Monkey Sep 13 '19 at 15:40
  • If clearing your browser cache didn't work, my guess is that it's cached on the GitHub Pages CDN. Adding a queryparam to the filename could potentially force the CDN to update. Another thing to try: when I've run into this issue, I've found creating an empty commit `git commit -m 'force gh-pages to rebuild' --allow-empty` and pushing it to your gh-pages branch can also help. – thmsdnnr Sep 13 '19 at 15:56
  • One other thing: when you click "Commits" on your repo [page here](https://github.com/VirxEC/CSWeek/commits/master), it looks like you're triggering a rebuild quite frequently (that's the green check to the right of the commit). GitHub Pages support cites a ["soft limit of 10 builds per hour"](https://help.github.com/en/articles/what-is-github-pages). You could try spacing out your pushes a bit more to make sure you're under 10 every 60 minutes and see if that helps. – thmsdnnr Sep 13 '19 at 16:05
  • @HereticMonkey I'm on a different computer and it still hasn't updated xD – VirxEC Sep 13 '19 at 16:05
  • @thmsdnnr There's only been 8 in the past 2 hours – VirxEC Sep 13 '19 at 16:06
  • I'm not sure what your comment means. Did you apply my suggestion and it hasn't updated? Did you apply @thmsdnnr's suggestion? I'm helping many people out on this site, as well as working a full time job -- I'm not really tracking your issue, especially since the duplicate question's answers give more than enough advice... – Heretic Monkey Sep 13 '19 at 16:11
  • I can't use thmsdnnr's suggestion. I'm not using Git. – VirxEC Sep 13 '19 at 16:44
  • And I did try your solution, but it didn't work because https://virxec.github.io/CSWeek/assets/main.css hasn't updated – VirxEC Sep 13 '19 at 16:45
  • I just waited for a while and then made another small change and then committed it. It updated immediately. Why? – VirxEC Sep 13 '19 at 17:19

1 Answers1

1

It looks like you have to bust the cache manually on Github pages.

Here's how I do it in my Jekyll project:

<link rel="stylesheet" href="{{ "public/css/style.css" | prepend: site.baseurl }}?{{site.time | date: '%s%N'}}">

This spits out something like this:

<link rel="stylesheet" href="/public/css/style.css?1634299829608420276">

The timestamp appended after the ? changes on each build which invalidates the cache.

shime
  • 8,746
  • 1
  • 30
  • 51
  • Thanks for your answer. This was quite a while ago now, but I do remember reading something about GitHub pages having a limit on how many re-builds it will do in a time frame. It also won't auto re-build once that time frame is up, another commit must be pushed for it to rebuild (which I believe was what was confusing me) – VirxEC Oct 18 '21 at 17:12