united-coders.com - javascript

On the phone with Mom - Throttle and Delay DOM-Events in Javascript

Matthias Reuter — Thu, 17 Nov 2011 07:10:43 +0000

Imagine you're on the phone with your mom and she keeps on talking. And talking. And talking. And you keep on listening and listening. And listening. Every now and then your mom will throw in a "you still there?" to which you will murmur "uh huh".

And while your mom keeps talking, you feel the increasing urge to answer to something she said, but being well raised, you don't want to interrupt her, but wait until she is finished.

Now imagine being a Javascript (Come on, It's not that hard, is it?).Read more

Snow is falling - code puzzle

Christian Harms — Tue, 15 Nov 2011 08:15:04 +0000

Code puzzles are fun and you can solve it with some lines of code. The code puzzle on snowisfalling.com is a page showing snow is falling up instead down. After reading the code, sleeping two nights without time to solve it, the simple solution is easy:

  init : function(law){
    String.prototype.reverse=function(){return this.split("").reverse().join("");}
    this.law = {};
    for (var k in law) { this.law[k.reverse()] = law[k]; }; 

Read more

basic rules for code readability and the if statement

Christian Harms — Mon, 01 Aug 2011 16:55:23 +0000

Some reader knows my preference for programming languages like python or javascript. One reason is the readability (yes, this is possible with many languages except brainfuck or whitespace). Once we write some lines of code, but other developer has to read the lines of code several times while code reviews, debugging or refactoring.

Code should be readable like your normal language. I will start with a funny condition.

if ( !notOk != false ) {
  userObj.ask();
}

This is only confusing and you will never formulate this expression in a natural language. With several steps this term can be simply resolved:

( !notOk != false )
( !notOk == true )
( !notOk)
now you should rethink the variable name: isOk = !notOk

And the result is more readable:Read more

create optimized wordlist data structures for mobile webapps

Christian Harms — Fri, 18 Mar 2011 21:22:09 +0000

John Resig (creator and lead developer of jQuery) has published two interesting articles about data structure for a lookup to a huge wordlist (dictionary lookups and trie performance). Read in his articles about all the variants and preconditions.

I implemented six variants for the data structure (started with simple String search, Array to Trie) and benchmarked them to find the best solution. But let’s start with the rules:Read more

Javascript algorithm performance : And the winner is ...

Christian Harms — Thu, 02 Dec 2010 06:32:26 +0000

Our little programming contest was fun and we can learn something about best practices in javascript algorithm performance. I have prepared some micro benchmarks for common code sniplets to find the best variant. After the section with the micro benchmarks you can find the best-performed solution by running the JSLitmus test and browse through the javascript code. And yes - our co-author Matthias had the best solution with factor 20-35 faster than the clean code variant. No solution is close with the performance to Matthias' solution!

Knowing some javascript performance hints are importend. The different javascript interpreter with Just-In-Time-Optimizer can offer some surprise in the following basic code examples.

Adding Numbers to an Array
Using code in loop-header or Body
Round down a Number
Using linear Array or Object (=hashmap) for caching Numbers
Find a substring in a String

Read more

forfeit game - ALGOL 60 solution from 1964

Christian Harms — Mon, 15 Nov 2010 13:51:00 +0000

I found two ALGOL sniplets for the forfeit game contest. My ALGOL 60 programming book (happy birthday for the ALGOL programming language) offer for every problem the question, a problem analysis, a code structure chart, the code solution and the executing time for the ZUSE 23 computer (see a very similar Z22 on wikipedia). I converted the fast solution for the game of forfeit from ALGOL to javascript without optimizations and benchmarked it.

Opera 10.63 vs. Chrome 7/8 vs. Firefox 3.6.12/4b7

I will start with the results from the converted ALGOL solution. The new javascript engine Jägermonkey with the firefox 4b7 is a real competitor for other fast javascript engines! And the ALGOL version is (mostly) better than the clean code version. The absolute numbers are generated on my own mini-pc and used for comparing with the clean code solution.

The 1:1 conversion of the ALGOL code runs on my Intel Atom N270 3.5 million times faster than on the original ZUSE Z23.Read more

Forfeit game - coding contest since 50 years

Christian Harms — Mon, 08 Nov 2010 16:11:16 +0000

The game of forfeits is a simple game and one of the classic programming examples since 50 years. I found it in a ALGOL 60 exercise book from 1963: Count the numbers up to 100, but skip all numbers if one of the condition matches:

number is divisible by seven
number contains a seven
sum of digits is divisible by seven
sum of digits contains a seven

Develop a function which calculates all numbers based on the given conditions. The only one parameter for the function is the range and the function should return the Array of all valid numbers. Hint: You must not cheat while returning a sliced constant result array. The result of the function with max=100 is: [1, 2, 3, 4, 5, 6, 8, 9, 10, 11, 12, 13, 15, 18, 19, 20, 22, 23, 24, 26, 29, 30, 31, 32, 33, 36, 38, 39, 40, 41, 44, 45, 46, 48, 50, 51, 53, 54, 55, 58, 60, 62, 64, 65, 66, 69, 80, 81, 82, 83, 85, 88, 90, 92, 93, 94, 96, 99, 100]. Read more

clean code variant

Javascript Functional programming with Underscore or ECMAScript5

Christian Harms — Mon, 04 Oct 2010 19:56:21 +0000

Intro: A little excursion to code more functional with javascript. It contain examples with the classic for-loop-code, the more functional variant with Underscore.js and the HTML5 functional enhancements. It does not explain the basic idea of functional programming - it shows the differences in code examples.

motivation

Last week I got access on the address book from Matthias' well known entry Jennifer. But I had no time to scan all the other girls addresses. With many lines of source code filled with for-loop-code - no way. I have to find a smarter coding way to scan the address book.Read more

JavaScript Object property getter benchmarks - part 2

Christian Harms — Wed, 05 May 2010 22:12:41 +0000

The object access benchmarks last weeks was not surprising but a factor 5 between access "obj.a" and "obj.getA()" is interesting. In this second part I check the access time for properties on objects, created with ECMAScript 3 getter/setter and with the ECMAScript 5 Object.defineProperty variant (works on IE8+, FF3.7+, newest Webkit and Chrome 5) - see more on ECMAScript 5 compatibility table. Oliver asked to add getter tests - and the results produce differences with factor 15-100.Read more

JavaScript Object Access Micro benchmarks

Christian Harms — Tue, 27 Apr 2010 21:33:21 +0000

After getting the tip to use JSLitmus for JavaScript microbenchmarks I grabbed my old "How to access JavaScript Object" code and build some tests with JSLitmus. The following question was sometimes very religious and only benchmarks can solve the problem:

The question is simple: what is faster?

obj = {a:1};
 
//variant 1
result = obj.a;
 
//variant 2
result = obj['a'];
 
//variant 3 - build an object with getter function:
result = obj.getA();

Read more