Pull icons from CDN and remove from bundle

[johnnymetz]

What does this PR do?

• Closes https://github.com/pixiebrix/pixiebrix-app/issues/3475
• Remove simple-icons and bootstrap-icons from bundle. This reduced the final bundle size from 19.8 MB to 16.9 MB.
• Serve icons from CDN
• Note, we still include the icon file names (e.g. 1password.svg) in the bundle. We need this so users can see / search icons.

Discussion

• I'm not 100% happy with my implementation. Writing empty files to the final bundle seems hacky. Instead of writing several empty files, I tried creating a webpack loader that creates a file that contains all icon names but couldn't get it to work, see https://stackoverflow.com/questions/76418333/create-webpack-loader-to-write-icon-filenames-to-a-single-file
• Federico outlined another approach in Move icon packs to the server #4187 (see "Proposed solution" section) but that seems like overkill
• Second iteration on the implementation is much better - see comment below.

Demo

https://www.loom.com/share/461cc4fa7510454391dc170f60135449

Team Coordination

• This PR introduces a new library: double check it's MIT/Apache2/permissively licensed

Checklist

• Add tests: none needed
• Designate a primary reviewer: @BLoe

[codecov]

Codecov Report

Merging #5865 (d79b859) into main (86b8a0a) will increase coverage by 0.00%.
The diff coverage is 0.00%.

@@           Coverage Diff           @@
##             main    #5865   +/-   ##
=======================================
  Coverage   66.13%   66.13%           
=======================================
  Files        1083     1083           
  Lines       33403    33404    +1     
  Branches     6298     6298           
=======================================
+ Hits        22090    22092    +2     
+ Misses      11313    11312    -1     

Impacted Files	Coverage Δ
src/icons/getSvgIcon.ts	0.00% <0.00%> (ø)

... and 1 file with indirect coverage changes

[twschiller]

I'm not 100% happy with my implementation. Writing empty files to the final bundle seems hacky. Instead of writing several empty files, I tried creating a webpack loader that creates a file that contains all icon names but couldn't get it to work, see https://stackoverflow.com/questions/76418333/create-webpack-loader-to-write-icon-filenames-to-a-single-file

@johnnymetz how does https://v4.webpack.js.org/loaders/raw-loader/ work? Presumably that would be a way to return the CDN URL to the list.ts file without writing anything to disk? https://github.com/webpack-contrib/raw-loader/blob/master/src/index.js.

Or is the file emit call somehow necessary? It doesn't seem necessary to emit a .txt file of icons. As webpack could just put the strings into the bundle that list.ts goes into

If we can't get a loader to work, we can always delete the generated files on CI before zipping up. I want to remove any unused small files though, because small files seem to drastically slow down the Rainforest VMs. (Although we can test with your PR branch and see)

[johnnymetz]

@twschiller was able to figure out how to do it using the asset/resource module. PR is much cleaner now, doesn't include a custom webpack loader and doesn't include empty SVG icon files (the only folder in the dist/user-icons folder is custom-icons - see image below).

[github-actions]

When the PR is merged, the first loom link found on this PR will be posted to #sprint-demo on Slack. Do not edit this comment manually.