V8 vs. Spidermonkey

About a year ago I decided to go with v8js to use javascript code within php because it was so much easier to handle.

Today I benchmarked a problem related to the v8 engine and just out of curiosity I ran the same test with Spidermonkey.

A simple A/B Test:

  • A = define a JS Function and call it it in a loop
  • B = define a JS Function once and call it in a loop

The results for V8 were:

Runs 10 100 1.000 10.000 100.000
A 0.0048ms 0.0018ms 0.0159ms 0.4257ms 4.9063ms
B 0.0004ms 0.0011ms 0.0072ms 0.1733ms 1.8506ms

It was not really surprising that the one-time-definition was faster.
I tried exact the same with Spidermonkey:

Runs 10 100 1.000 10.000 100.000
A 0.0016ms 0.0276ms 0.2141ms 1.8415ms 18.483ms
B 0.0011ms 0.0039ms 0.0713ms 0.8591ms 8.4125ms


Huge difference compared to V8!


Here’s the test code:

V8 Test:


 0; $i-- ) {
$js->executeString($jsFunc, 'Test.Context');
$js->executeString("myTestFunc();", 'Test.Context');
}
echo "#1: " . (mstime() - $start)." ({$runs} with re-definition)";
unset($js);
$start = mstime();
$js = new V8Js('Test');
$js->executeString($jsFunc, 'Test.Context');
for ( $i = $runs; $i > 0; $i-- ) {
$js->executeString("myTestFunc();", 'Test.Context');
}
echo "#2: " . (mstime() - $start)." ({$runs} without re-definition)";
unset($js);
echo "

"; } function mstime() { list($usec, $sec) = explode(" ", microtime()); return ((float)$usec + (float)$sec); }


Spidermonkey Test:


 0; $i-- ) {
$js->evaluateScript($jsFunc, 'Test.Context');
$js->evaluateScript("myTestFunc();", 'Test.Context');
}
echo "#1: " . (mstime() - $start)." ({$runs} with re-definition)";
unset($js);
$start = mstime();
$js = new JSContext('Test');
$js->evaluateScript($jsFunc, 'Test.Context');
for ( $i = $runs; $i > 0; $i-- ) {
$js->evaluateScript("myTestFunc();", 'Test.Context');
}
echo "#2: " . (mstime() - $start)." ({$runs} without re-definition)";
unset($js);
echo "

"; } function mstime() { list($usec, $sec) = explode(" ", microtime()); return ((float)$usec + (float)$sec); }



Detect iPad using Javascript

I’ve got some people asking for a simple Javascript-Detection for iPad’s.

It’s simple, just take a look at the browser identification:

 

Example:


It basically searches in the browser information for any occurence of “iPad” and returns true if found.

Here’s an example of Safari’s identification on the iPad:

Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/533.17.9 (KHTML, like Gecko) Version/4.0.5 Mobile/7B367 Safari/6531.22.7

Detecting iPad Orientation in Safari using JavaScript

I stumbled on that by accident. One of my javascript-variables was called orientation and was not correctly used on the iPad’s Safari.

After looking at its content, I found out that you can detect the device orientation. I knew you can handle many cool things on the iOS, like swipes in javascript, but this one was new to me.

So, what are you going to do with this? It’s obvious: Style your website or re-order your content to match exactly your iPad’s orientation ;-)

You can use javascript in an event handler, loop, or whatever by accessing window.orientation (or only orientation).

Here’s an example on how to detect the current orientation of the iPad device either by pressing a button or when the orientation changes, using an event called onOrientationChange:





You can also use CSS Stylesheets using the media definition:




The detection is not restricted to the iPad, it should work on all iOS devices.

cool images in wordpress

Since I have just added the first image in a previous post and I wanted to make it look good, I installed two WordPress PlugIns that will improve my Blog and are also available for everyone’s website:

1) Lightbox

Everyone seems to know Lightbox now, it creates these nice image layers on top of the website.

You can find it here:
http://www.stimuli.ca/lightbox/

A must have for all websites, not only Blogs!

Click on the thumbnail for an example:

2) Reflection

This was new to me and I love it. Have you seen these reflection effects on some websites? Especially Apple was using them in iWeb. The most reflections until now were made in Photoshop and uploaded as image.

But now there is a small javascript library “Reflection” that does the job.

You can find it here:
http://code.google.com/p/bitpress/wiki/Reflection

And this is what you get by combining those two:

Switch to our mobile site