Prevent incomplete loading of css and javascript files - html

I have the problem that some webpages on my webserver are sometimes not loaded completely, for instance it seems that css and javascript are not loaded and therefore the website appears unformatted. Is there a way to force the complete loading of the css and javascript files so that these errors can be prevented. Maybe some progress loading can be shown while the whole website is loaded. I'm sure this is a solved problem but I need some directions where to look for implementations.
Regards,
Juan

Is it just that the page takes a long time to load but gets there eventually? If so, you can wait for the onLoad event to fire before starting up your JS code. If the page never gets there, well, that's some kind of server or connection problem, as thirtydot says.

Related

How to stop a CSS file from loading again?

I have a very simple site and all the CSS for it is written in one file, so whenever any page is requested the CSS file is loaded. So I was wondering if there is someway, that I can tell the browser to use the same file it loaded a second ago instead of requesting it again.
I assume you have the css loaded externally then? I don't believe there is a way to natively do that unfortunately. But, if you're proficient in javascript, I suppose you could save all of the css file as a string using the localStorage property in the browser. Then request the data you want loaded specifically per site.
Local storage persists after the browser is closed, so it would only need to be loaded once!

Automatically update and scroll to the end a page showing raw text

I have got a desktop application which logs into a file, opening a file called application.log each time it wants to log something, appending text and then closing it again.
I would like to create a html page showing the content of the file and automatically showing the changes.
How can I achieve this? I think that refreshing the page is not a good idea because this is not instantaneous. Maybe I need something always going in the background, constantly monitoring the file.
Or maybe when my program changes the file it should somehow notify the webpage that the file had changed, making it update the content?
You can’t do dynamic things in HTML. HTML is just a mark up language.
I haven’t done that before, but I would try to achieve it with Java Script and the reload() function every time you logged sth.
I cloned this https://github.com/Chainfrog-dev/async_flask_2, it is a Python module which communicates with a web page using sockets.
I made the obvious modifications to the code and I ended up with a terminal-style logger which automatically updates its content without the need to refresh the page.

Leaving a asp.net application then hitting back isn't working

I have an asp.net application and am experiencing a surprising behavior.
Whenever I leave one particular page in the application, The back button starts behaving in the following way:
hitting back (which should take me to the offending page) makes the current screen flash - as if going back - but then reloads the current page instead.
It doesn't matter how I leave that page I see this effect. If I click on a link on the offending page and hit back, same thing. If I am on the offending page and type in a new address in the address bar, then hit back, same thing. It doesn't matter if I go to another page in the same application or an external application, same thing.
I tried using fiddler to see what is going on, and all that I see when I hit back, is all of the external links (css, jquery, etc) get reloaded on the current site. I don't see a 320 from the offending page at all.
Note: disabling Active Scripts hides this symptom.
Most likely the external page either is tampering with your browser history (via JS) and setting the same page as the last page in your history when the site is being loaded, or it has another page set between that redirects to the page you are seeing, and when you click back you are loading the redirect page again.
Try to disable JavaScript and see if it is still happening. If yes, try to analyse the first load of the page with fiddler and see if another page is redirecting you.
False alarm:
This is an inherited project and I hadn't read all the code. There is javascript that says:
<script type="text/javascript">
if (window.history.forward(1) != null)
window.history.forward(1);
</script>
Problem solved.

Browser HTML source incomplete, even when full source verified as served

I'm experiencing the strangest problem. I have a development site page that for some users is rendering incomplete in all browsers. Viewing the source shows it to be cut off at a certain point, with no closing body or html tags anywhere. Logging the response body on the server when this page is being served to them, however, shows it to be complete. At first I thought it may be a network issue, but this problem has been experienced in multiple locations located far from either other. Just as strange, if the user loads the same complete source code as a static page instead of a dynamic one, the page renders correctly every time. I'm using Rails 2.3.8 w/ Rack 1.1.3, Passenger 3.0.9, and Nginx 1.0.6 FYI. Any suggestions? Thanks.
Problem solved. There was a large JSON object assigned to a variable on the page that was used to by the autocomplete methods of various fields. After removing this on-page JSON object and loading it from another URL using the jQuery getJSON() method, the problem went away. Definitely a rare issue, but hopefully this will help someone else.

DOMContentLoaded/load (event), how to increase the speed.

I'm trying to do everything I can to increase the load speed of my pages, and in particular the ajax loaded components.
In firebug, my out put looks like this
I'm not entirely sure if I'm reading this correctly, but it is either +2.19s for DOMContentLoaded (or it mayonly be .8 if we are supposed to subtrack that from the waiting response).
But then 4.67s for the 'load' (event).
Both of these seem like significantly long loading times.
I haven't been able to figure out what would cause these sorts of times.
These stats are from loading a straight html page which I normally load via ajax.
But this is just the HTML. No javascript in the page, and the page is being loaded directly, not through an ajax request.
However when i do load this page via ajax, I recognize a significant delay while the page attempts to load.
Any suggestions?
I've been looking through the html in IE debugbar, and it all looks surprisingly clean.
There are 30 images in the page. Could that be what the 'load' event is waiting for? And if so, is there any way to speed this up?
In particular, as the user will never load this page directly, but only via an ajax request, is their a way to improve the page loading performance in ajax. The problem isn't with the ajax loading script, but with the html page specifically.
----------------------EDITTED------------------------------
The results of the page are loaded into a jquery cycle where multiple images are visible at a single time, so using lazyloader provides a pretty horrible user experience. (assuming it is the images which is causing this problem).
Those firebug stats are telling you that:
It takes 2.1 seconds from the time you started the request for your server-side code to start returning a response
It then takes 19ms to download the response (i.e. the HTML)
71ms or so after that, the DOMContentLoaded event fires
After the page has completely loaded (after the images are all downloaded), the load event is fired.
DOMContentLoaded fires as soon as the DOM is ready. The load event waits until the whole page is loaded (including any external resources like images)
Most of the time in your request (other than downloading the images) is spent waiting for the server to construct the HTML. Maybe your server-side code can be optimized to run faster?