CodeFrame does not cache p5 library in service worker or browser cache on Chromium

Chromium browsers do not cache the p5 library used for examples. This is a limitation on the use of iframes with a srcdoc attribute on Chromium as documented here. As a result, pages like the arc() reference download the p5 library for each example. This happens regardless of service worker scope, origin, etc as far as I can tell. This does not happen on Firefox or Safari.

Some solution using iframe and srcdoc may exist that I do not see but afaik there are two possible approaches from here:

1. Generate HTML files to serve for the src attribute of the iframe ala _arc_reference_example_1.html. This is similar to what happens on the current p5 sites's example pages.
2. Make the CodeFrame component use p5 instance mode to render the canvas directly into the body without an iframe/document wrapper. This is how the current p5.js site handles reference sketches.

I believe that 2 is cleaner but I am open to alternatives. I think that the equivalent code from the current p5 website is here.

Potentially useful links:

• This wiki which explains p5.js global versus instance mode
• Astro's client directives, to prevent library code from running during static build

Start by inspecting the CodeFrame component and the current p5.js website's src/assets/js/render.js, then reproduce the arc() reference example in Chromium. Compare the iframe/srcdoc approach with the instance-mode approach described in the issue. Done means the p5 library is not downloaded separately for every example in Chromium.