Tag Archives: Control flow

JavaScript Performance: for vs. while

JavaScript Loops

If you have read some preformance tests on JavaScript loops, you may have heard that “while” is faster than “for”. However the question is how faster is “while”? Here are some results, but first let’s take a look on the JavaScript code.

The for experiment

console.time('for');
for (var i = 0; i < 10000000; i++) {
	i / 2;
}
console.timeEnd('for');

The while experiment

console.time('while');
var i = 0;
while (i++ < 10000000) {
	i / 2;
}
console.timeEnd('while');

Note – these tests are performed and measured with Firebug on Firefox.

Results

It’s a fact, that you’ll get different results as many times as you run this snippet. It depends also on the enviroment and software/hardware specs. That is why I performed them 10 times and then I took the average value. Here are the values of my performance tests. Note that both for and while perform 10,000,000 iterations.

And the Winner Is

While is the winner with an average result of 83.5 milliseconds, while “for” result is 88 average milliseconds.

As the diagram bellow shows, the while loop is slightly faster. However we should be aware that these performance gains are significant for large number of iterations!

JavaScript Performance: for vs. while
JavaScript Performance: for vs. while

Computer Algorithms: Binary Search

Overview

The binary search is perhaps the most famous and best suitable search algorithm for sorted arrays. Indeed when the array is sorted it is useless to check every single item against the desired value. Of course a better approach is to jump straight to the middle item of the array and if the item’s value is greater than the desired one, we can jump back again to the middle of the interval. Thus the new interval is half the size of the initial one.

Binary search basic implementation
Basic implementation of binary search

If the searched value is greater than the one placed at the middle of the sorted array, we can jump forward. Again on each step the considered list is getting half as long as the list on the previous step, as shown on the image bellow.

Binary search - basic implementation
Binary search - basic implementation

Implementation

Here’s a sample implementation of this algorithm on PHP. Obviously the nature of this approach is guiding us to a recursive implementation, but as we know, sometimes recursion can be dangerous. That’s why here we can see either the recursive and iterative solution. Continue reading Computer Algorithms: Binary Search

Using PHP’s array_diff in Algorithm Development

array_diff can be really powerful. Once you’ve to find the different elements between two arrays you’ve to use array_diff. Here’s a case when you can use it while coding a simple algorithm.

The Task

You’ve one array with tickets of linked destinations – so you start from one city to another, than next and so on. Each element is an array with “from” and “to” destinations:

$inputTickets = array(
    0 => array('from' => 'barcelona', 'to' => 'madrid'),
    1 => array('from' => 'sofia', 'to' => 'paris'),
    2 => array('from' => 'madrid', 'to' => 'milano'),
    3 => array('from' => 'paris', 'to' => 'barcelona'),
    4 => array('from' => 'cupertino', 'to' => 'sofia'),
    5 => array('from' => 'milano', 'to' => 'valencia'),
    6 => array('from' => 'valencia', 'to' => 'nice'),
    7 => array('from' => 'mountain view', 'to' => 'cupertino'),
);

It’s easy to construct two arrays – the “from” destinations array and the “to” destinations array, and here the easiest way to get the starting point of the whole trip, because of the fact that these are linked tickets.

$fromDestinations = $toDestinations = array();
 
foreach ($inputTickets as $k => $v) {
    $fromDestinations[] = $v['from'];
    $toDestinations[]   = $v['to'];
}
 
// and finally get the starting point
$startPoint = array_diff($fromDestinations, $toDestinations);

Conclusion

Beside of knowing several algorithm techniques, there’s also need of knowing the language syntax and possibilities – in that case PHP’s

Friday Algorithms: A Data Structure: JavaScript Stack

Algorithms and Data Structures

stack

Instead of writing about “pure” algorithms this time I’ve decided to write about data structures and to start with a stack implementation in JavaScript. However algorithms and data structures live together since the very beginning of the computer sciences. Another reason to write about data structures is that many algorithms need a specific data structure to be implemented. Most of the search algorithms are data structure dependent. You know that searching into a tree is different from searching into a linked list.

I’d like to write more about searching in my future algorithm posts, but first we need some data structure examples. The first one is, as I mentioned – stack.

Implemented in JavaScript this is really a simple example, which don’t need much to be understood. But in first place what is a stack?

You can thing of the “computer science” stack as a stack of sheets of paper, as it’s shown on the picture. You’ve three basic operations. You can add new element to the stack by putting it on the top of the stack, so the previous top of the stack becomes the second element in the stack. Another operation is to “pop” from the stack – remove the “first” element in the stack – the top most element, and to return it. And finally print the stack. This is difficult to define as an operation, but let say you’ve to show somehow every element from the stack.

Here’s a little diagram:

Stack

Source Code

At the end some source code:

var node = function()
{
    var data;
    var next = null;
}
 
var stack = function()
{
    this.top = null;
 
    this.push = function(data) {
        if (this.top == null) {
            this.top = new node();
            this.top.data = data;
        } else {
            var temp = new node();
            temp.data = data;
            temp.next = this.top;
            this.top = temp;
        }
    }
 
    this.pop = function() {
        var temp = this.top;
        var data = this.top.data;
        this.top = this.top.next;
        temp = null;
        return data;
    }
 
    this.print = function() {
        var node = this.top;
        while (node != null) {
            console.log(node.data);
            node = node.next;
        }
    }
}
 
var s = new stack();
 
s.push(1);
s.push(2);
s.push(3);
 
s.print();
 
var a = s.pop();
 
s.print();

One Form – Multiple DB Records

I’ve the impression that even it’s a simple technique it remains quite misunderstood!

What’s the Goal?

You’ve a simple HTML form with several groups of form elements. Imagine the situation with title and link groups. You can have 1, 2 or more title/link pairs which you’d like to save in a database table, where perhaps there are only three columns – id, title, link.

What is the Shortest Path to the Solution?

In fact the task can be done by many ways, but there’s one really elegant solution. As it appears in many occasions PHP and HTML are born to work together!

1. First Step

Create your web form by simply modifying a bit the element names. Usually when you have an input you simply name it after the database column or something similar.

<form method="POST">
	<input type="text" name="db_column_name" />
</form>

In reality PHP and HTML allows the name to be an array element, just like so:

<form method="POST">
	<input type="text" name="link[0][title]" />
	<input type="text" name="link[0][url]" />
 
	<input type="text" name="link[1][title]" />
	<input type="text" name="link[1][url]" />
</form>

2. Second Step

Than all this comes in the _POST array in PHP, but formatted in an array manner, so you can simply foreach it!

<?php
 
foreach ($_POST['link'] as $link) {
	insert_into_db($link['title'], $link['url']);
}
 
?>

That is simply enough!