Search code examples
jquerydependenciescdndeferred-loading

jQuery occasionally unavailable when loaded with 'defer' from CDN


I am experiencing a very sporadic problem with jQuery when loaded from a CDN with the defer attribute in Firefox:

<script defer src="http://code.jquery.com/jquery-1.11.3.min.js" ></script>
<script defer src="http://localhost/bloomingtontutors/public/js/bootstrap-3.3.2.js" ></script>
<script defer src="http://localhost/bloomingtontutors/public/js/fuelux.js" ></script>
...

Most of the time, at least on my dev server, this works just fine. However, perhaps 1 in 5 times when I load the page I get errors from Bootstrap, FuelUX, and just about every other plugin stating that jQuery is not defined:

Failure to find jQuery

I am surprised because even in this case, if I look at the timestamps in the Firefox console, it appears that the scripts are being loaded in the correct order.

What is going on here? Is this a problem with defer, or with Firefox, or the CDN, or am I doing something wrong?


Solution

  • Any specific reason of adding defer in jQuery?

    Is its not dependent, you can try removing defer from it.

    <script src="http://code.jquery.com/jquery-1.11.3.min.js" ></script>
    <script defer src="http://localhost/bloomingtontutors/public/js/bootstrap-3.3.2.js" ></script>
    <script defer src="http://localhost/bloomingtontutors/public/js/fuelux.js" ></script>