CODEWITHSUNDEEP
javascripthtmlcss
Misha Moroshko
Misha Moroshko

Reputation: 171479

JavaScript and CSS order

I have an HTML file which is linked to CSS file and also to JavaScript file.

Is JavaScript executed first and then the CSS is applied, or vice versa ?

Is there any way to change the order ?

Thanks !

Upvotes: 6

Views: 10813

Answers (3)

Mathew
Mathew

Reputation: 8289

Yahoo's research into speeding-up page loading times should be very helpful, and they explain things much clearer than I can.

http://developer.yahoo.com/performance/rules.html

Upvotes: 2

Pointy
Pointy

Reputation: 413996

It's generally considered a good idea to import your scripts as late as possible, and your stylesheets as early as possible. If possible, in fact, you should stick all your script imports at the very end of the <body>. I find that problematic when there are components pulled into the page that want to be able to drop little script blocks that reference jQuery (for example).

If your stylesheets are first, that helps make sure the browser applies styles before showing anything to the user. Conversely, by including scripts last, you defer that potentially slow script processing until after the point where the user gets to see something on the screen.

Upvotes: 8

Quentin
Quentin

Reputation: 944442

The JavaScript gets executed when the <script> element is parsed. Some of the JS might set up event handlers to run some JS when events happen.

CSS is applied to the live DOM. Changes to the DOM get CSS applied automatically. Changes to CSS apply to the whole DOM automatically.

Upvotes: 4

Related Questions