- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Dec 15, 2020 02:07 PM
I’ve noticed that when using .loadCSSFromString()
the frontend renders multiple duplicates of the same <style>/<style>
element in the DOM body. Is there a way around this that I’m missing? In the example below, .loadCSSFromString()
is placed at top-level and not within a loop.
Solved! Go to Solution.
Accepted Solutions
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Dec 15, 2020 03:28 PM
Are you calling loadCSSFromString
inside a React component? Assuming the styles don’t need to change, you could move this outside of the component, e.g. call it once at the top of your index file.
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Dec 15, 2020 03:25 PM
Update: I noticed its creating a new <style>
everytime State gets updated. Still interested if there’s a way to load the css only once since we can’t use Webpack or some other compiler.
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Dec 15, 2020 03:28 PM
Are you calling loadCSSFromString
inside a React component? Assuming the styles don’t need to change, you could move this outside of the component, e.g. call it once at the top of your index file.
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Dec 15, 2020 03:37 PM
Yep, you’re right. Could have sworn I put it at top level but I see now its within a component. Thanks Stephen!