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

Show HN: Datagridxl.js – No-nonsense fast Excel-like data table library

datagridxl.com

Post reply on HN
Print view View original

51–60 of 136 posts

Re: Show HN: Datagridxl.js – No-nonsense fast Excel-like data table library

#51

Post by robbiejs »

mkl wrote: post #8
robbiejs wrote: post #2

Hello HN, I’m Robbert, the creator of DataGridXL.js. DataGridXL is a free (and commercial) editable data table library written in ES6. My goal is to develop the most performant & user-friendly spreadsheet-like data table out there: - It has zero dependencies. You don’t need any framework to use DataGridXL. - It is lightweight (~200kb) and easy to use. It does not even require messing with CSS. - It has its own Virtua…

That title flashing "1 new message" nonsense is incredibly distracting. Is there a UI way to quickly sort by a column?

Hi. Agree with the flashing message, I haven't found a way to turn it off yet.

I am actually working on a sort feature at this moment and I expect to release at the end of the week.

Re: Show HN: Datagridxl.js – No-nonsense fast Excel-like data table library

#52

Post by robbiejs »

MuffinFlavored wrote: post #41
mkl wrote: post #8

Earlier quoted context omitted.

That title flashing "1 new message" nonsense is incredibly distracting. Is there a UI way to quickly sort by a column?

sorting + filtering would be awesome too

Thanks for your suggestions. Sorting will be implemented very soon, perhaps this week.

I haven't really thought of filtering yet, but it's very likely that one day we'll introduce a filter-option. However, at this moment I cannot say when.

Re: Show HN: Datagridxl.js – No-nonsense fast Excel-like data table library

#53

Post by robbiejs »

pugio wrote: post #17
robbiejs wrote: post #2

Hello HN, I’m Robbert, the creator of DataGridXL.js. DataGridXL is a free (and commercial) editable data table library written in ES6. My goal is to develop the most performant & user-friendly spreadsheet-like data table out there: - It has zero dependencies. You don’t need any framework to use DataGridXL. - It is lightweight (~200kb) and easy to use. It does not even require messing with CSS. - It has its own Virtua…

I have been looking for years for something to replace a custom rendered excel-like table I have. The table has a complex layout: - One fixed top row (date), two or three fixed columns on the left. - Data are rendered horizontally; the number of rows does not change, but the number of columns can be in the hundreds. Does your library support column-oriented data like this (you mention "60+" columns)? Does anyone know…

Hi,

The component actually did have fixed/frozen columns/rows in an earlier version, but I decided to leave out the feature for a v1. I plan to reintroduce it after more popular features have been implemented.

DGXL is able to handle hundreds of columns. The reason why it says 60+ specifically is that, according to browser-vendors like Mozilla, a DOM node should ideally not have more than 60 child nodes - for performance/memory reasons.

Re: Show HN: Datagridxl.js – No-nonsense fast Excel-like data table library

#55

Post by robbiejs »

lukeholder wrote: post #29
robbiejs wrote: post #2

Hello HN, I’m Robbert, the creator of DataGridXL.js. DataGridXL is a free (and commercial) editable data table library written in ES6. My goal is to develop the most performant & user-friendly spreadsheet-like data table out there: - It has zero dependencies. You don’t need any framework to use DataGridXL. - It is lightweight (~200kb) and easy to use. It does not even require messing with CSS. - It has its own Virtua…

Vote for simple formulas like sum etc.

Maybe one day, but no promises. I did experiment with formulas in an earlier version, and it was promising, but there's a lot of things that need to be exactly right.

Also, I need to draw a line somewhere. I cannot turn the product into a spreadsheet, as I have chosen for performance as my main feature, which means it cannot do things like merged rows, merged columns, etc.

So if I'd implement formulas, people might expect more & more features, which I then cannot deliver...

(There are products out there that have basic formula support.)

Re: Show HN: Datagridxl.js – No-nonsense fast Excel-like data table library

#56

Post by robbiejs »

rowsncolumns wrote: post #35
coopsmgoops wrote: post #33

Earlier quoted context omitted.

Genuinely curious. Why go with canvas over HTMl elements? Isn't it reinventing the wheel a bit for things like input fields

