Clojurians
#om
<
2016-11-28
>

This page is not created by, affiliated with, or supported by Slack Technologies, Inc.

haywood01:11:28

wooord, nice thanks man

haywood01:11:47

I've spent the weekend just modeling my backend with datomic so the pull queries against the data match the data on the client. now trying to figure out how to wire the om.next client with the server

haywood01:11:04

do I need to use transit?

haywood01:11:57

fyi not really looking for answers... just happy making noise

haywood01:11:05

I'll get it eventually

danielstockton08:11:09

transit is a good choice

danielstockton08:11:23

especially since you're dealing with clojure on both ends

amann13:11:08

For posterity’s sake on (https://clojurians.slack.com/archives/om/p1479413311007034): I posted here a little while back about seeing really high CPU util from FireFox and that I had traced it down to some GC and Render stuff going on. What made this unique was that Chrome had no such problems. I was able to narrow down the errant code later that day, but am still on the hunt for the Chrome vs Firefox question. Turned out, in the CircleCI Om code that we had a little something like this going on:

(reify
    om/IWillUpdate
    (will-update [_ something _]
      (when (something-booleany? something)
        (om/set-state! owner [:this-is-cool-yeah?] "woah boy!"))))
Changing this to first check that the owner’s state hasn’t been set dropped CPU util down to comparable between Chrome and FireFox. Changing this entire thing to be under IWillReceiveProps was an even cleaner solution (and ultimately where this should have been to begin with). Why this is a different issue between the two browsers, I do not know, but this is what I’m aiming to figure out. For those interested in the actual code, have fun! https://github.com/circleci/frontend/commit/c787a719bc73ba9b62f414e71bd276194a637ee2

fatihict19:11:17

Hi folks, I (a ClojureScript noob) am struggling with the following: I want to use this library: [cljsjs/react-grid-layout "0.13.7-0"] and have included it in my project and imported in my namespace. I have the following code to create a ReactGridLayout component: (def GridLayout (js/React.createFactory js/ReactGridLayout)) but I get errors in my console saying that ReactGridLayout is not defined... Can anyone point me in the right direction to solve this problem. I have no clue how to solve this.. :confounded:

haywood19:11:25

I don't think it's in the js/ namespace

fatihict19:11:23

:thinking_face: Thanks for your response. Do you know in which namespace I can look for it?

haywood19:11:24

maybe try (:require [cljsjs.react-grid-layout :as grid]) then grid/ReactGridLayout

haywood19:11:41

that require assumes it's inside the ns macro, in which case you do not need to quote the vector

jr19:11:33

you need to require cljsjs.react-grid-layout for it to be available as a global

fatihict19:11:53

Thanks for the tips. I have required react-grid-layout and also tried grid/ReactGridLayout instead of js/ReactGridLayout, but that also didn't work for me.

haywood19:11:31

you could just add the script tag for the lib in your browser for now

haywood19:11:39

and access it via js/ReactGridLayout

fatihict19:11:36

The library is being included <script type="text/javascript" src="http://localhost:8080/js/out/goog/../react-grid-layout.inc.js"></script>, but somehow ReactGridLayout is still not defined..

haywood19:11:27

gonna load up a test chestnut app

haywood19:11:28

and see what's up

fatihict19:11:43

I was using om version 0.8.8, I am now updating to the bleeding edge version... Maybe that will solve my issue..

fatihict19:11:06

Oh, and it works now :slightly_smiling_face:

fatihict19:11:21

Thanks @haywood for thinking with me!

haywood19:11:50

ah, so it does get thrown on the js/ namespace

fatihict20:11:43

Yes, it does :slightly_smiling_face:

mlimotte21:11:16

I'm working with a toy om.next app to learn about it. I have a page with a couple of divs which I want to make into Tabs with goog.ui.TabPane. I was only able to get this to work by adding the root component and then creating the Tab:

(om/add-root! reconciler RootView (gdom/getElement "app"))
(TabPane. (gdom/getElement "Root")) ; "Root" refers the rendered RootView
I.e. The TabPane constructor is called outside of any component's (render) method. How can I do this inside a Component? Can I pass a component as the arg to TabPane? Or how else do I identify the container to create a TabPane from, since (gdom/getElement "Root") seems to be nil until after the render is done.

mlimotte21:11:07

I thought about doing the (TabPane. ...) in the RootView components' componentDidMount() method. Not sure if that will work or is the recommended approach. I'm going to try it?

haywood21:11:44

you could create a React wrapper around the tab pane, which would mostly consist of lifecycle method manipulation.`(TabPane. React.findDOMNode(this))`

mlimotte21:11:01

componentDidMount works! But is that the recommended approach. Seems non-obvious to me, but I'm also new to front-end development, as well as Om dev.

haywood21:11:24

that's what you gotta do when you're bringing jquery plugins into react

haywood21:11:29

or other non-react stuff

mlimotte21:11:56

@haywood can you point me at an example?

haywood21:11:35

hm, doing some googling

haywood21:11:14

you can create the react wrapper with om or just dirty js interop

haywood21:11:22

om has all the lifecycle interfaces