taiwangoldcard / website

Taiwan Gold Card Community website
https://taiwangoldcard.com
Other
43 stars 18 forks source link

Do we need Cloudflare in front of Netlify's existing CDN? #222

Closed ruridge closed 2 years ago

ruridge commented 2 years ago

Hi me again! 👋

I've noticed a couple of issues that look look like the may be caused by the site cache setup: JS & CSS assets not loading, asset URL's pointing to previous build versions.

Resource 404:

Screenshot 2022-02-18 at 21 30 27

Cloudflare’s proxying (also known as “Accelerated and protected” on their service) could be clashing with the Netlify's default CDN setup.

Introduction on why you may not need Cloudflare when using Netlify 🔗

More details: https://answers.netlify.com/t/support-guide-what-problems-could-occur-when-using-cloudflare-in-front-of-netlify/138

"Netlify’s web service is not designed to work optimally with another CDN “in front of” our CDN. Proxying to our service is in general not supported and we advise you not to do it for best hosting results."**


Related: I think Cloudflare's Rocket Loader I also causing some strange JS bugs:

Sidebar nav JS not running as expected:

Screenshot 2022-02-18 at 21 32 06

Can I ask: What Cloudflare features are we currently using?

And can they be replaced with Netlify?

Netlify has: CDN, Edge node caching, load balancing, DDoS protection, asset optimization, and snippet injection.

erickhun commented 2 years ago

Thanks for reporting @ruridge !

The 404 is maybe due to Cloudflare caching the HTML files so it's querying the old one. I think ideally, we would purge cache after the github action deploy the website to github. I've purged the CF cache, are you still seing the 404? Could be a good one to do if one has bandwidth

Also , I've tried to deactivated CF proxy but looks like I end up with an SSL certificate issue. I believe we don't serve content from Netflify but Github Pages? Screen Shot 2022-02-19 at 8 06 10 PM

Also might be wrong here: we just use Netlify to generate the HTML if one want to use their CMS, and the HTML output ends up in Github? I don't know if that'd make sense to use Netlify CDN for us ( don't think Netlfify was even used lately ).

erickhun commented 2 years ago

@ruridge Thanks for the tip on the rocket loader, I've just deactivated it. Looks like CF trying to do too much magic for us

fifieldt commented 2 years ago

Welcome back @ruridge and many thanks, it's good to have you.

If one takes a look in the repo under .github/workflows/deploy.yml you'll find the magic that does the Hugo build. Basically we use github actions to run Hugo to generate the HTMl/CSS/js and then github pages scoops it up right from the repo. (Though github pages technically has its own cdn which could theoretically cause double caching issues of the type you mention)

There might be some netlify artifacts in here because we tried to get netlify CMS working. However, as I understand it we never tried to build or serve from netlify.

ruridge commented 2 years ago

Ahh I see! I didn't realise it is hosed on GH Pages, I saw netlify-identity-widget.js being loaded in on the homepage and jumped to the conclusion you were using Netlify. Thanks for the clarification @erickhun & @fifieldt 🙏 (I should have paid more attention to the README 😅)

I'm not getting 404s anymore so flushing the cache seems to have resolved that bug, good call on #223 sounds like a good solution for future deploys 👍

ruridge commented 2 years ago

@ruridge Thanks for the tip on the rocket loader, I've just deactivated it. Looks like CF trying to do too much magic for us

The sidebar is loading again for me so it looks like your fix worked. 🥳

fifieldt commented 2 years ago

We had that documented? 🤣

Patched to make README clearer: https://github.com/taiwangoldcard/website/commit/414f3bf715d98dbf36537c0a86d899cafd483f95