JavaScript performance: is it better to use an object variable, or an AJAX request, for large amounts of unchanging data?

Question

So I have a large amount of data, formatted as a JavaScript object, that my website needs access to. Because this data will not be updated, I have two options: create a JavaScript file and paste in the data as a variable. Or, I can upload the data as a JSON file, and then use an Ajax request to get the data and parse it into an object.

Here's some code to demonstrate what I mean.

Option 1 (save data as a JS object variable in a separate JS file):

File object.js

let myData = {
    "1": "A",
    "2": "B",
    "3": "C",
    "4": "D",
    "5": "etc..."
};

...And so on, except my data is very large, so this file ends up being 25,000+ lines.

And I use the variable like this in some script.js

let myVar5 = myData["5"];

Option 2 (save data as JSON, do Ajax magic, and parse into JS object)

file object.json

{
    "1": "A",
    "2": "B",
    "3": "C",
    "4": "D",
    "5": "etc..."
}

And then in my script.js I do this:

let url = "/data/object.json";
$.getJSON(url, function(response) {
    let data = JSON.parse(response);
    let myVar5 = data["5"]
}

Which option would have better performance, in terms of memory, speed, storage, and other practical stuff for websites on the internet?

I wouldn't think there is much different between the js file and the ajax retrieval. Both are going to incur a network request to retrieve the data, and both are going to store the information some where in the users environment. — Taplar
– Taplar, Commented Nov 1, 2018 at 21:16
How large? If under 1m don't see why the overhead of using json parsing and stuff.. and some loaded files. — Vitaliy Terziev
– Vitaliy Terziev, Commented Nov 1, 2018 at 21:17
It's better to put it in a script as a Javascript object as you won't have to JSON.parse it then. — Mathias W
– Mathias W, Commented Nov 1, 2018 at 21:18
This question is awfully broad: "better performance, it terms of every performance measurement available". Please narrow the question to what you think are the pertinent issues. Note that the best way to test any performance is by testing the performance in your application under the conditions most likely to be used by your users. — Heretic Monkey
– Heretic Monkey, Commented Nov 1, 2018 at 21:20

Jonas Wilms · Accepted Answer · 2022-07-18 16:12:23Z

1

Which option would have better performance, in terms of memory, ...

The JSON variant is 7 bytes shorter

... speed, ...

If you don't need the JSON to render the page for the first time, loading it afterwards from a JSON file will be better as it gets loaded after the page rendered, also parsing JSON is probably faster as JS is much more complicated to parse (but were probably talking about nanoseconds).

... storage, ...

not sure how that differs from memory. Maybe both files get cached, maybe not, that depends on the browser etc.

... and other practical stuff for websites on the internet?

I wouldn't go with the hardcoded variant as my IDE would try to parse the file to hint me about its types and properties, which will slow down my development process. It doesnt parse files loaded externally.

edited Jul 18, 2022 at 16:12

answered Nov 1, 2018 at 21:32

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Noah Covey Over a year ago

Appreciate the quick reply. I had a feeling the answer would end up being...it's not gonna make a huge difference either way. But I'm very new to performance issues on the web, so I appreciate your help. Thanks so much!

Jonas Wilms Over a year ago

@noah There is not much you need to know about performance in general, there is just one golden rule

Collectives™ on Stack Overflow

JavaScript performance: is it better to use an object variable, or an AJAX request, for large amounts of unchanging data?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related