Sure. Input elements are still HTML FYI, we dont use canvas to simulate that. I have been working with DataGrids for more than 4-5 years. So I consider myself at a position to compare HTML and Canvas performance We went with Canvas because of the following reasons 1. Scroll performance is much better than HTML 2. Drawing on canvas is cheap compared to modifying DOM or attributes 3. Streaming updates are much smoother…

I wish you best of luck. I understand your decision to go with canvas. I have experimented with canvas quite a bit as well, as I could not get HTML DOM performance quite right initially.

How I solved this for DataGridXL:

Only columns are DOM nodes. Rows are not actually nodes, but values are spaced vertically using CSS and with a simple newline (\n) character in between. The grid lines are just that: they're grid lines that are repositioned using CSS animation when the user is scrolling.

This means that when a user is scrolling, the DOM does not have to update by, let's say 20 rows x 10 columns = 200 DOM nodes. Only 10 column DOM nodes need to be redrawn.

That's how DGXL works with DOM & HTML but is still in many cases faster than a canvas implementation. Plus it still is accessible. Try zooming the page or use CTRL+F. You can find and select any (visible) value inside the data grid. No problems there.

Re: Show HN: Datagridxl.js – No-nonsense fast Excel-like data table library

#57

Post by robbiejs »

xyzzy_plugh wrote: post #37
rowsncolumns wrote: post #24

Another plug - https://rowsncolumns.app It's a canvas based SpreadSheet. The Grid works with React and Konva - https://konvajs.org/ You can see the demo here - https://rowsncolumns.app/demo And a whole bunch of features and upcoming roadmap - https://rowsncolumns.app/#features We are launching formula support with Web Workers soon.

On mobile it _looks_ like a spreadsheet but seems entirely unresponsive to, for example, selecting a cell.

For a moment I thought you were talking about DataGridXL, but your comment is on the canvas grid?

I actually made quite an effort to make DGXL work on touch screens. It's not there yet. It's basically read-only on touch for now, but you should have no problem selecting cells and copying values.

Re: Show HN: Datagridxl.js – No-nonsense fast Excel-like data table library

#58

Post by robbiejs »

randtrain34 wrote: post #3

How does that compare to https://github.com/paulhodel/jexcel ?

Great question. I think Jexcel is a great effort. There's also Handsontable. I think Jexcel and Handsontable are pretty similar: they have a lot of features, but also a lot of the same errors: performance suffers and sometimes the DOM or CSS gets messed up after a user drag operation.

I wanted to tackle the performance & reliability issues mainly. My thinking is that most users won't probably need formulas, merged cells, HTML markup. DGXL really shines for larger data sets. Excellent for numeric data input specifically.

Also, I think it implements Excel/G. Sheets controls a little better: when your users are Excel-experts, but keyboard controls work just a little different then they're used to, that's quite annoying. My goal is to stick as best as I can to the original controls.

Re: Show HN: Datagridxl.js – No-nonsense fast Excel-like data table library

#59

Post by robbiejs »

iopuy wrote: post #15
kanobo wrote: post #9

Earlier quoted context omitted.

jexcel is great, it has more features (sorting, formulas, colors, etc)... but those same features are not very performant with many (>1000) rows since each cell is a html table cell. datagridxl looks promising if you need to display lots of data. I'm a fan of any open source data grid library so I'm happy both exists.

are both open source? click the buy button on datgridxl.js, only 800 euros!!

Hi, you can use DGXL for free, as long as you keep the branding link visible and have no need for support.

Re: Show HN: Datagridxl.js – No-nonsense fast Excel-like data table library

#60

Post by robbiejs »

hadrien01 wrote: post #6

So from what I understand this works by displaying data on a JS canvas. How does that work for accessibility? Do screen-readers read the data as if it was an html table?

Hi, it does not use canvas. It uses HTML. Sure, DGXL contains one or two canvas elements, but they're used for measuring strings length and drawing cell background colors.

The actual values are all in HTML. The benefit is that you can use CTRL+F and values are found and selected. You can zoom the page and text will remain crisp.

The values are not in a tag however. values are sorted y,x (rows first, columns second). DGXL sorts values x,y (columns first, rows second). I have to admit that I am not sure what that means for screen readers: I am not an accessibility-expert at this stage. What I do know is that HTML is better than canvas by default in this regard.

Post reply on HN