On Friday, March 27, 2015 at 2:40:45 PM UTC+1, Colin Yates wrote: > I realise this is one of those 'it depends', but in general, is it > recommended to hide elements in react or not render them? > > For example, I have an SPA with a bunch of top-level pages. Each page has a > number of tabs, each tab might be a tree or a table and so on. > > I could render the whole thing and hide non-relevant things with 'visible: > hidden', or I could only render what is actually needed. > > I went with the second as it seems 'cleaner' somehow, but it does mean you > need to track more things: > - scroll positions of various panels > - expanded/collapsed state > - etc. > > On the other hand, rendering everything and using the hidden class might > overwhelm the dom and I am unsure of how expensive a reflow caused by > showing/hiding compared to replacing the dom. > > The general opinion I get from google, stack overflow and react docs is to > only render what is needed, but nothing definitive. > > If it matters, this is a closed intranet with pretty lame PCs, so waiting a > while for the app to load is fine. Switching between tabs/panels, expanding > tree nodes etc. should be as quick as possible. > > Has anybody done any studies/offer any guidance? > > Thanks!
I've seen a talk wednesday by a guy specialised in Web Perf. He clearly stated that BIG DOM makes stuff slow. I would definitely not render them. Hiding/showing should be reserved for small parts of a component, i.e. an error message in a form. -- Note that posts from new members are moderated - please be patient with your first post. --- You received this message because you are subscribed to the Google Groups "ClojureScript" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/clojurescript.
