June 14, 201016 yr Hi. How come sometimes a website loads its CSS code considerably later than loading the HTML code? I see this happen sometimes on websites, but now it happens on my website too (and it's not a problem of my connection, because other websites seem fine). This causes my website to look plain white with black Times New Roman fonts, etc for some seconds before it gets to look as I designed it. Why does this happen?
June 14, 201016 yr Could be a number of things, par exemple: long messy code. calling tonnes of separate images. autoplaying video. calling files from outside your server (e.g. pics from flickr). slow host server. poorly coded CSS. you have developed the ability to slow down time. If you chuck a link up, then I'm sure someone here will get to the bottom of it
June 14, 201016 yr In addition to the points above, Loading JavaScript prior to css can cause a noticeable lag, JS should always be at the end before the closing </body> tag. Throwing us a link or two would help though
June 14, 201016 yr Author Thanks to both. I checked a bit after your answers and I think its because of my JavaScript, which is specifically a Google translate tool. I conclude this because if I remove this, then my site becomes loads OK. I have this tool in a PHP include (I have made a "header" PHP include that includes the site's menu and this tool) and the PHP include I put in the <head> sections of my HTML pages (which is where it should go, right?). Therefore, the tool gets priority in loading, right? What are my options to work around this?
June 15, 201016 yr JavaScript is a single threaded language. What this means is that it performs things sequentially and not concurrently (with the exception Asynchronous calls). So anytime a piece of JavaScript is being loaded or evaluated, everything else has to wait. By loading javascript at the very end end of the document (prior to the </body> tag), it won't technically speed the page up, but because everything has already loaded (the html, css and images) it gives the illusion of a faster loading page.
June 15, 201016 yr I've seen this recommended before (placing Javascript as one of last items in code) and understand the benefits, but then seen other sources recommending always keeping js within the <head> tags. Just curious - what is everyone doing on this? cheers
June 15, 201016 yr I've seen this recommended before (placing Javascript as one of last items in code) and understand the benefits, but then seen other sources recommending always keeping js within the <head> tags. Just curious - what is everyone doing on this? cheers Loading JS at the end is a pretty new revelation (i think?), in the last few years, as JavaScript has become more predominant. Occasionally it may be needed in the head, but most JavaScript fires once the DOM has loaded, and the DOM doesn't fully load until near the end, thus placing the JavaScript in the head is offering no benefit.
June 15, 201016 yr Author Loading JS at the end is a pretty new revelation (i think?), in the last few years, as JavaScript has become more predominant. Occasionally it may be needed in the head, but most JavaScript fires once the DOM has loaded, and the DOM doesn't fully load until near the end, thus placing the JavaScript in the head is offering no benefit. I've tried removing the JV from the PHP include in the header and placing it in the body of the HTML page as you suggested. It seems to improve things as the problem disappeared, except that when I try refreshing the page (in contrast to visiting it while a different page is loaded on my browser) the problem is there again. To the other guy's question, I see no obvious side effects for putting JS in body instead of head. Thanks
June 15, 201016 yr Author Loading JS at the end is a pretty new revelation (i think?), in the last few years, as JavaScript has become more predominant. Occasionally it may be needed in the head, but most JavaScript fires once the DOM has loaded, and the DOM doesn't fully load until near the end, thus placing the JavaScript in the head is offering no benefit. I've tried removing the JV from the PHP include in the header and placing it in the body of the HTML page as you suggested. It seems to improve things as the problem disappeared, except that when I try refreshing the page (in contrast to visiting it while a different page is loaded on my browser) the problem is there again. To the other guy's question, I see no obvious side effects for putting JS in body instead of head. Thanks
June 15, 201016 yr Author Actually you'll think I'm an idiot but I haven't added the JS code just before </body> as you said, but before the last body code, which is a code for a footer. So I tried adding it as the complete last code of body, as you suggested, and now the problem completely disappeared. And there are still no obvious side-effects. Thanks a lot.
Create an account or sign in to comment