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

Flipboard releases React Canvas

github.com

Post reply on HN
Print view View original

131–136 of 136 posts

Re: Flipboard releases React Canvas

#131

Post by comex »

philnash wrote: post #125

Out of the box browser features that have been removed/destroyed by the quest for 60fps: * Copy/paste (holding on an article gives the options to email or report) * Pinch to zoom * Double tap to zoom (opens links instead) * iOS swipe forwards and backwards (renders the page swipe animation twice, at 60fps I guess) * iOS Reader View (go on, try it, I laughed) And most importantly * Any sort of accessibility 60fps does…

60fps does matter. We've just all been taught that 60fps and sane use of CSS and the DOM (as currently standardized), so as to allow browser features to work properly, are mutually incompatible... which might be true. Using canvas certainly sucks for the reasons you describe; I wouldn't do it for more than a proof of concept. But long term, do we really need to hang the success the whole Web on the backs of some old and very ugly APIs? Can't someone come up with an alternative?

Re: Flipboard releases React Canvas

#132

Post by aaronyo »

insin wrote: post #119
aaronyo wrote: post #107

Big fan of React. For others using it, why use JSX instead of just doing everything in js? In other words, why is HTML like this: Lorem ipsum... Preferable to something like this (which can easily be done with some helper methods wrapping the verbose React DOM methods): $group({styles: style.group}, $image({styles: image, src: 'http://...'}), $text({styles: style.text}, 'Lorem ipsum...')); No pre processing step requ…

The XML-like syntax is just less work, mentally and physically: no need for commas between props, the props object and children, no need to carefully manage all those commas when editing, adding, deleting, moving and removing stuff later on, plus the closing tag syntax makes nesting nicer by providing context via the tag name; all of which adds up to make it more pleasant to work with. The second approach is what I w…

Thanks for sharing the examples -- really appreciated.

I'm not convinced that HTML is preferable to other representations of the DOM, particularly for representing UI's and applications (rather than documents). The clojure script wrappers for React I've seen seem to believe, for example, that lisp is better at representing the DOM than HTML and I tend to agree. Especially since any configured IDE should be pointing out missed commas and have rainbow parens.

One thing that is different between your examples and the DOM I've been creating with React is that I tend to make custom tags, and I don't end up with tons of repetitive looking stuff. Your last example is quite readable to my eyes, and would be even more so if perhaps decomposed into some helper functions and, of course, if loops were used and the DOM was populated from some data structure.

Re: Flipboard releases React Canvas

#133

Post by danpeddle »

It's a shame that so many custom android roms either do not or have only very limited support for hardware acceleration in the browser. I do not know what percentage of users would fall into this category, but worth keeping in mind.

Re: Flipboard releases React Canvas

#134

Post by artursapek »

hamxiaoz wrote: post #130
artursapek wrote: post #36

I'm building a complicated canvas app[1] for visualizing Bitcoin markets. I resorted to building my own framework on top of canvas, exactly for performance reasons. It's fast, but as a framework I was never too happy with it because it's a little half-baked. More recently I found and fell in love with React for other frontend work, and use it exclusively now for any view-related work. I might have to go back and rewr…

Looks awesome! Can you share any architecture info? The frontend is built on d3+reactjs+jquery, how about the backend?

Go and Redis

Re: Flipboard releases React Canvas

#136

Post by lefnire »

woah wrote: post #31
megaman821 wrote: post #12

This looks really neat. How does this compare to Famo.us, which also claims at have smooth animations at 60 fps?

Famo uses the DOM, by encoding matrix transforms to strings and sticking them into the attributes of DOM nodes.

How about in terms of adoption, momentum, team, performance, etc? Any insights / predictions on how Famo.us might stack up _against_ react-canvas?
Post reply on HN