Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Removing User Interface Complexity, or Why React is Awesome

jlongster.com

Post reply on HN
Print view View original

31–40 of 228 posts

Re: Removing User Interface Complexity, or Why React is Awesome

#31

Post by NathanKP »

catshirt wrote: post #19
NathanKP wrote: post #5

I really like the core concepts of React, especially the way it is designed to help you organize your code into reusable components. I think the key to making React take off is building a centralized repository for components that are open source. Then building your webapp would be as easy as importing the components you need: bower install react-navbar bower install react-signup-form bower install react-sso-signin-f…

what does React bring to the table here that Ember, Backbone, etc. don't? i could register my Backbone or Ember views with Bower all the same.

This comment from another HN poster does a good job of describing the difference between components in React and "components" in Ember and Backbone:

https://news.ycombinator.com/item?id=7738511

Long story short, React has a much more graceful system of making the components generalized instead of the adhoc system that Ember and Backbone use.

Ember and Backbone have features that are similar to components, but components from two different sources will rarely work well, because often one component will break another. Anyone who has tried to put a bunch of different Backbone views from different people together has probably experienced this pain first hand.

React is designed from the ground up to allow components to work well together.

Re: Removing User Interface Complexity, or Why React is Awesome

#32

Post by camus2 »

adamors wrote: post #8

Would you recommend using React instead of Angular for JS heavy areas of a website that is built with a server side framework (like Rails, Django etc.)? I developed a rather complex SPA with Angular recently and I cannot go back to the ghetto that is jQuery when using server side rendering.

Angular solves more than the UI problem,React on its own doesnt solve the architecturing problem , AngularJS does.

The big weakness of Angular is server side rendering,which involves heavy solutions like phantomjs,while you can render react components on the server.

Angular is not very good at rendering/managing svg either,that's a fact.

I would argue maintaining pure html templates is not that hard.

But frankly Angular solves so many problems these are minor issues.Writing complex lob applications is so easy with Angular I wouldnt want to use anything else.

The only case i'd switch back to backbone+react/vue/ractive and jquery is when i'm writing interactive experiences that are not CRUD apps.

So no,dont switch to React for the sake of switching especially since AngularJS just works. I mean people dont even bother learning javascript,they learn AngularJS ...

Re: Removing User Interface Complexity, or Why React is Awesome

#33

Post by malvosenior »

For those that haven't tried it, David Nolen's Om for ClojureScript is an excellent React framework.

https://github.com/swannodette/om

I've not used vanilla React, but Om is certainly fantastic and apparently adds a bunch of stuff that's not in the JS version.

Also, a web framework written by the guy that wrote most of the language you're using? Win!

Re: Removing User Interface Complexity, or Why React is Awesome

#35

Post by hashberry »

jlongster wrote: post #21
Flimm wrote: post #11

Please don't break the back button (Firefox and Chrome). In Firefox 29.0 on Ubuntu 14.04, the left sidebar with the text of the blog disappears and is replaced with a white space. I do not experience this on Chrome.

I just tried it on Firefox 26 on OSX and could not replicate. It has worked for everyone I've had test the page. The only thing that happens when you press back is the animation to load the right demo. There might be something buggy with how the CSS animation is using your graphics driver?

Back button breaking on latest version of Chrome/Win7 here. Scrolling up and down adds history.

Re: Removing User Interface Complexity, or Why React is Awesome

#36

Post by embwbam »

NathanKP wrote: post #5

I really like the core concepts of React, especially the way it is designed to help you organize your code into reusable components. I think the key to making React take off is building a centralized repository for components that are open source. Then building your webapp would be as easy as importing the components you need: bower install react-navbar bower install react-signup-form bower install react-sso-signin-f…

So I have a word of caution. As someone else in the thread mentioned, React is very intuitive for beginners. There's another framework I've used that was also intuitive for beginners: Backbone. The reason why Backbone is inferior to Angular and Ember is because it optimized for the beginner. Angular and Ember are optimized for the experienced developer on a large code base.

Specific to your suggestion, which I think is awesome, is the idea of composibility. The easiest kind of component to write is a large component with lots of options, like jQuery plugins. This is the hardest kind of component to use outside of its intended use case.

What makes Angular so good is that the core directives are all extremely composable. They can be used all over the place without hacking.

To make your dream come true we as component authors must design carefully to make smaller, more focused tools, rather than large components, because large components are harder to adapt to applications outside their main use case.

Re: Removing User Interface Complexity, or Why React is Awesome

#37

Post by stuki »

rdtsc wrote: post #22
zawaideh wrote: post #13

Instead of having React altogether, wouldn't it make sense to have the browser keep track of a virtual DOM, and only repaint whatever changes on its own, while managing its own requestAnimationFrame and paint cycles? P.S. I haven't looked into this in depth, just throwing an idea out there.

Yeah if the technology was in the browser that would possible. From what I understand, the core idea is that changes are applied to the virtual DOM in a very simple way (from the application point of view). Then there is another piece of code that knows how to efficiently find the diff between the vDOM and DOM and apply the changes. It seems that last part could be done by the browser.

The additional layer of redirection, at least conceptually enables the use of application specific, or pluggable, vDOMs and/or diffing strategies.

Re: Removing User Interface Complexity, or Why React is Awesome

#38

Post by tomdale »

NathanKP wrote: post #31
catshirt wrote: post #19

Earlier quoted context omitted.

what does React bring to the table here that Ember, Backbone, etc. don't? i could register my Backbone or Ember views with Bower all the same.

This comment from another HN poster does a good job of describing the difference between components in React and "components" in Ember and Backbone: https://news.ycombinator.com/item?id=7738511 Long story short, React has a much more graceful system of making the components generalized instead of the adhoc system that Ember and Backbone use. Ember and Backbone have features that are similar to components, but compone…

Can you expand more on what you mean by two Ember components will "break each other"? This isn't something I've experienced when putting components together.

Can you also expand on what React design decisions has made vs. Ember that allow components to work well together? We've spent a lot of time thinking about creating a unified interface for Ember components, so I'd like to better understand where it's broken down for you.

Re: Removing User Interface Complexity, or Why React is Awesome

#39

Post by rjknight »

zawaideh wrote: post #13

Instead of having React altogether, wouldn't it make sense to have the browser keep track of a virtual DOM, and only repaint whatever changes on its own, while managing its own requestAnimationFrame and paint cycles? P.S. I haven't looked into this in depth, just throwing an idea out there.

I may be mistaken here, but I think that the main advantage of the virtual DOM is to avoid calling across the JavaScript-native boundary. Since calling browser APIs is inherently expensive, the virtual DOM improves performance by reducing the number of calls to these APIs and/or batching them together.

Similar techniques have been used in other types of programs where performance is critical - for instance, user mode networking and user-mode thread scheduling can be quicker than the kernel-mode equivalent because it reduces or eliminates expensive system calls.

Re: Removing User Interface Complexity, or Why React is Awesome

#40

Post by polskibus »

IanDrake wrote: post #34

Tester: The UI is wrong right here... Developer: Hmm...I wonder how long it's going to take me to figure out where that HTML was generated in my javascript.

Did you see this tool ? I find it quite helpful for debugging JSX and finding the root of the problem.

http://facebook.github.io/react/blog/2014/01/02/react-chrome...

Post reply on HN