Fork me on GitHub
#reagent
<
2021-04-14
>
rberger03:04:26

Is there a “reagent way” to insert meta tags in the <head> of the dom the application is running in? I’ve figured out a way to do it with javascript interop and directly manipulating the dom, but wondering if there is a more reagent way to do it that could be fed with data from re-frame or r/atoms

valtteri04:04:46

Re-frame effects are meant for this kind of things.

valtteri04:04:04

Basically it’s just a bit more controlled way to do what you already do with interop and you get to pick data from app-db or any other coeffects

rberger04:04:10

The re-frame is one part, but the other part was wondering if there is a more reagent way to append / update / insert into the <head> The only think I found was to render into head but that seemed to replace the whole head not add to it.

rberger04:04:20

I tried to use https://github.com/nfl/react-helmet with Reagent, but I couldn’t get it to work. It wasn’t clear how to get it to fit into the Reagent way of starting the app.

valtteri04:04:29

Head is usually “outside” the react render tree. Imo using dom manipulation side-effect would be idiomatic :thinking_face:

valtteri04:04:48

I mean, to me it would be more weird if reagent did side-effects outside its render tree

rberger05:04:13

Yeah, I need to be able to dynamically create meta tags to support https://support.shareaholic.com/hc/en-us/articles/115005177166-Adding-Meta-Tags-using-JavaScripthttps://ogp.me/. Some of the data in the tag isn’t known until the page is being loaded.

rberger05:04:10

But thanks for the reminder that I should probably do the interop in an effect. That will solve one problem I’m having

👍 3
Noah Bogart20:04:30

I read this 2017 post about reagent speed https://yogthos.net/posts/2017-03-26-ReagentReactView.html and I realized that I don't quite understand how cursors work

Noah Bogart15:04:54

don't wanna be pushy, but anyone have ideas about why this happens?

Noah Bogart20:04:52

in the example that @yogthos writes, a given cursor is created within for loops:

(for [idx (range (count (:players @game)))]
     ^{:key idx}
     [player-component (reagent/cursor game [:players idx])])

Noah Bogart20:04:29

doesn't that re-create the cursor every time the enclosing function is called?