Requirejs domReady plugin vs Jquery $(document).ready()?

Question

I am using RequireJS and need to initialize something on DOM ready. Now, RequireJS provides the domReady plugin, but we already have jQuery\'s $(document).ready()

Answer 1

An attempt at answering your main question:

Why does requirejs provides a domReady plugin when we can have jquery's $(document).ready();?

They do two different things, really. RequireJS' domReady dependency signifies that this module requires the DOM to be completely loaded before it can be run (and can therefore be found in any number of modules in your application if you so desire), while $(document).ready() instead fires off its callback functions when the DOM is done loading.

The difference may seem subtle, but think of this: I have a module that needs to be coupled to the DOM in some way, so I can either depend on domReady and couple it at module definition time, or put down a $(document).ready() at the end of it with a callback to an init function for the module. I'd call the first approach cleaner.

Meanwhile, if I have an event that needs to happen right as the DOM is ready, the $(document).ready() event would be the go-to, since that does not in particular depend on RequireJS being done loading modules, provided the dependencies of the code you're calling it from are met.

It's also worth considering that you do not necessarily use RequireJS with jQuery. Any library module that needs DOM access (but does not rely on jQuery) would then still be useful by using domReady.