Single call to JQuery plugins?

Navigation
3

I was thinking of something to call the JQuery plugins, I would call all the plugins on a single page, but loading them only if they are used.

For example:

On page X I use DataTables, then: 

if($(".dataTable") != undefined){ //se a página usar o dataTable

    if($.dataTable == undefined){ //e se ele não foi carregado

        //carregaria os arquivos necessários
        $.getScript("dataTable.min.js", function(){
            $(".dataTable").dataTable(); //e então incluiria a chamada
        });

    }

}

This would be done for all the plugins used throughout the system. That way, only the plugins used on the page would be loaded, and you would not have to include the files and the page-by-page call.

My questions are:

  • Would this be feasible?
  • Is there any way I can do something similar?

The language used is PHP.

I'm actually using the following Dashboard: link , it provides several interesting plugins, I'd like to call them all available but that would be VERY heavy to load, and loading them only on the pages they were used on would be a work (besides being horrible for maintenance).

    
asked by anonymous 18.09.2015 / 22:27

1 answer

4

When you're going to use a lot of JavaScript code on a single page, it's important to think about the performance of your application, and in order for your application to grow, it's interesting that your code is organized.

That's where the doubts begin!

  

I create several files and I'm calling the outside, without worrying about the   Request quantity?

     

I put all my codes in just one   file and minify it?

The answer to the above questions is; It depends on the need of your app!

And how will you know what your need is? You'll need to do performance testing: '(

If your case is to have the need to modularize the application, I propose to you the use of RequireJS. With it you will load and parse your JavaScript and CSS files in the background.

RequireJS uses a modular framework with Dependency Injection so that the required modules are loaded asynchronously and on demand! Doing what you requested above. Really cool neh ?? : D

You can find the RequireJS here , your documentation here and a tutorial / presentation in Portuguese here .

Note: There are several other APIs that do almost the same thing as RequireJS, I indicated the same as I use in my projects:

    
19.09.2015 / 00:34
Remove element from a linked list Problem with displaying data in ArrayList