What is the best practice for passing large amounts of client side data to the server?

Question

I have a lot of data on the client side made up of mostly large arrays and I need to get this info back to the server and be able to parse it easily. I'm using jQuery on the front end and PHP (CodeIgniter) on the back end.

Right now I'm just POSTing one huge array using jQuery $.post. Is this a good idea or should I use several smaller ones?

Also, should I be using jQuery's ajax methods or is there something better than this?

How large are your "large arrays?" – Cᴏʀʏ Oct 14 '11 at 22:31 — Cᴏʀʏ, Oct 14 '11 at 22:31
It can be up to 1000 elements – Dan P. Oct 14 '11 at 22:51 — Dan P., Oct 14 '11 at 22:51

Cᴏʀʏ · Answer 1 · 2011-10-15T01:00:32.600

2

The maximum post size is going to be governed by the post_max_size setting in your server's PHP.INI file. The default setting is 8MB, which is a LOT of space for post data. Keep in mind there may be other factors affecting that limit (memory_limit, etc.).

In short, if your 1000 elements are pretty small in size, then a regular post with jQuery is probably an adequate approach.

edited Oct 15 '11 at 01:00

answered Oct 14 '11 at 22:37

Cᴏʀʏ

105,112
20
162
194

uɥƃnɐʌuop · Accepted Answer · 2011-10-15T00:46:18.600

If you can combine all the data into one post, that's definitely the way to go. Browsers, most notably IE (gag), will choke when you exceed too many simultaneous XHRequests to the same server. Too many at a time generally means more than 2.

Basically, best practice for sending data to the server can be summed up as: "as little as possible in as few requests as possible". How you strucutre the data is up to you.

If you're really sending a lot via jQuery, consider compressing it with something like jsend (a jQuery plugin to compress, with a PHP counterpart to decompress).

score 1 · Answer 3 · edited May 23 '17 at 11:59

1

Maybe you could try to ZIP your data, before sending it to the server. Check out this thread: JavaScript implementation of Gzip

edited May 23 '17 at 11:59

Community

1
1

answered Oct 14 '11 at 22:59

Oleg Grishko

4,132
2
38
52

lianjm · Answer 4 · 2013-04-18T09:52:52.843

0

You can use FormData:

var formData = new FormData();
formData.append('filename', filename);
formData.append('data', data);
$.ajax({
    url: "FileUploadServlet",
    type: "POST",
    data: formData,
    cache: false,
    contentType: false,
    processData: false});

edited Apr 18 '13 at 09:52

answered Apr 18 '13 at 09:33

lianjm

21
4

score 0 · Answer 5 · edited May 23 '17 at 11:59

0

Darin answered similar question here: Sending large data to server

Use a POST HTTP verb instead of GET:

$.ajax({
    url: '/foo',
    type: 'POST',
    data: { value: someVariableThatCouldBeHuge },
    success: function(result) {
        // TODO: process the results
    }
});

or the equivalent:

$.post('/foo', { value: someVariableThatCouldBeHuge }, function(result) {
    // TODO: process the results
});

Pekka suggested to serialize data and break into chunks if post is not an option: Sending a large parametrized data set as a GET request

edited May 23 '17 at 11:59

Community

1
1

answered Oct 14 '11 at 22:42

jeff musk

1,032
1
10
31

That's exactly what I'm doing. – Dan P. Oct 14 '11 at 22:52

What is the best practice for passing large amounts of client side data to the server?

5 Answers5