Earlier quoted context omitted.
Why the downvotes? This person is describing a real problem with dealing with staff patent attorneys. This is real life.
If you think it's a constructive comment I'll be writing a bot that scans pages posts on HN, looks on the page for a GitHub link and complains about the license used. Doesn't matter if it's GPL, MIT, Apache, I'll just write some generic comment complaining about each license.
Show HN: React-data sheet, Excel-like spreadsheet component
41–50 of 93 posts
Re: Show HN: React-data sheet, Excel-like spreadsheet component
#42I am working with two separate clients that need excel spreadsheet functionality in a browser. I evaluated all of the existing open source projects (this wasnt available at the time) and ended up going with fix-data-table-2 (fork of facebooks fix-data-table). fix-data-table is performant and easily extendable. I was able to create an editable grid similar to googlesheets in a months worth of work. working on open sou…
React Virtualized is also great: http://www.reactvirtualized.com We (Metabase) switched from FixedDataTable to React Virtualized and are happier with it. The only major issue with it is doesn't have fixed columns/rows built in, but it's pretty easy to compose a couple Grids with ScrollSync to get that behavior ( https://bvaughn.github.io/react-virtualized/#/components/Scr... ) FixedDataTable has performance issues wi…
FYI: there was a new "MultiGrid"[1] high level component that was added in 8.9.0 [2] which helps facilitate fixed columns/rows with less boilerplate.
Though, nearly every time I've used the MultiGrid component, I've found myself eventually dropping back to ScrollSync + Grids/Lists. As the product grows in complexity, adding more complex interactions to MultiGrid is difficult as it doesn't expose all of the Grid API.
[1]: https://bvaughn.github.io/react-virtualized/#/components/Mul... [2]: https://github.com/bvaughn/react-virtualized/blob/master/CHA...
Re: Show HN: React-data sheet, Excel-like spreadsheet component
#43I have spent way too much time building grid components at my company, and I've found that if you have (1) a lot of data, (2) a dense grid, and (3) a grid that occupies most of the screen, THEN the only way to get 30+fps is to use canvas and do all the layout and drawing logic yourself.
Or you can do what google sheets does: only draw N cells at any time, and just change their contents depending on where you are scrolled to.
Re: Show HN: React-data sheet, Excel-like spreadsheet component
#44I am working with two separate clients that need excel spreadsheet functionality in a browser. I evaluated all of the existing open source projects (this wasnt available at the time) and ended up going with fix-data-table-2 (fork of facebooks fix-data-table). fix-data-table is performant and easily extendable. I was able to create an editable grid similar to googlesheets in a months worth of work. working on open sou…
React Virtualized is also great: http://www.reactvirtualized.com We (Metabase) switched from FixedDataTable to React Virtualized and are happier with it. The only major issue with it is doesn't have fixed columns/rows built in, but it's pretty easy to compose a couple Grids with ScrollSync to get that behavior ( https://bvaughn.github.io/react-virtualized/#/components/Scr... ) FixedDataTable has performance issues wi…
Re: Show HN: React-data sheet, Excel-like spreadsheet component
#45I have spent way too much time building grid components at my company, and I've found that if you have (1) a lot of data, (2) a dense grid, and (3) a grid that occupies most of the screen, THEN the only way to get 30+fps is to use canvas and do all the layout and drawing logic yourself.
canvas would be a pain to have automated test. https://github.com/openfin/fin-hypergrid/issues/540
Re: Show HN: React-data sheet, Excel-like spreadsheet component
#46Earlier quoted context omitted.
React Virtualized is also great: http://www.reactvirtualized.com We (Metabase) switched from FixedDataTable to React Virtualized and are happier with it. The only major issue with it is doesn't have fixed columns/rows built in, but it's pretty easy to compose a couple Grids with ScrollSync to get that behavior ( https://bvaughn.github.io/react-virtualized/#/components/Scr... ) FixedDataTable has performance issues wi…
Yes, react-virtualized is awesome. You can also compose and mix grid and non-grid components eg. https://jsfiddle.net/mauron85/Lyc52ac2/
That's a good point. We probably don't need to use a Grid for the header (I've wrestled with trying to hide scrollbars in headers a fair amount)
Re: Show HN: React-data sheet, Excel-like spreadsheet component
#47Earlier quoted context omitted.
Definitely not meant for large datasets. I've tried it with about 100rows and pagination. I would work with react-virtualized for datasets that large
If that is the case, then this would have avoided the real problem that needs solving here. Throwing together some rendering and keyboard handling is not game changing. Getting good performance is the hard problem that needs solving. Perhaps a future version will focus on making sure it scales?
The best option I had when building this was Handsontable. But that doesn't play nicely with react's virtual dom and immutable data.
Re: Show HN: React-data sheet, Excel-like spreadsheet component
#48Earlier quoted context omitted.
I have made several relatively large systems using Redux, and it has become a necessity in order to handle complexity of new features. Overcoming the initial cognitive load takes a week or two, but as your system grows, your productivity and code organization is greatly improved. I also recommend Immutable for handling the state object and reselect for computing your container state properties. Those technologies tog…
How does https://github.com/kolodny/immutability-helper compare to Immutable in your experience? The latter seems potentially more performant and lighter-weight; curious what its disadvantages might be (the syntax?)
FYI, there's also a bunch of other immutable update utility libs besides immutability-helper. I have a list of them in my Redux addons catalog [2].
[0] https://www.reddit.com/r/javascript/comments/4rcqpx/dan_abra...
[1] https://github.com/markerikson/react-redux-links/blob/master...
[2] https://github.com/markerikson/redux-ecosystem-links/blob/ma...
Re: Show HN: React-data sheet, Excel-like spreadsheet component
#49This looks really great, and I've got an immediate use for something like this. I've been using ag-grid for presentation of grid-based data, but this looks ideal for more-interactive views. I look forward to putting it through its paces. Somewhat off-topic, but for those working in React, have you built large systems using Redux? I'm fairly early in what is likely to ultimately be a large-ish application, and while I…
The Redux FAQ has an entry on "scaling" [0], and my React/Redux links list has a large section on Redux architecture and best practices [1].
[0] http://redux.js.org/docs/faq/Performance.html#performance-sc...
[1] https://github.com/markerikson/react-redux-links/blob/master...
Re: Show HN: React-data sheet, Excel-like spreadsheet component
#50This looks really great, and I've got an immediate use for something like this. I've been using ag-grid for presentation of grid-based data, but this looks ideal for more-interactive views. I look forward to putting it through its paces. Somewhat off-topic, but for those working in React, have you built large systems using Redux? I'm fairly early in what is likely to ultimately be a large-ish application, and while I…
If you have more than a few bits of state to manage, use multiple reducers and split your state into logical groups. Within each reducer, I use immutable.js `Record`s as the main state container. I also use Flow to strongly-type these reducers and get autocomplete and type checking of my state, but the benefits of that are mostly orthogonal to the benefits of using Redux.
You should almost never try to "denormalize" data (store the same thing in multiple places) or eg. use Redux state to initialize a component's local state. Trying to keep these in sync will kill your mental model. Instead, use selectors to keep components in sync, and if a particular view is costly to compute as a function of your state you can memoize it (I use https://github.com/reactjs/reselect for that). But that's extra complexity that should only be added in the few cases that warrant it.
I found that by organizing my code this way I was able to keep the parts of the app that I needed to make any particular change in my head easily, which did incredible things for developer velocity and happiness. :)