• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Paul Clapham
  • Ron McLeod
  • Bear Bibeault
  • Liutauras Vilda
Sheriffs:
  • Jeanne Boyarsky
  • Junilu Lacar
  • Henry Wong
Saloon Keepers:
  • Tim Moores
  • Stephan van Hulst
  • Jj Roberts
  • Tim Holloway
  • Piet Souris
Bartenders:
  • Himai Minh
  • Carey Brown
  • salvin francis

What is the optimum order to include JS and CSS?

 
Ranch Hand
Posts: 96
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I need a friendly place to ask this question. What is the optimum order to include js and css. I have also had many issues that have boiled down to the incorrect order of plugins (especially Summernote). I have the following at this time:


If I could have advice on this please I will be able to optimise all my other html pages.

Kind regards,

Glyn
 
Saloon Keeper
Posts: 12488
269
  • Likes 2
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Hello Glyn,

Instead of using script tags like that, I recommend using a dependency manager and module loader. For instance, use NPM in your project to declare a dependency on Summernote, and then use it in one of your webpage's scripts like this:

This makes sure that your dependencies aren't declared in the global scope, and will just be available for the scripts in which you need them. Their transitive dependencies are also automatically loaded.

The only script you need to load in the <head> of your page is an implementation of AMD (the module loader, a.k.a. the thing that provides the require() function). I believe you can use RequireJS for this.

For more information, I suggest you look up an NPM and an AMD tutorial, and that you Google around to see if Summernote has a module available that's compatible with AMD.
 
Saloon Keeper
Posts: 22784
153
Android Eclipse IDE Tomcat Server Redhat Java Linux
  • Likes 2
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Here's something that everyone looking for page performance should be aware of. Most modern web clients do not make their requests serially. In other words, fetch CSS #1, JS #1, CSS 2, and so forth. Instead they run multiple requests in parallel. Last time I checked Firefox, for example, it would have up to 10 requests in process by default.

And, since network processes are indeterminate in duration, that means that the exact order in which they complete is also indeterminate.

So when you absolutely positively must assure that some things are there when other things need them, you have two choices:

1. Have the need-er include logic that causes it to wait on the need-ee.

2. Set up a dependency chain as Stephan demonstrated so that the need-er doesn't begin to get get fetched until the need-ee is ready for it.

Either option is good. Which one is best for your situation may vary.

This sort of thing dates way back. Nothing more annoying that trying to manipulate a DOM that hasn't been fully build yet.
 
Glyndwr Bartlett
Ranch Hand
Posts: 96
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thank you I will read up on this.

Kind regards,

Glyn
 
With a little knowledge, a cast iron skillet is non-stick and lasts a lifetime.
reply
    Bookmark Topic Watch Topic
  • New Topic