This is a migrated thread and some comments may be shown as answers.

Loading order of JS & CSS files

5 Answers 553 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
rugydp
Top achievements
Rank 1
rugydp asked on 19 Dec 2014, 07:33 AM

Hello

I'm using Kendo UI with Symfony and so far it works perfectly. Only when I check my code with Kendo's chrome extension, I get some warnings like

VM235:545 Detected Kendo UI version: "2014.3.1119"
VM237:170 Kendo UI is included before jQueryVM237:170 (anonymous function)VM237:169 (anonymous function)VM237:148 req.onreadystatechange
VM237:170 jQuery does not seem to be includedVM237:170 (anonymous function)VM237:169 (anonymous function)VM237:148 req.onreadystatechange
VM237:170 Kendo CSS file kendo.bootstrap.min_2.css loaded before kendo.common CSS
VM237:170 Kendo CSS file kendo.common_3.css loaded before kendo.common CSS
VM237:170 Kendo CSS file kendo.common_2.css loaded before kendo.common CSS
VM237:170 Kendo CSS file kendo.bootstrap.min_3.css loaded before kendo.common CSS
VM237:170 The kendo.common CSS file is not included

I tried to change the load order of the files, but the warnings remain. As mentioned already, everything works fine. Should I bother?

Thank you

5 Answers, 1 is accepted

Sort by
0
Mihai
Telerik team
answered on 19 Dec 2014, 04:00 PM
Hello,

That error is triggered by our Chrome Devtools extension, which I see you have installed.  It tries to detect some common problems, but it's not perfect.  If you say that everything is working properly then it's a false alarm, please ignore it.

Regards,
Mihai
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Oleksandr
Top achievements
Rank 1
answered on 26 Aug 2016, 03:58 PM

@Mihai,

Does Telerik  support "Telerik Kendo UI Chrome Inspector" plugin? If it's not perfect, it's an opportunity to make it better.

I think there are at least two obvious bugs there which is not hard to fix:

1) it checks for filename to be equal to "kendo.common", leading to error messages "The kendo.common CSS file is not included" and a few "Kendo CSS file kendo.*.css loaded before kendo.common CSS":

var m = /(kendo[^\/]*?)(\.min)?\.(less|css)/i.exec(url);
if (m) {
    var filename = m[1], fullname = m[0];
    if (filename == "kendo.mobile.all") {
        kendo_css_mobile = i;
    }
    else if (filename != "kendo.common") {//Bug here
    //...

 

according to Kendo theme documentation, theme-specific common styles (e.g. kendo.common-material.css) can replace kendo.common.css. So you should replace the equality check to "startsWith", or extend the regex accordingly to take theme name into account.

 

2) When checking for script reference duplicates it has the following code:

var m = /(^|\/)(kendo[^\/]*\.js)/i.exec(url);
 var filename = m && m[1];
 if (filename) {
     //...
     if (kendo_js_files[filename]) {
         errors.push({
             message: "Kendo file " + filename + " is included more than once"
         });
     }

filename is always equal to "/" since first group of your regex is just a slash symbol. So if I include more then one javascript file, which name is starting with "kendo", I get an error "Kendo file / is included more than once".It would be enough to replace m[1] with m[2] to make it working.

 

It's not that good to close eyes constantly on errors in console (you get used to them soon and reduce attention to new ones) so I'm surprised such bugs could live for years.

0
T. Tsonev
Telerik team
answered on 12 Sep 2016, 11:42 AM
Hello,

I've checked with the developers on that one, and at the moment they're not convinced that check can be made reliable at all.

We might remove it altogether, bu there are too many scenarios that will yield false negatives. For example, you can bundle the styles and so on.

Regards,
T. Tsonev
Telerik by Progress
 
Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
 
0
Oleksandr
Top achievements
Rank 1
answered on 13 Sep 2016, 02:09 PM

Thank you for reply, Tsonko.

I agree it is hardly possible to make 100% reliable check. But my suggestions would make it slightly better.

Ideally, those checks should be executed not every time, but as some heuristic warnings only when requested and/or with ability to mute some messages forever for particular URL if I accept it is not an error and take the responsibility. If Mute configuration could be checked into source control and reused by the team - it would be perfect.

Removing those checks at all also could be a solution, but I appreciate time you spent on such checks and agree they are useful in many cases. They just shouldn't be so annoying.

0
T. Tsonev
Telerik team
answered on 16 Sep 2016, 02:01 PM
Hi,

I think we might be able to incorporate some "canaries" in the code and stylesheets of the library that can be used for testing the loading order.

But for the moment I think it's better off to remove them. Thanks for your input!

Regards,
T. Tsonev
Telerik by Progress
 
Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
 
Tags
General Discussions
Asked by
rugydp
Top achievements
Rank 1
Answers by
Mihai
Telerik team
Oleksandr
Top achievements
Rank 1
T. Tsonev
Telerik team
Share this question
or