17 Mar 2011 2:39 AM #1
[OPEN-EXTJSIV-302] If you put ext-core.js at the end of the body...
If you put ext-core.js at the end of the body, some ext init process would produce unexpected result. For example, chrome definitely supports css3 BorderRadius and LinearGradient, but it will add class "x-nbr"(for 'no border radius') and "x-nlg"(for 'no linear gradient') to the body element if you put ext-core.js at the end of the body.
please test it by yourself.
24 Mar 2011 1:17 AM #2
I was also struck by this problem. It took me quite some hours of testing to find this out. Thats also a problem because it is no where documented how a html-page has to be set up for Ext JS 4.
And i dont think it matters where the script tag is added in the body, a also tried it inbetween some tags and containers and it would produce the same result.
But since ext-core.js is also 168 KB big, it would be very good from a performance perspective to be able to load it in the body.
Can this be fixed?
Edit: This also happens in PR5
Last edited by Shyru; 24 Mar 2011 at 1:18 AM. Reason: Added info about PR5
24 Mar 2011 2:15 AM #3
This is a general matter and not specific to EXT4.
Moving js to footer, you must move all js to footer, as the loading order is important always.
24 Mar 2011 5:22 AM #4
This IS a Problem of Ext JS 4.
ExtJS 3: Loading JS files in correct order in head: works
ExtJS 3: Loading JS files in correct order in body: works
ExtJS 4: Loading JS files in correct order in head: works
ExtJS 4: Loading JS files in correct order in body: works a bit, but CSS capabilities of browsers are not correctly detected. (As mentioned in first post).
ExtJS 4: Loading core in head and ext-all in body: works
24 Mar 2011 5:42 AM #5
Here is a simple example that demonstrates the problem:
24 Mar 2011 6:04 AM #6
you really should not include big js-files inside the body tag.
keep your DOM small!
S-CIRCLES Social Network Engine
24 Mar 2011 6:30 AM #7
24 Mar 2011 10:40 AM #8
It's one of the Yahoo rules (YSLOW): moving js load to footer of body.
The reason is simple: browser first loads DOM and display, then the js will be loaded.
Having all in head, browser start render after loading all files from head.
27 Mar 2011 11:10 PM #9
Yes, I agree with Shyru. Hope this can be improved by the final release of extjs 4 and enable us to reduce initial load time of a big web app.
By James Goddard in forum Ext:BugsReplies: 2Last Post: 7 Apr 2011, 5:35 AM
By wki01 in forum Ext:BugsReplies: 1Last Post: 6 Apr 2011, 9:32 AM
By jan.harmsen in forum Ext:BugsReplies: 0Last Post: 21 Mar 2011, 9:37 AM
By ojajoh in forum Ext:BugsReplies: 2Last Post: 18 Mar 2011, 2:11 PM
By ostghost in forum Ext 3.x: Help & DiscussionReplies: 3Last Post: 18 Jun 2009, 2:37 AM