Question

In javascript, is there anyway to query how large css/js files are, and how large image files are? I have a unique situation where I give a user a preview of a page, and that page can either be the full page, or google’s cached text-only version of the page. The text only version loads instantly.

Don’t think there is, but figured I would ask.

Maybe Google’s index also holds information on page load times, would anyone know how to query this load time?

I want to make my app consider loading the text version of a page if it recognizes that it will take a long time to load the full page.

What I might do is search through the html string for a page, and just count the number of http requests that will be made (each css link, script tag, and img tag) via string manipulation. If there are more than X requests that would be made by inserting and loading that page’s full html for the preview, then I’ll opt for the instant text version of the page.

Answer 1

You can try using AJAX like author of an answer done in THIS TOPIC.

Making HEAD HTTP AJAX request can give you header information about given file without downloading its content.

Here is the example from the link:

var xhr = new XMLHttpRequest();
xhr.open('HEAD', 'img/test.jpg', true);
xhr.onreadystatechange = function(){
  if ( xhr.readyState == 4 ) {
    if ( xhr.status == 200 ) {
      alert('Size in bytes: ' + xhr.getResponseHeader('Content-Length'));
    } else {
      alert('ERROR');
    }
  }
};
xhr.send(null);

For more info please visit the source where author did a great job showing that solution.