To wrap up. Double optimization was a good hunch, but not the solution.
CloudFlare have a bug in the way Pages generates header records. Who knows if they will fix it.
@Davidsneighbor was on the right path earlier with the pointer to CloudFlare Page Rules.
but, the path had another twist. Rather than Page Rules, which I don’t think works with the “Pages” beta product I was told to create a “Worker”. BTW, you can sort of forget about CloudFlare support. Tier 1 can do some DNS stuff but that is it. I went on Discord/CloudFlare Workers where there are folks who know about Pages (there is a #Pages tag…). They picked it up from my post in the CloudFlare forum and had already posted in Discord. I replied to Joe’s post and he dashed off the JS script needed. Incredibly helpful and quick.
The work around is a bit of a heavy lift: You need a local Node tool that provides a local cli called Wrangler for creating Workers (brew install npm; npm to install wrangler; some bootstrapping with Wrangler–not unlike using Hugo to build skeletons). Each Worker has a small config file and an index.js that runs each time a given route is requested. This JS code resets the bogus type of the css from “application/octet-stream” (arbitrary binary data) to “text/css”–but just making sure that any file that ends in .css gets “text/css”.
What’s interesting is that one of my Hugo sites on CloudFlare worked without this “work around”. I’ll go look but I think the CSS filename must have looked innocent to CloudFlare’s security filters while the other css had a named that tricked them.
I would have said that CloudFlare was ok but for this problem. I have tried Render, Netlify and Vercel. I am sure that all have their fans. This new thing of hosting SSG’s is pretty commoditized though each tries to add their own special icing decorations (YMMV).
I found Render to be pretty good. Not quite as fast as Vercel but close. Vercel wants to give you are multilayered workflow in a pretty UI that seemed to mostly get in the way. Render’s only problem is that you’ll have to integrate it with github manually, which they don’t document correctly. The others do that for you, only requesting you to complete a popup github authorization. Once Render is integrated with github, it is actually pretty nice. The setup and management of build/deploy has lots of options, most of which can be ignored unless you need them. They have the essentials covered and it’s quite easy. And they make it very easy to force re-deploy as sometimes they get a little slow at automatically redeploying after a push (especially if you are hacking around like me with a lot of pushes in quick succession). On a more steady diet of pushes, it seems immediate.
I have a few more sites to create. Each time I’ll give CloudFlare a try. If they have this css problem, I just have to add more routes. If that hangs me up, there is always Render.com or others.