Search code examples
javascripthtmllistviewuser-interface

Javascript driven ListView and UI libraries

My background is from mobile development and I'm quite new to Javascript so I'm quite confused about the following.

I'm trying to build a JS module that handles a list of data and displays them, so I'm looking for something like JS ListView with the following features:

  • it accepts an array of objects
  • it accepts an HTML template (in any format) to render items
  • it renders only visible views so it can handle large datasets (virtual list)
  • it can handle item click to return index/underlying object
  • it supports data modification (item add/remove)
  • it's free
  • not under GPL (as long as I understand it correctly) so it can be used in a project without the obligation to submit the code to open source
  • it supports filtering/sorting (this one is optional)

As a mobile developer those requirements seem to be pretty default to me, but I'm not able to find any suitable solution for several days already.

The options I've checked are:

  • dhtmlxList - the closest solution I've found so far, but it's under GPL v2 that requires posting the code to opensource.
  • vue: lacks virtualization/filtering
  • lists.js - great one, but I can't get how to handle item click to get the underlying object/item index
  • vlist - a good one, but doesn't handle data modifications though
  • webix - looks great, but seems to be too "paid"
  • bunch of libraries that I even can't already find links to

I believe I'm just looking in the wrong direction or using the wrong search terms as it all seems to be pretty standard and any input is much appreciated.

And sorry for stupid question, but in general, how do you handle common UI elements in JS world? Is there any comprehensive libraries of UI elements for JS which is free and not under the GPL license?

Solution

  • Just went across this Vue component:

    https://github.com/Akryum/vue-virtual-scroller

    It seems to be what I was looking for - data driven efficient list for javascript (though it's based on a Vue framework which might be not that straightforward to integrate if you don't know it)

    Still solves my problem and maybe it would be useful for someone else.