Six Data Grid Implementations Later, I Finally Learned to Build Components Right

https://hackernoon.imgix.net/images/qVpYfvMefJd8b1LfKNiRyxDzaL32-bp03dc5.gif

Plain JavaScript. Then Angular. Then React. Then Vue. Then Blazor. Now Svelte. Same component every time: a data grid. Rows, columns, click to sort, drag to resize, select a range, keyboard arrows that do the thing people expect, virtual scrolling so it does not die at 100k rows. Six implementations, six reactivity models, six sets of idioms I had to learn well enough to argue about.

You would think by the third one I had it figured out. I did not. Each port taught me something, but the thing that actually stuck, the lesson that survived across all six, did not show up until I was deep into the Svelte version (svgrid, if it matters, though it really does not for this story). And it was a little embarrassing when it landed, because it had nothing to do with grids and nothing to do with any particular framework. It was...

Copyright of this story solely belongs to hackernoon.com. To see the full text click HERE

Read more