Question

I have a js file called “app.js” that I store most of my javascript in so that it can be easily minimized.

I noticed that I’ve been wrapping each of the unique functions in:

$(document).ready(function () { ... });

There are about 10 functions wrapped this way in the file. Would it better for me to instead wrap the entire app.js file inside of the $(document).ready instead of each individual function?

I feel like I might have read to avoid abusing the document, but I may just be thinking of $(this)?

Are there any performance problems in what I’m doing?

Answer 1

There shouldn’t be any performance issues with this kind of approach, but in my opinion it looks ugly and hard to read.

What i suggest is to use just one ready function to act as your init and then store functions outside ready, for example:

$(document).ready(function () { 

//check some stuff once document is ready
check_if_user_is_loggedin();

//check if user got new message
setInterval(function(){
   check_user_inbox();
}, 5000);

});


//now here store your functions like:
function check_if_user_is_loggedin(){
  if(loggedIn) return true; else return false;
}

check_user_inbox(){
  //ajax call etc...
  return messages;
}