Moodle 2.9.4+ above-the fold js libraries

Moodle 2.9.4+ above-the fold js libraries

by Brandon Jimenez -
Number of replies: 4

while optimizing a Moodle 2.9.3+ site, Google PageInsights (and GTMetrix and WebPageTest) reported back to me asking me to remove the above-the-fold content.

Eliminate render-blocking JavaScript and CSS in above-the-fold content

However when diving deep into outputrequirements.lib and outputrenderers.lib, there's no way of changing the parameters of the loaded files, since I am trying to add the async/defer to the script tags on the header.

  • http://xxx/…le-min.js&rollup/1454704161/mcore-min.js
  • http://xxx/…eme/jquery.php/core/jquery-1.11.2.min.js
  • http://xxx/….php/theme_xxx/fitvids-1.1.0.js
  • http://xxx/…uery.php/theme_xxx/nprogress.js
  • http://xxx/…php/theme_xxx/unslider_1.0.2.js
  • http://xxx/…php/theme_xxx/eventswipe_0.5.js
  • http://xxx/…/theme_xxx/backstretch_2.0.6.js
  • http://xxx/…xxx/bootstrap_plugins/transition.js
  • http://xxxx/…/theme_xxx/bootstrap_plugins/tab.js
  • http://xxx/…theme_xxx/bootstrap_plugins/modal.js
  • http://xxx/…hp/theme_xxx/modernizr_2.8.3.js
  • http://xxx/….php/1454704161/lib/javascript-static.js
I'm very open to any suggestions! Thanks


                        

    
    
    
                            
    
    
                                

                                        
Average of ratings:  - 

                                        
                                

    
                            
                    

                

            

        

    
        

                

                    

                        
                
                        

                            

                                        

                                                
                                        

                                

                                        In reply to Brandon Jimenez
                                        
Re: Moodle 2.9.4+ above-the fold js libraries

                                        

                                            by Brandon Jimenez - 
                        

                                

                
                                        

                                        

                            

                
                            

                
                                

                                    

                                        
I've found that the following function is calling the included files in the `outputrequirementslib.php`
$url = new moodle_url("$CFG->httpswwwroot/theme/jquery.php");
$url->set_slashargument("/$component/$file");
However, that generates me a 
<script type="text/javascript" src="http://moodle.lallemand-elearning.com/theme/jquery.php/core/jquery-1.11.2.min.js"></script>
and i have no idea how to add the `async` tag i would like to add, since the moodle_url function only accepts parameters, which would get added at the end like ? etc etc.

Thanks

                                    

                
                
                
                                        
                
                
                                            

                                                    
Average of ratings:  - 

                                                    
                                            

                
                                        
                                

                            

                        

                    

                
        

                

                    

                        
                
                        

                            

                                        

                                                
                                        

                                

                                        In reply to Brandon Jimenez
                                        
Re: Moodle 2.9.4+ above-the fold js libraries

                                        

                                            by Damyon Wiese - 
                        

                                

                
                                        

                                        

                            

                
                            

                
                                

                                    

                                        Moodle already optimises the loading of it's own javascript libraries - but the ones you have listed above seem to be mostly added by the theme - which must be adding it's own javascript dependencies in a messy way. The recommended way is to package your javascript dependencies in a series of AMD modules as documented here: https://docs.moodle.org/dev/Javascript_Modules. This will give you the optimised loading order for the fastest page loads. 
                                    

                
                
                
                                        
                
                
                                            

                                                    
Average of ratings:  - 

                                                    
                                            

                
                                        
                                

                            

                        

                    

                
        

        

                

        

                

                

                    

                        
                
                        

                            

                                        

                                                
                                        

                                

                                        In reply to Brandon Jimenez
                                        
Re: Moodle 2.9.4+ above-the fold js libraries

                                        

                                            by Russell England - 
                        

                                

                
                                        

                                                        Picture of Plugin developers
                                        

                            

                
                            

                
                                

                                    

                                        
There is some info in this thread too - https://moodle.org/mod/forum/discuss.php?d=236809

                                    

                
                
                
                                        
                
                
                                            

                                                    
Average of ratings:  - 

                                                    
                                            

                
                                        
                                

                            

                        

                    

                
        

                

                    

                        
                
                        

                            

                                        

                                                
                                        

                                

                                        In reply to Russell England
                                        
Re: Moodle 2.9.4+ above-the fold js libraries

                                        

                                            by Brandon Jimenez - 
                        

                                

                
                                        

                                        

                            

                
                            

                
                                

                                    

                                        
I've tried a lot of those, and it was my bad to not have included that link as a referenced I've had already checked. Right now, I switched from my custom template based on an old Elegance version to the latest Elegance, and still reports me the same issues. So I have come to think the problem is evidently in the Elegance theme. I've installed minified versions of the libraries, and they load faster, but have not found a solution to make them defer load. Thanks for any suggestion.

                                    

                
                
                
                                        
                
                
                                            

                                                    
Average of ratings:  -