Ravi Raj's Blog: 11/1/12

Wednesday, November 7, 2012

Asynchronous JS loading without blocking onload

Asynchronous JS is best way to load js file in your HTML page but it still blocks window.onload event (except in IE before version 10).

checkout here how onload blocked even we use asyn js loading techniques

http://www.stevesouders.com/blog/2012/01/13/javascript-performance/

http://calendar.perfplanet.com/2010/the-truth-about-non-blocking-javascript/

So here is another solution for same :-)

create an iframe without setting src to a new URL. This fires onload of the iframe immediately and the whole thing is completely out of the way

style the iframe to make it invisible

get the last script tag so far, which is the snippet itself. This is in order to glue the iframe to the snippet that includes it.

insert the iframe into the page

get a handle to the document object of the iframe

write some HTML into that iframe document

this HTML includes the desired script

Code:

(function(url){
var iframe = document.createElement('iframe');
(iframe.frameElement || iframe).style.cssText = "width: 0; height: 0; border: 0";
var where = document.getElementsByTagName('script');
where = where[where.length - 1];
where.parentNode.insertBefore(iframe, where);
var doc = iframe.contentWindow.document;
doc.open().write('<body onload="'+
'var js = document.createElement(\'script\');'+
'js.src = \''+ url +'\';'+
'document.body.appendChild(js);">');
doc.close();
})('http://www.jspatterns.com/files/meebo/asyncjs1.php');

Issues:

1. Avoid SSL warnings: iframe.src defaults to “about:blank” in IE6, which it then treats as insecure content on HTTPS pages. We found that initializing iframe.src to “javascript:false”.

2. Avoid crossdomain exceptions: anonymous iframe access will throw exceptions if the host page changed the document.domain value in IE. The original Meebo code falls back to a “javascript:” URL when this happens.

3. The script (asyncjs1.php) runs is in an iframe, so all document and window references point to the iframe, not the host page.There's an easy solution for that without changing the whole script. Just wrap it in an immediate function and pass the document object the script expects:

(function(document){
document.getElementById('r')... // all fine
})(parent.document);

4. The script works fine in Opera, but blocks onload. Opera is weird here. Even regular async scripts block DOMContentLoaded which is a shame.

seems below code solves our problem .. try it and let me know the results ...

https://github.com/pablomoretti/jcors-loader

Tuesday, November 6, 2012

PHP's register_shutdown_function

PHP has approx. 5800 functions defined in global space .. Uff .. that is one cause that people does not consider it as thoughtful language but these APIs work as strong enough tool to accomplish various task and it provide tremendous functionality to end user.

Today we will discuss one magical function named "register_shutdown_function".

function allows you to execute a block of code whenever your script ends for any reason.
Whether your page exit()s or die()s or just finishes, a developer has a hook to run whatever code he/she deems necessary. And not just one function either… you can use this call to register as many shutdown functions as you want, and they will get executed in the order that they get applied. But of course, you must be careful: PHP will happily give you more rope than you will ever need to hang yourself. A lot of people may consider the use of this function to be magic, and you’ll want to be very clear that what you’re doing is documented.

Use of this function is very straight-forward.

I just tested with Apache, PHP being used as Apache module. I created an endless loop like this:

class X
{
function __destruct()
{
$fp = fopen("/var/www/dtor.txt", "w+");
fputs($fp, "Destroyed\n");
fclose($fp);
}
};

$obj = new X();
while (true) {
// do nothing
}

Here's what I found out:-

pressing STOP button in Firefox does not stop this script
If I shut down Apache, destructor does not get called
It stops when it reaches PHP max_execution_time and destuctor does not get called

However, doing this:

function shutdown_func() {
$fp = fopen("/var/www/htdocs/dtor.txt", "w+");
fputs($fp, "Destroyed2\n");
fclose($fp);
}

register_shutdown_function("shutdown_func");

while (true) {
// do nothing
}

shutdown_func gets called. So this means that class destuctor is not that good as shutdown functions. :-)

Enjoy !! :-)