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

Show HN: X-spreadsheet – A JavaScript canvas spreadsheet for web

github.com

Post reply on HN
Print view View original

41–50 of 108 posts

Re: Show HN: X-spreadsheet – A JavaScript canvas spreadsheet for web

#41

Post by commandlinefan »

kevsim wrote: post #4

I think a description of why canvas was used would be nice in the README. My (probably naive) view is that browsers are pretty good at table-ish layouts so it’d be great to know why canvas was chosen.

I've tried to do what OP did more than a couple times using native HTML tables (for the same reason you suggest) and I've found it to be nearly impossible. Trying to force a table to keep columns one specific width and not jump around every time you change one of the cells is somewhere between an exercise in futility and not worth the pain. I think OP went the right way here.

Re: Show HN: X-spreadsheet – A JavaScript canvas spreadsheet for web

#43

Post by nojvek »

myliang wrote: post #16
kevsim wrote: post #4

I think a description of why canvas was used would be nice in the README. My (probably naive) view is that browsers are pretty good at table-ish layouts so it’d be great to know why canvas was chosen.

1 canvas performance is higher than dom rendering 2 easy to write code github.com/xspreadsheet used table

Dom gives you a lot more though. Hit testing and events, css text alignment and wrapping.

In general, unless you are doing something very simple, replicating the dom and css engine with canvas is an uphill battle.

That being said, I love that the xterm terminal uses a canvas renderer and now going to move to a webgl renderer. Terminal like UI with monospaced fonts are an excellent candidate for low level rendering.

Re: Show HN: X-spreadsheet – A JavaScript canvas spreadsheet for web

#44

Post by dartf »

williamstein wrote: post #36

This is amazing and fast. I'm complaining about it actually being easily broken only because I really wished this worked well, so I could build on it. It crashed for me on literally the very first thing I tried. I opened up the demo page, typed in 4 numbers in a column (in positions a5,a6,a7,a8), then typed "=sum(a5:a8)" in position a9, hit enter, and the demo crashed (with canvas all messed up). There's a traceback…

It looks like it's case sensitive. Worked for me with "=SUM(A5:A8)"

Re: Show HN: X-spreadsheet – A JavaScript canvas spreadsheet for web

#45

Post by y4mi »

dartf wrote: post #44
williamstein wrote: post #36

This is amazing and fast. I'm complaining about it actually being easily broken only because I really wished this worked well, so I could build on it. It crashed for me on literally the very first thing I tried. I opened up the demo page, typed in 4 numbers in a column (in positions a5,a6,a7,a8), then typed "=sum(a5:a8)" in position a9, hit enter, and the demo crashed (with canvas all messed up). There's a traceback…

It looks like it's case sensitive. Worked for me with "=SUM(A5:A8)"

i was about to say the same thing...

to anyone else wondering: you can browse the available function with the button to the right. ( SUM, AVERAGE, MIN, MAX and CONCAT )

Re: Show HN: X-spreadsheet – A JavaScript canvas spreadsheet for web

#46

Post by woogley »

tlrobinson wrote: post #28
davidy123 wrote: post #18

AFAIK (and in evidence in this case) you can't use the normal "find in page" (control-f) when using canvas. Consistency in functions like find is one of the greatest things about the browser, this approach removes it. Probably (!) an implementation will add its own find, which may be better or worse, but as browsers are best thought of as universal information vehicles, it won't automatically fit into accessibility a…

Generally I agree, however even some DOM-based implementations of spreadsheets (and similar applications with very long lists of things) break "find in page" due to them only rendering visible cells for performance reasons. For example, Google Sheets hijacks command/control-F to show their own search for this reason.

Also because Google Sheets is a canvas implementation, not DOM

Re: Show HN: X-spreadsheet – A JavaScript canvas spreadsheet for web

#48

Post by chatmasta »

Awesome job so far! This is obviously a monumental undertaking, especially since the quality of spreadsheet software seems mostly correlated with volume of features. This project looks like a great start, with an extensible architecture that will allow the project to eventually attain that "volume of features." I think my favorite line of code is this one, from package.json:

> "dependencies": {}

:)

Re: Show HN: X-spreadsheet – A JavaScript canvas spreadsheet for web

#50

Post by cm2187 »

smashface wrote: post #37
kevsim wrote: post #4

I think a description of why canvas was used would be nice in the README. My (probably naive) view is that browsers are pretty good at table-ish layouts so it’d be great to know why canvas was chosen.

If by table-ish layouts you mean using the element to render something like this then browsers might be OK at it but the woefully inadequate to do anything more than the most basic table renderings. Virtual scrolling or frozen rows/columns is a lot of manual work to do on top of a .

Plus I crashed safari on an ipad with a simple page with a table of a few tens thousand rows.
Post reply on HN