ejmg / zerm

a minimalist and dark theme for Zola
https://zerm.ejmg.now.sh/
MIT License
120 stars 39 forks source link

Add cachebusting for CSS. #20

Closed adworacz closed 3 years ago

adworacz commented 3 years ago

This allows users to set extremely high caching values for their CSS assets without worrying about poor UX whenever an update to said assets is made.

Note: Can't add this for JS assets yet, the cachebusting logic is broken, see https://github.com/getzola/zola/issues/1416

Ref:

vercel[bot] commented 3 years ago

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/ejmg/zerm/3388wxGeTEx5PzjVDtDwdm4CSpkt
✅ Preview: Failed

adworacz commented 3 years ago

Hmmm, I don't have an account with Vercel, so I can't see what the actual issue is....

Edit: You can find this code running successfully on my own blog: https://austindw.com/

ejmg commented 3 years ago

Aside: I will have to look into why other people can't see the failed builds, wonder if I can make them public, etc.

here's the error log:

00:32:18.034 | $ ./zola build
00:32:18.053 | Building site...
00:32:18.139 | -> Creating 5 pages (0 orphan), 2 sections, and processing 0 images
00:32:18.147 | Failed to build the site
00:32:18.147 | Error: Failed to render section '/vercel/workpath0/content/about/_index.md'
00:32:18.148 | Reason: Failed to render 'section.html': error while rendering macro `head::styling` (error happened in a parent template)
00:32:18.148 | Reason: Could not read file `style.css`. Expected location: /vercel/workpath0/content/style.css
00:32:18.162 | error Command failed with exit code 1.
00:32:18.163 | info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
00:32:18.179 | Error: Command "yarn run build" exited with 1
00:32:22.535 | Done with "package.json"

off the top of my head, i can't say why it's choking on the head::styling macro.

ejmg commented 3 years ago

before going too deep, i have a suspicion this might be just a CI issue. the package.json uses Zola 0.11.0, and might just need to be updated?

adworacz commented 3 years ago

Yeah I’ve been using this with no issues on my current blog, using Zola 0.13.

I’ve not tested it with the new 0.14 release just yet.

ejmg commented 3 years ago

Cool, this almost certainly means the failure is the vercel deployment using an old Zola binary.

On Tue, Jul 20, 2021 at 2:32 PM Austin Dworaczyk Wiltshire < @.***> wrote:

Yeah I’ve been using this with no issues on my current blog, using Zola 0.13.

I’ve not tested it with the new 0.14 release just yet.

— You are receiving this because you commented.

Reply to this email directly, view it on GitHub https://github.com/ejmg/zerm/pull/20#issuecomment-883641589, or unsubscribe https://github.com/notifications/unsubscribe-auth/AEK7ZPXMLUWGJ643HK6SQU3TYXFLZANCNFSM4ZQCGQEQ .

ejmg commented 3 years ago

alright, i've tested this out myself and it works just fine. i went ahead and updated zerm to use v0.13.0 of zola, too.

is there anything that someone using this theme should know about this feature? looking at the zola link, i don't get much about how the caching works or how it effects me, new changes/deployments, etc.

other than that, i am good to merge the change.

adworacz commented 3 years ago

Sorry for the delay, been busy.

This specifically adds cachebusting, which allows users to safely set really high caching values for static assets (like CSS) while still allowing for updates to the CSS file.

This is done by creating a hash of the CSS file contents and appending it to the URL. Whenever the CSS changes, the hash changes, which signals to the browser that a newer version of the CSS is available.

It's a way of "having our cake and eating it too." Visitors can benefit from long caching values, while website owners can make CSS changes and know that they'll be propagated immediately to visitors.

So for Zerm, this allows users to immediately benefit from changes made inside the theme, without having to wait for visitor's browser caches to expire.

ejmg commented 3 years ago

Thank you for the explanation!