Cache busting plugin

[oscarotero]

Enter your suggestions in details:

Related: https://github.com/lumeland/lume/discussions/350

A plugin to search links to images, css, videos, etc in the html pages and add a suffix. Then, it adds the same suffix to the files.

[ajschmidt8]

just checking in. any updates on this feature?

[oscarotero]

@ajschmidt8 No yet. I'll create a first version in the expiremental plugins repo, for testing.

[RickCogley]

Hopefully it could work with any sort of downloadables. We have clients who ask us to link a PDF of theirs on their site, and we do it, then soon after they send another with some small typo fixed. We always manually add a date tag and serial letter like 20231230A, but automation sounds sweet!

[andy-preston]

Workaround.

Have a _data.ts file with:

export const cacheBuster = `${new Date().getTime()}`;

Then, in your template, you can do something like.

<link rel="stylesheet" href="/style.css?cb={{ cacheBuster }}">

It doesn't solve every use-case but it's just right for styles and suchlike.

[RickCogley]

Thanks, this is just right and I confirm it works!

It doesn't solve every use-case but it's just right for styles and suchlike.

[oscarotero]

The cache_busting experimental plugin has been upgraded to Lume 2

[RickCogley]

@oscarotero thank you very much for putting the time in to upgrade this. I tried it right away but without success. The error I'm getting is:

❯ deno task lume upgrade
Task lume export TZ='Asia/Tokyo' && echo "import 'lume/cli.ts'" | deno run -A - "upgrade"
Update successful!
Your Lume version is: v2.2.2
❯ deno task lume --serve
Task lume echo "import 'lume/cli.ts'" | deno run -A - "--serve"
Loading config file file:///Users/rcogley/dev/help.esolia.pro/_config.ts
TypeError: Failed to execute 'digest' on 'SubtleCrypto': Argument 2 is not an ArrayBuffer or a view on one
    at makeException (ext:deno_webidl/00_webidl.js:91:10)
    at Array.converters.BufferSource (ext:deno_webidl/00_webidl.js:644:11)
    at SubtleCrypto.digest (ext:deno_crypto/00_crypto.js:518:30)
    at getContentHash (https://raw.githubusercontent.com/lumeland/experimental-plugins/c8778bfbf480f57a2357ab94bc22290b8bf11d12/cache_busting/mod.ts:110:46)
    at getHash (https://raw.githubusercontent.com/lumeland/experimental-plugins/c8778bfbf480f57a2357ab94bc22290b8bf11d12/cache_busting/mod.ts:70:33)
    at eventLoopTick (ext:core/01_core.js:168:7)
    at async addHash (https://raw.githubusercontent.com/lumeland/experimental-plugins/c8778bfbf480f57a2357ab94bc22290b8bf11d12/cache_busting/mod.ts:60:20)
    at async Object.replace [as fn] (https://raw.githubusercontent.com/lumeland/experimental-plugins/c8778bfbf480f57a2357ab94bc22290b8bf11d12/cache_busting/mod.ts:41:16)
    at async https://deno.land/x/lume@v2.2.2/plugins/modify_urls.ts:65:15
user=2.68s system=1.80s cpu=57% total=7.823

How I'm loading:

import cache_busting from "https://raw.githubusercontent.com/lumeland/experimental-plugins/c8778bfbf480f57a2357ab94bc22290b8bf11d12/cache_busting/mod.ts";
...
.use(cache_busting())
...

My deno.json:

{
  "importMap": "./import_map.json",
  "tasks": {
    "lume": "echo \"import 'lume/cli.ts'\" | deno run -A -",
    "build": "deno task lume",
    "serve": "deno task lume -s",
    "update-deps": "deno run -A 'https://deno.land/x/nudd@v0.2.5/cli.ts' update deno.json"
  },
  "compilerOptions": {
    "types": [
      "lume/types.ts"
    ]
  }
}

I tried adding "import" specifying lume 2.2.2 but it made no difference.

I did deno task update-deps and deno task lume upgrade in the project, and both appear to have completed successfully. The above error was after both of these commands had been executed.

[oscarotero]

It works fine to me. Are you using the latest version of Deno?

Anyway, I've detected some issues in this plugin if it's combined with other plugins like inline or transformImages. So if it doesn't work fine for you, maybe https://github.com/lumeland/lume/issues/352#issuecomment-2176561741 is a better solution

[RickCogley]

Hello - I upgraded Deno but it doesn't change. One repo I tried it on is definitely using transformImages. The other is using the wiki template which I may have added ogImages and favicon plugins to, so, maybe those have an impact. At any rate the other method works for what I need. :)