Load Local Array As Ajax File To Improve Performance

I am using DataTables to create a table, but it is loading awfully slow. I have approx. 9000 records that need to be processed from an SQL server (php is not an option). I am using

Solution 1:

This is not a complete answer, but a quick improvement is to populate your list as a single statement instead of 9000.

var InternationalSet = [
<c:forEach items="${InternationalList}" var="e" varStatus="status">
   [ '',
     "${e.getStoreId()}",
     "${e.getOrderPhone()}",
     "${e.getAddress1()}",
     "${e.getCity()}",
     "${e.getState()}", 
     "${e.getZip()}", 
     "${e.getMgrName()}", 
     "${e.getFranchiseeName()}",
     "${e.getOrglvl6Descr()}",
     "${e.getCommDescr()}", 
     "${e.getOrglvl8Name()}",
     "${e.getLatitude()}",
     "${e.getLongitude()}"
  ] <c:if test="${!status.last}">,</c:if>   
</c:forEach>
];

You can remove some of the new lines from the above to compactify it a little. Minor changes to the script also builds a single JSON object which you can return in an AJAX response to populate the table.

{
"data": [
<c:forEach items="${InternationalList}" var="e" varStatus="status">
....
</c:forEach>
]
}

If you are returning the data in sections from the server, your response would be changed to

{
"draw": ${param.draw},
"recordsTotal": ${yourTotal},
"recordsFiltered": ${yourFiltered},
"data": [
<c:forEach items="${InternationalList}" var="e" varStatus="status"
   begin="${param.start}" end="${param.start + param.length}" >
....
</c:forEach>
]
}

(You will have to add some range/value checking on the param values)