which is better, searching in javascript or database?

Question

I have a grid(employee grid) which has say 1000-2000 rows. I display employee name and department in the grid. When I get data for the grid, I get other detail for the employee too(Date of Birth, location,role,etc) So the user has option to edit the employee details. when he clicks edit, I need to display other employee details in the pop up. since I have stored all the data in JavaScript, I search for the particular id and display all the details. so the code will be like

function getUserDetails(employeeId){
  //i store all the employeedetails in a variable employeeInformation while getting //data for the grid. 
   for(var i=0;i<employeeInformation.length;i++){
        if(employeeInformation[i].employeeID==employeeId){
              //display employee details.
        }
   }
}

the second solution will be like pass employeeid to the database and get all the information for the employee. The code will be like

function getUserDetails(employeeId){
       //make an ajax call to the controller which will call a procedure in the database
       // to get the employee details
       //then display employee details
    }

So, which solution do you think will be optimal when I am handling 1000-2000 records. I don't want to make the JavaScript heavy by storing a lot of data in the page.

UPDATED:

so one of my friend came up with a simple solution. I am storing 4 columns for 500 rows(average). So I don't think there should not be rapid slowness in the webpage. while loading the rows to the grid, under edit link, I give the data-rowId as an attribute so that it will be easy to retrieve the data. say I store all the employee information in a variable called employeeInfo. when someone clicks the edit link.. $(this).attr('data-rowId') will give the rowId and employeeInfo[$(this).attr('data-rowId')] should give all the information about the employee. instead of storing the employeeid and looping over the employee table to find the matching employeeid, the rowid should do the trick. this is very simple. but did not strike me.

What possible answer can we give? First *obvious* question, what size are your records? What size are the **details**? — Elliott Frisch, Feb 12 '14 at 05:10
If you already have the information in the javascript I would avoid making another ajax call. At some point you're going to have to search the records for the appropriate ID anyway, might as well do it in javascript. — dckuehn, Feb 12 '14 at 05:11
its depend upon you number of fields, if you use javascript it will work fast , rather than to use database. Databse ajax response some times selow. — Zeeshan, Feb 12 '14 at 05:11
May possible duplicate : http://stackoverflow.com/questions/8845132/is-there-a-better-way-to-search-a-javascript-array-than-using-jquerys-each?answertab=active#tab-top — Kanhu Bhol, Feb 12 '14 at 05:15

score 1 · Accepted Answer · answered Feb 12 '14 at 05:14

I would suggest you make an AJAX call to the controller. Because of two main reasons

It is not advisable to handle Database actiity in javascript due to security issues.
Javascript runs on client side machine it should have the least load and computation.

Javascript should be as light as possible. So i suggest you do it in the database itself.

Behrad Farsi · Answer 2 · 2014-02-12T05:16:11.997

0

Don't count on JavaScript performance, because it is heavily depend on computer that is running on. I suggest you to store and search on server-side rather than loading heavy payload of data in Browser which is quite restricted to resources of end-user. Running long loops in JavaScript can lead to an unresponsive and irritating UI. Use Ajax calls to get needed data as a good practice.

edited Feb 12 '14 at 05:16

answered Feb 12 '14 at 05:10

Behrad Farsi

1,110
13
25

score 0 · Answer 3 · answered Feb 12 '14 at 05:20

Are you using HTML5? Will your users typically have relatively fast multicore computers? If so, a web-worker (http://www.w3schools.com/html/html5_webworkers.asp) might be a way to offload the search to the client while maintaining UI responsiveness.

Note, I've never used a Worker, so this advice may be way off base, but they certainly look interesting for something like this.

score 0 · Answer 4 · answered Feb 12 '14 at 05:23

In terms of separation of concerns, and recommended best approach, you should be handling that domain-level data retrieval on your server, and relying on the client-side for processing and displaying only the records with which it is concerned.

By populating your client with several thousand records for it to then parse, sort, search, etc., you not only take a huge performance hit and diminish user experience, but you also create many potential security risks. Obviously this also depends on the nature of the data in the application, but for something such as employee records, you probably don't want to be storing that on the client-side. Anyone using the application will then have access to all of that.

The more pragmatic approach to this problem is to have your controller populate the client with only the specific data which pertains to it, eliminating the need for searching through many records. You can also retrieve a single object by making an ajax query to your server to retrieve the data. This has the dual benefit of guaranteeing that you're displaying the current state of the DB, as well as being far more optimized than anything you could ever hope to write in JS.

which is better, searching in javascript or database?

4 Answers4