Open ivanreese opened 6 years ago
For the time being, we're using <object>
with a <style>
tag injected by cdig/cd-core.
I'm going to keep this issue open, since it does point to some of the downsides of that approach, and we might want to switch to one of the JS-based solutions in the future.
This issue will track R&D having to do with figuring out a better way to deal with static SVG images in our content.
Current Issues
<img>
can't use webfonts, period. SVG files embedded with<object>
can, but they need to load those fonts with a<style>
tag inside the SVG, and they don't get cached. For more, see here: https://css-tricks.com/using-custom-fonts-with-svg-in-an-image-tag/Ideas
<object>
, and then use JS to reach into each of those images and add the font style rules we need. But then those fonts are going to download once for every SVG (since they don't do resource sharing).<object>
and insert it inline into the module. We get fonts, but we lose SVG caching.<img>
. Downside is bloat. Neutral is that we don't get the OS's font rendering (bad because some OSes do a nice job and handle small font sizes well, good because some OSes suck and we cut down on cross-browser differences).