icon request is not cached on the level of react-inlinesvg component
strodoff opened this issue · 1 comments
Hi guys
I use the same icon in several places (with your library).
Instead of making one network request for this icon many requests are made
Steps to reproduce the behavior
- Go to https://codepen.io/strodoff/pen/OJvEOjL?editors=1010
- Open the inspect tools
- Go to the Network
- See many requests for a single icon
Expected behavior
We expect to see only one request for the icon
Additional context
The issue occurs when I import
import SVG from 'react-inlinesvg'
The issue does NOT occur when I import
import * as reactInlinesvg from 'react-inlinesvg'
Hey @strodoff
Make sure the remote SVG has CORS headers or the cache might not be populated. The remote file doesn't have the appropriate headers in the example you posted.
The cache is populated AFTER a successful response, so simultaneously loading the same URL in multiple components won't work.
The import difference doesn't make much sense as this library exports a default class. It might have something to do with your setup.