Using p:picklist to a large item list

Question

I have the current code to get a list of item using a picklist in Primefaces:

    <p:pickList showSourceFilter="true" showTargetFilter="true" filterMatchMode="contains"  label="#{msg.dataview_label_net}" id="pickListNet" converter="firstItemConverter" value="#{dataViewBean.net}" var="node" itemLabel="#{item.name}" itemValue="#{item}" />

But, I have an issue with performance at the Google Chrome to show this list.

My backend is fast, but, to show all item in Primefaces there is a long time to render. Is it possible using some pagination in a picklist or some like lazy load?

I have around 3000 items in my list. I tried a js fix to improve in here: https://code.google.com/p/primefaces/issues/detail?can=2&start=0&num=100&q=&colspec=ID%20Type%20Status%20Priority%20TargetVersion%20Reporter%20Owner%20Summary&groupby=&sort=&id=7655

but it's not working good for me.

Answer 1

The best solution for this issue is try another component like a DataTable.

I used a DataTable with a multiple checkbox and a lazy scroll to show only a partial list. My time to load reduce from 1min15s to 15s.

Answer 2

i'm using primeng and i've faced the problem of pagination, i bring data from API, by 20 elements each call, the solution was to get the list element UL of the source by className and check if scroll is in the limit, if yes i make a new call of the api with page+1 and concatenate the data