Coding

Application Design Notes

2020-10-18T20:07:00.020+05:30

Don’t be afraid to write your own code, but be absolutely sure you need to

Don't reinvent the wheel
Learn more about your libraries and take full advantage
Date time calculation is hard (leap second, leap year), use trusted library

js-joda, momentJs, joda (java)

Simple is better than perfect (nearly) every time

If you can deliver a sub-optimal solution (that solves the problem but has known limitation) in a week instead of a full featured one in a month DO, IT
Simple system are

Easy to reason about
Easy to debug
Easy to refactor
Easy to learn

Simple doesn't mean you skip good engineering, but you can use duct tape.

Build things the right way from the start, refactoring is hard and expensive

Security

Manage and store passwords securely

Telemetry
Common retrofitting "grunt work"

Internationalization + localization
Web Content Accessibility
Factoring and styling HTML UI
Adding unit test to an existing codebase

LOG LOG LOG Log, but do it right

We spend lot of time reading and processing log

Use log-segmentation

When error occur log as much context as possible
Make changing logging verbosity cheap and easy to update at same time

Build Profiling into your product code

Performance problem usually occur first time in production
Many large-scale production enviroment are hard to replicate

Have a way to access critical profiling info for production process
Custom HTTMP/Tenet interface
Shared memory window

Monitor your product end to end not just sub system (Telemetry)

Monitor the entire system end to end the same way as user see it
Monitor the health of individual component

Avoid platform specific feature wherever you can

Migration can be very-very expensive same time impossible
Running testing on multiple platforms will expose bugs faster

Write your code like you trust no one

Always test precondition before function execute
If something should be in give state, test for it
Sanitize input and output
Leave these tests in production code

Choose your dependencies carefully

Every dependency is a liability. You have to fix (or get fix) any error in them
Prefer open source to close source

At least you have the option of fixing a problem

Dependency often increase complexity

Build
Packaging
Licensing
Security, verification (XSS, SQL injection, buffer overflow..)

If you can pre-generate something, do it

Lookup table are an underutilized secret weapon
Memory is cheap
Pre calculate result if

The input to a computation is known to be in given range

The number of different results is relatively small (<1 Billion)

Calculation is sufficiently complex

Example - Pre-compute the time zone conversion from UTC to all time zone for all hours from 01/01/1991 to 12/31/2020

Why this is complex to calculate?

23,24,25 hours days DST change must be accurate for historic dates. blog, Time Zone Database

Applications do crash often

Avoid DDOS attack

Use Rate limit

Every feature will be misused or abused
Isolate to avoid cascade failure

Use Circuit breaker

No such thing as a long-lived process

If hardware fails or power removed your process will crash
Design system to be fault tolerant to process re-start

All state must be external to process
Try to keep services and process stateless

Keep sever stateless

One app server should not affect any other server
Server will be easy to scale
Separate cache service from other server to avoid resource contention

Cache appropriately

Data, metadata, configuration, static data

Store redundant
Partition by functions

Allow people to work independently on features

Split horizontally

If you can’t split, you can’t scale
Use standard load balance to route incoming traffic

Because application service created equal and not retain any transaction state

Decouple functions asynchronously

If A call B synchronously, A & B are tightly couple. So, if B is down then A is down.
A should be integrated B with asynchronously (with queue, multicast message, path processing, event driven architecture)
Avoid synchronous coupling as much as possible
Move processing to asynchronously flow

Asynchronously flow example can be

Activity tracking, billing, settlement, reporting, email

Use Feature Toggling to deliver new functionality to users rapidly but safely.
Virtualize at all level

Virtual IP for DBs
Virtual IP for load balancer

CSS Specificity

2016-03-28T18:48:00.000+05:30

Many time different CSS rules overlap on one or more element. And some people always get confuse about, which rule will take higher priority then other and why? CSS Specificity is the answer of all these kind of questions.

As the name suggest, the CSS rule which is more specific to the element will take higher priority then other. Means something like “#some_id{}” will always take higher priority then “*{}” universal selector. And if duplicate rules are define then the last rule will be applied to the element.

The following list of selectors is by increasing specificity:

Type selector (e.g., div) and pseudo-elements in selector (e.g., :after)
Class selectors (e.g., .some_class), attributes selectors (e.g., [type=”radio”]) and pseudo-class selector (e.g., :hover)
Id selectors (e.g., #some_id)

ID takes higher priority then Class, Type and Universal selector (Note: Universal selector has no effect on specificity, see below special conditions).

If duplicate rules are given, then last rule will override the earlier one.

Some special conditions while deciding the selector specificity:

No effect on specificity: Universal selector (*), combinators (+, >, ~, ‘ ‘) and negation pseudo-class (:not())
Inline style always overwrite any styles in external stylesheets and it has highest specificity.
“!important” declaration overrides any other declarations. Although has nothing to do with specificity, but it is a exception.

But some time use case become more complex then this, and we have to calculate the selector’s specificity accurately.

Calculating specificity

As per the W3C Recommendation, selector’s specificity is calculated as follows

Count the number of ID selectors in the selector (= a)
Count the number of class selectors, attributes selectors, and pseudo-classes in the selector (= b)
Count the number of type selectors and pseudo-elements in the selector (= c)
Ignore the universal selector

Selectors inside the negation pseudo-class (i.e :not(x)) are counted like any other, but the negation itself does not count as a pseudo-class.
Concatenating the three numbers a-b-c (in a number system with a large base) gives the specificity.

Example

After calculating the specificity "div#div" has highest specificity then others, so this rule will be applied,
1. div - specificity: 1
2. div#div - specificity: 101
3. #div - specificity: 100

Some Examples for specificity calculation:

* { }                       /* a=0 b=0 c=0 -> specificity =   0 */
li { }                      /* a=0 b=0 c=1 -> specificity =   1 */
li:first-line { }           /* a=0 b=0 c=2 -> specificity =   2 */
ul li { }                   /* a=0 b=0 c=2 -> specificity =   2 */
ul ol+li { }                /* a=0 b=0 c=3 -> specificity =   3 */
h1 + *[rel=up] { }          /* a=0 b=1 c=1 -> specificity =  11 */
ul ol li.red { }            /* a=0 b=1 c=3 -> specificity =  13 */
li.red.level { }            /* a=0 b=2 c=1 -> specificity =  21 */
style=””                    /* highest specificity        =1000 */
p { }                       /* a=0 b=0 c=1 -> specificity =   1 */
div p { }                   /* a=0 b=0 c=2 -> specificity =   2 */
.sith                       /* a=0 b=1 c=1 -> specificity =  10 */
div p.sith { }              /* a=0 b=1 c=2 -> specificity =  12 */
#sith { }                   /* a=1 b=0 c=0 -> specificity = 100 */
#sith:not(div) { }          /* a=1 b=0 c=1 -> specificity = 101 */
body #darkside .sith p { }  /* a=1 b=1 c=2 -> specificity = 112 */

PS:
https://www.w3.org/TR/selectors/#specificity
https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity
https://stuffandnonsense.co.uk/archives/css_specificity_wars.html

How to store user password at server!!!

2016-03-24T23:40:00.004+05:30

Trick is, you should never store user password… never ever.

Now the real question is, then how to authenticate and authorize the user with password. And answer is when user enter the password, we should encrypt the password and store the hints.

So next time when user enter the password we follow the same process and compare hints, if both hints are same then password is matched, else it is wrong password.

Next question will be, what kind of hints, and how to generate these hints.

In simple term hints are the obfuscated and fragmented form of user password.
And very important part is hints generation process, which have to be collision resistant, means there will be very less possibility to find the data which generate same hints (like Cryptographic hashing functions).

Below is the simple checklist of password hashing and storing, which you should always keep in mind.

ERROR: Ignored call to 'alert()'. The document is sandboxed, and the 'allow-modals' keyword is not set.

2015-10-15T12:50:00.000+05:30

Recently I found this issue while writing code snippet in "JSFiddle". And after searching, found this was happening because of new feature added in "Chrome 46+". But at the same time Chrome doesn't have support for "allow-modals" property in "sandbox" attribute.

Chromium issue for above behavior:
https://codereview.chromium.org/1126253007

To make it work you have to add "allow-scripts allow-modals" in "sandbox" attribute, and use "window.alert" instead of "alert".

<!-- Sandbox frame will execute javascript and show modal dialogs -->

<iframe sandbox="allow-scripts allow-modals" src="iframe.html">

</iframe>

Feature added: Block modal dialog inside a sandboxed iframe.
Link: https://www.chromestatus.com/feature/4747009953103872

Feature working Demo page:
https://googlechrome.github.io/samples/block-modal-dialogs-sandboxed-iframe/index.html

JavaScript: Next Unique ID Function

2014-12-14T20:55:00.003+05:30

Unique ID generation is used in JavaScript application in many places. For example giving the unique id to DOM element or may be using it to some data structure for storing in memory, where it can be use latter.

Most of the implementation I see is just defining the integer and increasing it on every call. But it is potentially candidate to integer overflow issue, which can cause errors in many edge case scenario.

var nextUid = (function(){
  var idCounter = 0; //integer counter
  return function (prefix) {
     //counter increment on every call, and it can run into integer overflow issue
     var id = ++idCounter; 
     return String(prefix == null ? '' : prefix) + id;
   }
})();

When I was reading through AngularJS source code, found this really good implementation of unique ID generation. Below is the extracted and updated version of the same, so you can use it independently.

/**
 A consistent way of creating unique IDs in angular. The ID is a sequence of alpha numeric
 characters such as '012ABC'. The reason why we are not using simply a number counter is that
 the number string gets longer over time, and it can also overflow, where as the nextId
 will grow much slower, it is a string, and it will never overflow.
 
 @returns an unique alpha-numeric string
 */
var nextUid = (function(){
  var uid = ['0','0','0'];
  return function() {
    var index = uid.length,
        digit;

    while(index) {
      index--;
      digit = uid[index].charCodeAt(0);
      if (digit == 57 /*'9'*/) {
        uid[index] = 'A';
        return uid.join('');
      }
      if (digit == 90  /*'Z'*/) {
        uid[index] = 'a';
        return uid.join('');
      } 

      if (digit == 122 /*'z'*/) { 
        uid[index] = '0';
      } else {
        uid[index] = String.fromCharCode(digit + 1);
        return uid.join('');
      }
    }
    uid.unshift('0');
    return uid.join('');
  }
})();

//output: "001", "002", "003", "008", "009", "00A", "00B", .., "01s", "01t", "01u", "01v" ..etc

Benefited of using this function is slow rate of increment, and you will never have to worry about the overflow issue.

JavaScript: Utility function to default function in parameters

2014-07-27T19:04:00.003+05:30

Recently I came across a interesting discussion on reddit. And that was about a utility function which will give you flexibility to define default function in parameters.

I found it very interesting, so wrote one for me.

/*
in param: defaultArg1, defaultArg2, .... function
return : function 
*/
var defaultParams = function(){
  var args = arguments,
   len = args.length,
   fn = args[--len],
   defaultArg = [];
  
  if(typeof fn !== 'function'){
   throw new Error('invalid arguments');
  }
  while(len--){
   defaultArg[len] = args[len];
  }
  return function(){  
   var args = arguments,
    fnlen = fn.length,
    params = [];
   while(fnlen--){
     params[fnlen] = args[fnlen] == null ?  defaultArg[fnlen] : args[fnlen];
   }
   return fn.apply(this, params);
  }
}
 
 
 
//how to use 
var alert_my_age = defaultParams(21, function(age) {
  console.log(age);
})
 
alert_my_age()   //#=> Alerts 21
alert_my_age(45) //#=> Alerts 45

JavaScript: Light weight wrapper class for window.localStorage

2014-07-26T18:46:00.000+05:30

Recently I wrote a small wrapper class around the window.localStorage with useful functionality apart from normal get/set value.

For example

Accessors for JSON/Boolean/Number,
Event registering for type create/update/remove/clear events

API functions

LS.set(key, value)
LS.setJson(key, jsonObject)
LS.remove(key)
LS.clear()

LS.get(key): String
LS.getJson(key): JsonObject
LS.getNumber(key): Int
LS.getBoolean(key): Boolean


//Event API
LS.on(event, listenerFunction, scope): function //this return function can be used for unregistering from event

//different type and listeners callback param
events type: 'create'   listenerFunction callback param: key, value
events type: 'update'   listenerFunction callback param: key, newValue, oldValue
events type: 'remove'   listenerFunction callback param: key
events type: 'clear'    listenerFunction callback param:

//remove all the registered event for given event type
LS.removeAllEventListeners(eventType)

Event registering/unregistering example

//registering listener
var updateListenerFn = LS.on('update', function(key, newValue, oldValue){
    //code  
});

//unregistering listener
LS.un('update', updateListenerFn);

Hope it will be useful for others.

Project links: https://github.com/neerajnandwana/LS

New Features and Enhancements from JDK-5 to JDK-7

2013-11-20T20:11:00.002+05:30

As Oracle is preparing for JDK-8 release with most awaited language features " lambda expressions", I was thinking about the java language evolution since I started my IT career.

New features released in JDK-5 were really impressive, and it created lots of interest in language again.

JDK-5 (September 30, 2004)

JDK-6 (December 11, 2006)

JDK-7 (July 28, 2011)

Over the past few years, java has become more relevant. It has quietly become the primary foundation for really big companies like Google, LinkedIn, Tumbler, Square and Twitter.

“Java is really the only choice when it comes to the requirements for a company like ours — extreme performance requirements and extreme scalability requirements. There is no viable alternative”— Bob Lee

“On August 3, Twitter hit a one-second peak of 143,199 tweets. That’s a massive spike over the norm — about 5,700-tweets-per-second — and the site stayed up”— New Tweets per second record, and how!

PS:
Twitter Shifting More Code to JVM, Citing Performance and Encapsulation As Primary Drivers
Yammer Moving from Scala to Java
On The Cusp Of A Java Renaissance: Where We've Been And Where We're Going - Bob Lee is the CTO of Square Inc

JavaScript [ExtJs3]: Avoid default filtering in ComboBox

2013-07-11T17:26:00.000+05:30

We had a requirement where we wanted to avoid default filtering provided by the ExtJs ComboBox. Instead we wanted to control it based on our business rules. To avoid default filtering we added “editable:false”, but it didn’t help much. As after selecting any value user cannot clear the value from field. We tried few more permutation-combination to achieve all the behaviour we wanted, but nothing worked.

Use-Cases we wanted to achieve in combo box

Force user to select value from drop down list
User can clear the value
Disable the default filtering as filtering is applied based on some business rule and default filtering was clearing it

Here is the final outcome, which satisfied all the use-cases.

var combo = new Ext.form.ComboBox({
            store        : store,
            displayField : displayField,
            mode         : 'local',
            triggerAction: 'all',
            forceSelection: true,
            autoSelect: false,
            // don't allow user to enter the value
            // But at the same time he should be able to delete the value
            // overriding the function to avoid default filter clearing
            initQuery:  function(){
                this.doQuery('');
                this.setValue('');
            }
});

PS: Extjs version – 3.4

Think “SOLID”

2013-05-09T11:44:00.004+05:30

S → Single responsibility principle : One class one responsibility

O → Open/closed principle : Open for extension, but closed for modification

L → Liskov substitution principle : Design by contract [Link: Liskov substitution principle]

I → Interface segregation principle : Many client-specific interfaces are better than one general-purpose interface

D → Dependency inversion principle : Abstraction on object and their dependency creation

Debugging common errors in ExtJs

2013-05-06T16:33:00.003+05:30

If you check ExtJs form, you will find some issues commonly faced by developers. I have seen people spending hours to solve these issues without any clue.
Here is the list of few errors and expected root cause. Hope it will help someone.

this.addEvents is not a function

Check instantiation of the class. Most probably you forgot to write “new” keyword while creating a class object.

namespace.MyClass is not a constructor

Check for typo in class definition or class instantiation.

Did you forget to include the js file in html page or in jsb configuration?

this.el is undefined / this.el is null

In ExtJs “el” variable hold the reference of DOM element. And DOM element only initialize, when UI render correctly on web browser. If you are getting this error, then their is major chances of accessing “el” variable before UI component layout or render properly.

Component is appearing as gray out or it is hanging somewhere else

It can happen because of many other issue, but major reason is same id of two component. To resolve this issue, just use diff id for each component.

Some quick FAQ links

For more learning resources, you must go through highly recommended “Learn ExtJs” page.

“Bloom Filter” to optimize expensive data lookups

2013-04-15T23:01:00.000+05:30

Bloom Filter is very useful when you want to optimize the functionality with following constraints

Data lookup is very expensive
False positive is acceptable and
False negative is un-acceptable

A Bloom filter, conceived by Burton Howard Bloom in 1970, is a space-efficient probabilistic data structure that is used to test whether an element is a member of a set. False positive retrieval results are possible, but false negatives are not; i.e. a query returns either "inside set (may be wrong)" or "definitely not in set". – wikipedia.org

It stores only value hash in it’s data structure, so it take very less memory against the very huge data.
For example if you have set of raw data with

10⁷ elements
10⁵ distinct value
and size ~40MB

Bloom filter will store same data as hash in just ~0.6MB. (ref.)
And because of the same reason it is quite fast.

Bloom Filter implementation
Guava library has bloom filter implementation
.Net implementation

Bloom Filter In Use

Chrome uses Bloom filters to make a preliminary decision whether a particular web site is malicious or safe.
Google Big table uses it to reduce disk lookups
Squid Web Proxy Cache uses Bloom filters for cache digests
Cassandra uses to save IO when performing a key lookup

Useful links
Bloom filter by example
Space-Eﬃcient Bloom Filters
"More Optimal Bloom Filters," Ely Porat (Nov/2007) Google TechTalk video on YouTube

"Stop Words" in full text search

2013-04-15T18:36:00.001+05:30

Stop words are the words without significant information. You can consider these words as a filler words. If these words are used in search statement, then result could potentially contain all the record from data store.

It is always a good idea to filter out these words before constructing the search query. It will make the search query smaller, faster and result will be more relevant.

“One of our major performance optimizations for the “related questions” query is removing the top 10,000 most common English dictionary words (as determined by Google search) before submitting the query to the SQL Server 2008 full text engine. It’s shocking how little is left of most posts once you remove the top 10k English dictionary words. This helps limit and narrow the returned results, which makes the query dramatically faster.” - stackoverflow.com

English stop word list :
http://jmlr.csail.mit.edu/papers/volume5/lewis04a/a11-smart-stop-list/english.stop

Some interesting articles
http://www.codinghorror.com/blog/2008/11/stop-me-if-you-think-youve-seen-this-word-before.html
http://www.seobythesea.com/2008/08/google-stopword-patent/
http://www.googleguide.com/interpreting_queries.html

[JavaScript] Updating the existing function behaviour

2013-03-04T11:33:00.000+05:30

Ever find a situation when you want to change the function behaviour without duplicating the existing function code. Then you must be looking for this example.

Our test data object

var user = {
    name: 'testWorker',
    isOnLeave: true
};

Original function behaviour

var startWork = function(user){
    console.log('working...');    
}

[run]   ->startWork(user);
[output]->working...

Now if we want to change the function behaviour based on our data object.

startWork = (function(){
    //backup original function in private scope
    var _originalFn = startWork;
    //assign new behaviour
    return function(user){
        if(user.isOnLeave){
            console.log('on leave...');
        } else {
            _originalFn(user);
        }
    }
})();


[run]   ->startWork(user);
[output]->on leave...

//change data object
user.isOnLeave = false;
[run]   ->startWork(user);
[output]->working...

Note: It is not suggested to update the existing function behaviour. Because it can introduce defect which are very hard to debug and resolve.

JavaScript [Q.JS] Are you stuck in nested callback functions?

2013-02-11T17:58:00.001+05:30

If you have seen situation when one asynchronous call result used in another asynchronous call. And you tried to make that code look less scary and more readable then you must go through this library and understand it’s nice tricks and syntax.

Just want to give the same example from its site which clearly shows the problem it is trying to solve.

step1(function (value1) {
    step2(value1, function(value2) {
        step3(value2, function(value3) {
            step4(value3, function(value4) {
                // Do something with value4
            });
        });
    });
});

With QJS library

Q.fcall(step1)
.then(step2)
.then(step3)
.then(step4)
.then(function (value4) {
    // Do something with value4
}, function (error) {
    // Handle any error from step1 through step4
})
.done();

If you want to see its potential uses then you should see one of the WCF data API breezejs.

To test this library i have created a dummy Ajax function which simulate the Ajax asynchronous behaviour.

var Ajax = function(config){
    var emptyFn = function(){},
        xhr = { 
            success : config.success || emptyFn,
            failure: config.failure || emptyFn,
            call: function(id){
                //random response delay
                var randomNum = Math.floor((Math.random()*3000)+1);
                setTimeout(function(){
                    xhr.success('['+config.url+' call]');
                }, randomNum);
            }
        };
    xhr.call();
    return xhr;
}

Next step is to wrap Ajax function in QJS promise object. And we are ready to play with QJS features.

var ajaxPromise = function(url){
     var deferred = Q.defer(),
        projectMgr = Ajax({
            url: url,
            success: function(res){
                console.log('>>>[success]>>>'+res);
                deferred.resolve(res);
            },
            failure: function(res){
                console.log('>>>[failure]>>>'+res);
                deferred.reject(res);
            } 
        });  
    return deferred.promise;
}

Feed all Ajax call response to one function

Q.all([
 ajaxPromise('A'),
 ajaxPromise('B'),
 ajaxPromise('C'),
 ajaxPromise('D')])
.spread(function(responseA, responseB, responseC, responseD){
 //handle data
});

Waterfall Ajax call where response data passes to the next Ajax call.

Q.fcall(ajaxPromise('A'))
.then(ajaxPromise('B'))
.then(ajaxPromise('C'))
.then(ajaxPromise('D'))
.then(function (responseD) {
 // Do something with value4
}, function (error) {
 // Handle any error from step1 through step4
}).done();

There are couple more useful functions

fail: Shorthand function of ‘then’ where you just want to handle the error

fin: It is a ‘finally’ function which get call without parameter.

Example handler

var handlers = {
    mainTask: function(){
            console.debug('main task - ', arguments);
            return 'maintask';
    },
    task1: function(){
            console.debug('then task1 - ', arguments);
            return 'task1';
    },
    task2: function(){
            console.debug('then task2 - ', arguments);
            return 'task2';
    },
    throwError: function(){
            throw new Error('some error');
    },
    handleError: function(){
            console.log('handle error - ', arguments); 
    },
    finallyTask: function(){
            console.debug('then finallyTask - ', arguments);
            return 'finallyTaskDone';    
    }
};

Handling the error through ‘then’ function and ‘finally’

Q.fcall(handlers.mainTask)
.then(handlers.task1)
.then(handlers.throwError)
.then(handlers.task2, handlers.handleError)
.fin(handlers.finallyTask).done();

Same behaviour with ‘fail’ shorthand function

Q.fcall(handlers.mainTask)
.then(handlers.task1)
.then(handlers.throwError)
.then(handlers.task2)
.fail(handlers.handleError)
.fin(handlers.finallyTask).done();

There are more stuff you can explore.

If you are a big fan of one liner code then you can write your code something like below with new array functions

var find = function(){ console.log('find'); },
 validate = function() { console.log('validate'); },
 update = function() { console.log('update'); },
 show = function() { console.log('show'); },
 funcs = [find, validate, update, show];

With function chaining

Q.fcall(find).then(validate).then(update).then(show)

Or with new ‘forEach’ function

var result = Q.resolve();
funcs.forEach(function(func){
    result = result.then(func);
});

Or with ‘reduce’

funcs.reduce(function(funca, funcb){
    return funca.then(funcb);
}, Q.resolve())

Ok above two were not really one liner but these are pretty compact and expressive.

Ajax call retry with some delay

There was a scenario in our project where we wanted to show error message after 5 recursive fail to get the data. And i found much easier to do with this library.

function readRetry(url, retryDelay, times){
    return projectMgrPromise(url)
        .then(function(data){
            console.log('got the data.');
        }, function(error){
            if(times == 0){
                throw new Error('Error while reading the data.');
            }
            return Q.delay(retryDelay)
                .then(function(){
                    return readRetry(url, retryDelay, times-1);
                });
        })
        .fail(function(error){
            console.log(error);
        });
}

//function call with 5 retry and 200 delay
readRetry('testUrl', 200, 5);

Asynchronous call handing are really hard specially if you are creating single page web application. So it is always better to give some thought on design before writing the code. I still remember battling with async callback issues in our one of the project and we created event system to overcome from it.

PS: JQuery and DOJO also support these kind of functions.

Some useful links

Google Guice: Dependency Injection with Guice 3.0

2012-10-30T19:47:00.001+05:30

Guice (pronounced 'juice') is a lightweight dependency injection framework for Java 5 and above, from Google.

Why Google Guice?

Mature Framework – Used in many open source projects like apache struts, apache shindig etc. Google is using it in many mission critical applications.
Simple and easy to use – It help in design better application.
JSR 330 support
AOP support
Very light weight – less then 1 MB in size
Won the 18th Jolt Award - for best Library, Framework, or Component.

Google Guice with example

Lets consider very high level application design where need services, persistence layer and authentication mechanism. Each of the functionality is very different but very dependent on each other. If we start writing the code without giving much thought on design, then we will be ending with the code, which is very tightly couple, hard to change and even harder to test.

Application design

Application main class

public class Application {
 private final AppService service;
 private final AppPersist persist;
 private final AppAuthentication authenticator;

 @Inject
 public Application(AppService service, 
   AppPersist persist, 
   AppAuthentication authenticator) {
  this.service = service;
  this.persist = persist;
  this.authenticator = authenticator;
 }
 
 //Other application related code
}

Custom annotation class for user id binding

@BindingAnnotation
@Retention(RUNTIME)
@Target({ METHOD, FIELD, PARAMETER})
public @interface User {}

Service classes

public interface AppService {
 void doSomthing();
}

public class AppServiceImpl implements AppService{
 private final ServiceConfig config;
 private final AppPersist persist;
 private final AppAuthentication authenticator;
 private final String user;

 @Inject
 public AppServiceImpl(ServiceConfig config, 
   AppPersist persist, 
   AppAuthentication authenticator, 
   @User String user) {
  this.config = config;
  this.persist = persist;
  this.authenticator = authenticator;
  this.user = user;
 }

 @Override
 public void doSomthing() {
  //code
 }
}

Guice module – wiring the dependencies

public class AppModule extends AbstractModule{

 @Override
 protected void configure() {
  bind(Application.class);
  bind(AppService.class).to(AppServiceImpl.class);
  bind(AppPersist.class).to(AppPersistImpl.class);
  bind(AppAuthentication.class).to(AppAuthenticationImpl.class);
  bind(String.class).annotatedWith(User.class).toInstance("UserID");
 }

 @Provides
 public ServiceConfig getService1Configuration(){
  return new ServiceConfig();
 }

}

Application entry point - time to Bootstrap the Guice

public static void main(String... arg) { 
 Injector inject = Guice.createInjector(new Test1Module());
 Application app = inject.getInstance(Application.class);
 app.service.doSomthing();
}

How Guice find and inject the dependency?

Generally all the bindings are definition under Module classes (Module classes are subclass of AbstractModule class).

public class AppModule extends AbstractModule{

 @Override
 protected void configure() {
  bind(Application.class);
  bind(AppService.class).to(AppServiceImpl.class);
  ....
 }

 @Provides
 public ServiceConfig getService1Configuration(){
  return new ServiceConfig();
 }

}

After getting the binding configuration, Guice inject the dependency based on @Inject annotation. Here are few ways of defining the injection point.

1. Constructor binding

bind(Application.class);

Binding point

public class Application {
 ...
 @Inject
 public Application(AppService service,
   AppPersist persist,
   AppAuthentication authenticator) {
  this.service = service;
  this.persist = persist;
  this.authenticator = authenticator;
 }

}

2. Linked binding

It used for binding the interface to target implantation class.

bind(AppService.class).to(AppServiceImpl.class);
bind(AppPersist.class).to(AppPersistImpl.class);
bind(AppAuthentication.class).to(AppAuthenticationImpl.class);

3. Annotation binding

 bind(String.class).annotatedWith(User.class).toInstance("UserID");

And the binding point will be annotated with “@User” .

public class AppServiceImpl implements AppService{
 
 ...

 @Inject
 public AppServiceImpl(ServiceConfig config, 
   AppPersist persist, 
   AppAuthentication authenticator, 
   @User String user) {
  this.config = config;
  this.persist = persist;
  this.authenticator = authenticator;
  this.user = user;
 }
 
 ...
}

4. Providers methods

When Guice doesn't find the binding for injection point then it search for “@Provides” annotated method under module classes to resolve the type. These provider methods must be define under module classes.

 public class AppModule extends AbstractModule{
 ...

 @Provides
 public ServiceConfig getService1Configuration(){
  return new ServiceConfig();
 }

}

In below code we are using “ServiceConfig” class. Which doesn't have any defined binding, so Guice will resolve the dependency through Provider function.

public class AppServiceImpl implements AppService{
 ...

 @Inject
 public AppServiceImpl(ServiceConfig config, 
   AppPersist persist, 
   AppAuthentication authenticator, 
   @User String user) {
  this.config = config;
  this.persist = persist;
  this.authenticator = authenticator;
  this.user = user;
 }

 ...
}

Where we can use @Inject?

We can apply @Inject to

Constructor – It is a preferred way, because it encourage the immutable behaviour
Field – This kind of injection are hard to debug
Method

Unit Testing – Time to test the Application

We cannot consider application done-done, till it has sufficient amount of test coverage. The best part of DI framework is, it makes application loosely couple, so unit testing becomes more easer.

To test our sample application we need to change the user id, persistence implementation and service configuration, to align test execution with our testing environment. So we have to re-wire the bindings.

Here is the Test module for unit testing

public class AppTestModule extends AbstractModule{
 @Override
 protected void configure() {
  bind(AppPersist.class).to(AppTestPersistImpl.class);
  bind(String.class).annotatedWith(User.class).toInstance("TestUserID");
 }

 @Provides
 public ServiceConfig getService1Configuration(){
  return new ServiceTestConfig();
 }
}

And below is the unit-test class for our application. In setup function we are overriding the “AppModule” with “AppTestModule”. So now we have “AppPersist” bind with “AppTestPersistImpl” and “UserID” with “TestUserID”. Apart from these changes, other bindings will be untouched.

public class AppTest {
 Injector injector;

 @Before
 public void setup(){
  injector = Guice.createInjector(Modules
     .override(new AppModule())
     .with(new AppTestModule()));
 }
 
 @Test
 public void testMyApp(){
  //TEST CODE
 }
}

Isn’t it simple? Here we have all dependences needed for unit testing without doing too much code change :)

JavaScript: underscorejs with examples

2012-09-27T12:02:00.000+05:30

In previous post I have mention about underscorejs library. And here is the another post to explain bit more about this library.

Some functions used in below example to improve readability

function prop(name){
 return function(obj){
  return obj[name];
 }
}

function compareProp(prop, contextProp){
 return function(obj){
  return obj[prop] === this[contextProp];
 }
}

Find visible user and show it’s default view
Below is the list of JSON array with user object data. Now we want to show all visible user with it’s default view.

var ar = [{
 name: 'moe',
 age: 40,
 display: true,
 defaultView: 1,
 views: [ 
  { name: 'Admin', id: 1 }, 
    { name: 'Role1', id: 2 }, 
    { name: 'Role2', id: 3 } 
]},{
 name: 'larry',
 age: 50,
 display: false,
 defaultView: 1,
 views: [ 
  { name: 'Admin', id: 1 }, 
    { name: 'Role1', id: 2 }, 
    { name: 'Role2', id: 3 } 
]},{
 name: 'curly',
 age: 60,
 display: true,
 defaultView: 2,
 views: [ 
  { name: 'Admin', id: 1 }, 
    { name: 'Role1', id: 2 }, 
    { name: 'Role2', id: 3 } 
]}];

Output must be

["moe has default view of Admin", 
"curly has default view of Role1"]

Solution without underscorejs library

var data = [];
for(var i=0, il=ar.length; i<il; i++){
    var item = ar[i];
    if(item.display){
        var str = item.name + " has default view of ";
        for(var j=0, jl=item.views.length; j<jl; j++){
            var view = item.views[j];
            if(view.id === item.defaultView){
                str += view.name;
                data.push(str);
                break;
            }
        }
    }
}

And after using underscorejs library

var userDefaultView = function(user){ 
 return user.name + ' has default view of '+ _.find(user.views,compareProp('id','defaultView'),user).name;
}

by using filter and map

_.chain(ar)
    .filter(prop('display'))
    .map(userDefaultView).value();

Above method will iterate twice on the list, first for filtering and then for transforming, so performance will not be so good. Here is the better way of achieving the same thing by using reduce method.

_.reduce(ar, function(memo, user){
    if(user.display){ 
        memo.push(userDefaultView(user)); 
    }
    return memo;
}, []);

Parse array data based on it’s type

var data = [
 { value:"test string",  type:"string" },
 { value:"221132",   type:"int" },
 { value:"21112.21212",  type:"float" },
 { value:"2012-09-22T17:01Z", type:"date" },
 { value:"2012-09-22T17:01Z", type:"datetime" },
 { value:"test2 string",  type:"string" },
 { value:"True",   type:"boolean" },
 { value:"234.1214",  type:"int" },
 { value:"2000-09-22T04:20Z", type:"date" },
 { value:"False",   type:"boolean" }
];

and output must be

["test string",
221132,
21112.21212,
"9/22/2012",
"9/22/2012 17:01",
"test2 string",
true,
234,
"9/22/2000",
false]

some formatter functions

var formattor = function(){
 function stringFormattor(value)  { return value; }
 function intFormattor(value)  { return parseInt(value, 10); }
 function floatFormattor(value)  { return parseFloat(value, 10); }
 function dateFormattor(value)  { return Date.parse(value).toString("M/d/yyyy"); }
 function datetimeFormattor(value) { return Date.parse(value).toString("M/d/yyyy HH:mm"); }
 function booleanFormattor(value) { return value === "True"; }

 return {
  "string" : stringFormattor,
  "int"  : intFormattor,
  "float"  : floatFormattor,
  "date"  : dateFormattor,
  "datetime" : datetimeFormattor,
  "boolean" : booleanFormattor
 };
}();

And now our underscorejs solution

_.map(data, function(obj){ return formattor[obj.type](obj.value);});

It is really short and expressive code.

Normalize the data
In one of the scenario, we were dealing with large amount of data. And some time data list used to have nested array and it was causing the search too slow. Our first implementation of search function had complexity of O(n) and it’s become O(n²) for another nested array and so on. It was so bad that, some time browser use to become unresponsive.
To overcome from this issue we decided to normalize the data array to single object and make elements unique property as key. And by doing this the search function complexity is reduce to perfect O(1). Because after normalization we were simply accessing the property instead of find it.

For example if you want to get child “c2” in “p1” element then code will be: “data[‘p1’][‘c2’]”

Here is the raw data

var data = [{
 key: 'p1',
 name: 'parent-1',
 childs: [{key: 'c1',name: 'child-1'},{key: 'c2',name: 'child-2'},{key: 'c3',name: 'child-3'}]
},{
 key: 'p2',
 name: 'parent-2',
 childs: [{key: 'c3',name: 'child-3'},{key: 'c4',name: 'child-4'},{key: 'c5',name: 'child-5'}]
},{
 key: 'p3',
 name: 'parent-3',
 childs: [{key: 'c11',name: 'child-11'},{key: 'c12',name: 'child-12'},{key: 'c13',name: 'child-13'}]
},{
 key: 'p4',
 name: 'parent-4',
 childs: [{key: 'c12',name: 'child-12'},{key: 'c14',name: 'child-14'},{key: 'c11',name: 'child-11'}]
},{
 key: 'p5',
 name: 'parent-5',
 childs: [{key: 'c8',name: 'child-8'},{key: 'c1',name: 'child-1'},{key: 'c3',name: 'child-3'}]
},{
 key: 'p6',
 name: 'parent-6'
}];

And expected output after data normalization

{
 p1: {
  key: 'p1',
  name: 'parent-1',
  childs: {
   c1: {key: 'c1',name: 'child-1'},
   c2: {key: 'c2',name: 'child-2'},
   c3: {key: 'c3',name: 'child-3'}
  }
 }, 
...
}

Solution

var normalize = function(p1, p2){
    p1[p2.key] = p2;
    if(p2.childs){ p2.childs = _.reduce(p2.childs,normalize,{}); }
    return p1;
}

_.reduce(data, normalize, {});

Again it’s simple, small and readable code.

This is really elegant library with tons of utility functions as you start exploring it, you will find your project codebase much smaller and clean.

PS: Lo-Dash is a drop and replace library for underscorejs with extra features + performance + bug fixes.

Don’t reinvent the wheel: Some useful JS libraries

2012-09-15T00:01:00.000+05:30

It is very common to see “Utility” file in many project, which have all commonly used functions. In other word you can say it is kitchen sink file, where people dump all common functions. Before you realize it grows more than 1000 lines and become a maintenance hell.

So keep in mind, each time when you write a new class or function you are increasing the project maintenance coast.

There are few things you should consider before writing the code

Know Your Library – Most of the library has some utility functions so keep exploring it.
Use Utility Library – If existing library doesn't have needed functionality then always consider using 3rd party Utility Library with good test converge.

Some of my favourite libraries

Underscore JS

It is one of the best utility library, which has collection of most commonly used functions. Here are few function with example code.

Each

_.each([1, 2, 3], function(num){ alert(num); });
=> alerts each number in turn...
_.each({one : 1, two : 2, three : 3}, function(num, key){ alert(num); });
=> alerts each number in turn...

Map

_.map([1, 2, 3], function(num){ return num * 3; });
=> [3, 6, 9]
_.map({one : 1, two : 2, three : 3}, function(num, key){ return num * 3; });
=> [3, 6, 9]

Filter

var evens = _.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });
=> [2, 4, 6]

Pluck

var stooges = [{name : 'moe', age : 40}, {name : 'larry', age : 50}, {name : 'curly', age : 60}];
_.pluck(stooges, 'name');
=> ["moe", "larry", "curly"]

Union

_.union([1, 2, 3], [101, 2, 1, 10], [2, 1]);
=> [1, 2, 3, 101, 10]

Intersection

_.intersection([1, 2, 3], [101, 2, 1, 10], [2, 1]);
=> [1, 2]

Keys

_.keys({one : 1, two : 2, three : 3});
=> ["one", "two", "three"]

Values

_.values({one : 1, two : 2, three : 3});
=> [1, 2, 3]

Escape

_.escape('Curly, Larry & Moe');
=> "Curly, Larry &amp; Moe"

Chain

var stooges = [{name : 'curly', age : 25}, {name : 'moe', age : 21}, {name : 'larry', age : 23}];
var youngest = _.chain(stooges)
  .sortBy(function(stooge){ return stooge.age; })
  .map(function(stooge){ return stooge.name + ' is ' + stooge.age; })
  .first()
  .value();
=> "moe is 21"

and more

var lyrics = [
  {line : 1, words : "I'm a lumberjack and I'm okay"},
  {line : 2, words : "I sleep all night and I work all day"},
  {line : 3, words : "He's a lumberjack and he's okay"},
  {line : 4, words : "He sleeps all night and he works all day"}
];

_.chain(lyrics)
  .map(function(line) { return line.words.split(' '); })
  .flatten()
  .reduce(function(counts, word) {
    counts[word] = (counts[word] || 0) + 1;
    return counts;
}, {}).value();

=> {lumberjack : 2, all : 4, night : 2 ... }

Below is the complete list of functions provided by this library.

Collections	Arrays	Functions	Objects	Utility	Chaining
each	first	bind	keys	noConflict	chain
map	initial	bindAll	values	identity	value
reduce	last	memoize	functions	times
reduceRight	rest	delay	extend	mixin
find	compact	defer	pick	uniqueId
filter	flatten	throttle	defaults	escape
reject	without	debounce	clone	result
all	union	once	tap	template
any	intersection	after	has
include	difference	wrap	isEqual
invoke	uniq	compose	isEmpty
pluck	zip		isElement
max	indexOf		isArray
min	lastIndexOf		isObject
sortBy	range		isArguments
groupBy			isFunction
sortedIndex			isString
shuffle			isNumber
toArray			isFinite
size			isBoolean
			isDate
			isRegExp
			isNaN
			isNull
			isUndefined

Date JS

This is very fluent JS library for date and really easy to use.

date comparison

var temp = new Date();
temp.setHours(0);
temp.setMinutes(0);
temp.setSeconds(0);
temp.setMilliseconds(0);
 
var today = new Date(someDate.getTime()); 
var today.setHours(0);
var today.setMinutes(0);
var today.setSeconds(0);
var today.setMilliseconds(0);
 
(today == temp); // true|false

date comparison with date JS

/ with Datejs, but without .same
someDate.clone().clearTime().equals(Date.today());
 
// New
someDate.same().day();
 
// Or,
someDate.is().today();

more example

var today = Date.today();
var past = Date.today().add(-6).days();
var future = Date.today().add(6).days();


Date.compare(today, future);                    // -1
Date.compare(today, new Date().clearTime());    // 0
Date.compare(today, past)                       // 1

Date formatting [formatting options]

new Date().toISOString();  // ""2008-04-13T10:07:15Z""

new Date().toString("yyyy-MM-ddTHH:mm:ssZ");  // "2008-04-13T04:11:05Z"

Date.today().toString();           // native .toString() functionality

Date.today().toString("M/d/yyyy"); // 11/19/2007

Date.today().toString("d-MMM-yyyy"); // 19-Nov-2007

new Date().toString("HH:mm");      // 18:45

Please check this wiki page for more information about this library.

BOM Character: Unknown guest in your file

2012-09-08T23:49:00.004+05:30

Many times I have seen special character like “ ï»¿ ” in starting of file and most of the time I ignored it. But recently it started causing more trouble, when my JS validation utility started failing. And log file shows same special character again. After more investigation, I find out it was introduce when I creates a new file in Eclipse.

So, what is this symbol?

It is a BOM (byte order mark) character used to signal the endianness (byte order) of a text file or stream[wiki]. This character differ based on encoding type like

Encoding	Symbol
UTF-8	ï»¿
UTF-16 (BE)	þÿ
UTF-16 (LE)	ÿþ

Next question is, how to remove this character from my file. And if you are using Notepad++ editor it will be much easier. You have to select the “Encoding” option from menu bar and choose “Convert to UTF-8 without BOM”.

How to handle BOM character in your code?

I will suggest to use some sophisticated library instead of rolling out your own solution. And “Apache Commons IO” library has dedicated class “BOMInputStream” for this problem.

Some code snippet from API doc

1. Detect and exclude a UTF-8 BOM

 BOMInputStream bomIn = new BOMInputStream(in);
 if (bomIn.hasBOM()) {
     // has a UTF-8 BOM
 }

2. Detect a UTF-8 BOM (but don't exclude it)

 boolean include = true;
 BOMInputStream bomIn = new BOMInputStream(in, include);
 if (bomIn.hasBOM()) {
     // has a UTF-8 BOM
 }

3. Detect Multiple BOMs

 BOMInputStream bomIn = new BOMInputStream(in, 
   ByteOrderMark.UTF_16LE, ByteOrderMark.UTF_16BE,
   ByteOrderMark.UTF_32LE, ByteOrderMark.UTF_32BE
   );
 if (bomIn.hasBOM() == false) {
     // No BOM found
 } else if (bomIn.hasBOM(ByteOrderMark.UTF_16LE)) {
     // has a UTF-16LE BOM
 } else if (bomIn.hasBOM(ByteOrderMark.UTF_16BE)) {
     // has a UTF-16BE BOM
 } else if (bomIn.hasBOM(ByteOrderMark.UTF_32LE)) {
     // has a UTF-32LE BOM
 } else if (bomIn.hasBOM(ByteOrderMark.UTF_32BE)) {
     // has a UTF-32BE BOM
 }

“80–20 rule” in Software - Some Interesting facts

2012-08-31T15:01:00.001+05:30

80-20 rule states that, for many events, roughly 80% of the effects come from 20% of the causes.

In Software Development

80% of users only require 20% of the features
80% features are done in 20% of project time (requirement added to the project very late)
80% of requirement conceptualized by everyone within 20% time of first meeting

I really like the iterative development which help to overcome from these facts because it break big cycle of project development to small feature development cycle, where we can prioritise the feature based on 80% users and start development. It is only successful when features are done within the iteration, and I really mean done (*agile methodology has done-done concept and that is very useful)

And just want to remind another agile practice known as Jamboree meetings for project planning to overcome from last point.

Actually I am quite fond of agile practices =)

In software Quality

20% top most reported bugs fixes, will eliminate 80% of the application error and crashes
80% of software quality is maintained by 20% of programmers
80% of bugs in an application are written by 20% of developers
80% of bugs are fixed in 20% of time
20% of a business application accounts for 80% of bugs

These facts are really interesting and helpful. Especially it helps, when you are making decision or doing planning.

Java: Singleton class - double-checked locking

2012-07-08T15:27:00.000+05:30

Most of the singleton class implementation i have seen are inefficient or buggy specially in multithreaded environment. So, here is my two cents on singleton classes.

We can implement singleton class based on

Eager instantiation and
Lazy instantiation

Singleton class based on eager instantiation
In “Effective Java” Josh Bloch preferred using single element enum type to implement singleton class.

public enum Singleton {
 ISTANCE;
 
 //other methods
}

Singleton class based on lazy instantiation
Some developer use synchronized method to make method thread safe but it make your function very slow. Other way to make function thread safe is synchronized block. But incorrect use of it, will result in same performance bottleneck.
Here is the preferred way to make singleton class thread safe. (“double-checked locking” algorithm).

public class Singleton {
 private static volatile Singleton INSTANCE = null;
 
 private Singleton(){}
 
 public static Singleton getInstance(){
  Singleton inst = INSTANCE;
  if(inst == null){    //first check 
   synchronized (Singleton.class) {
    inst = INSTANCE;
    if(inst == null){  //second check
     INSTANCE = inst = new Singleton();
    }
   }
  }
  return INSTANCE;
 }
 
 //other methods
}

In above implementation we have two check before creating a new instance of singleton class, and because of this it is known as double lock checking.

Read more about singleton class and "Double-checked locking" on http://en.wikipedia.org/wiki/Double-checked_locking and http://www.ibm.com/developerworks/java/library/j-dcl/index.html

Java: Strong References, Soft References and Weak References

2012-06-04T10:41:00.001+05:30

There are many use-cases where we want to control, when our objects are collected by GC(Garbage Collector). Package "java.lang.ref" provides reference-object classes, which support a limited degree of interaction with the garbage collector. And GC reclaim the object memory based on it's reachability.

Strong Reference

Newly created objects are strongly reachable by the thread that created it. So object will be remain in heap till thread is running or some variable hold this object reference.

//leaking array
private static List<String> leakingArrayWithStrongRef = 
                                new LinkedList<String>();

    public void StrongReferenceTest(){
        try {
            for (int i = 0; i < 500000; i++) {
                String data = LEAKING_DATA + i;
                // Add data to our leaking array...
                leakingArrayWithStrongRef.add(data);
            }
        } catch (OutOfMemoryError ofm) {
            System.out.println("OutOfMemoryError");
        } catch (Throwable e) {
            System.out.println("UnexpectedError");
        }        
    }

Heap Memory trend chart when unwanted objects added in Array

In this example array hold the strong reference of string. As we start adding string object in array then heap memory increase to it's max limit and throws "OutOfMemoryEerror" exception.

Soft Reference

Soft Reference are the softly reachable object. These kind of object will remain in the heap memory till GC clean them out in need of memory.

//leaking array
private static List<SoftReference<String>> leakingArrayWithSoftRef = 
                                new LinkedList<SoftReference<String>>();

    public void SoftReferenceTest(){
        try {
            for (int i = 0; i < 500000; i++) {
                SoftReference<String> data = new SoftReference<String>(LEAKING_DATA + i);
                // Add data to our leaking array...
                leakingArrayWithSoftRef.add(data);
            }
        } catch (OutOfMemoryError ofm) {
            System.out.println("OutOfMemoryError");
        } catch (Throwable e) {
            System.out.println("UnexpectedError");
        }     
    }

Heap Memory trend chart when unwanted objects added in Array

In this example array hold the soft reference of string object. As we start adding string object in array then heap memory increase to it's max limit and GC reclaim the soft reference object from heap. And in this code you will not get "OutOfMemoryEerror".

Weak Reference

Weak Reference are weakly reachable objects. And these kind of object will reclaim by the GC at any point of time.

//leaking array
private static List<WeakReference<String>> leakingArrayWithWeakRef = 
                                new LinkedList<WeakReference<String>>();

    public void WeakReferenceTest(){
        try {
            for (int i = 0; i < 500000; i++) {
                WeakReference<String> data = new WeakReference<String>(LEAKING_DATA + i);
                // Add data to our leaking array...
                leakingArrayWithWeakRef.add(data);
            }
        } catch (OutOfMemoryError ofm) {
            System.out.println("OutOfMemoryError");
        } catch (Throwable e) {
            System.out.println("UnexpectedError");
        }       
    }

Heap Memory trend chart when unwanted objects added in Array

In this example array hold the weak reference of string object. As we start adding string object in array then heap memory start increasing slightly and decrease after few seconds. It's happen because GC clean these object from the array more frequently. And in this code you will not get "OutOfMemoryEerror".

PS: I have used "jconsole.exe" to generate above graphs, which comes as a part of "JDK" toolkit.

JMeter: Creating First Load Test

2012-05-20T11:51:00.001+05:30

What we want to do

Simulate concurrent users
Simulate requests
Generate reports
Troubleshooting

JMeter GUI

Test Pan Plan is a root element where all test related settings are define.

In Thread Group we can define pool of user to simulate load on the test

Work Bench is for non test helpers

Common terms in JMeter

User ⇒ Thread
Request ⇒ Sampler
Report ⇒ Listeners

Setting up the load test

1. Simulate concurrent users

Add thread > Thread Group
- Number of Threads - concurrent users =10
- Ramp-Up Period - seconds until all users are active =1 (eg. if user define 10 Threads and 100 Ramp-Up Period then, it means each thread will start in 100/10=10 seconds time difference)
- Loop Count - how many repetitions =1
- Calculating think time

Ramp-up time = 120 seconds

Number of users = 30

Then think time will be = ramp up time/number of users

= 120/30 = 4 seconds

2. Simulate requests

Add Sampler > HTTP Request
- Server Name or IP = www.google.com
- Path = /

3. Generate reports

Add > Listener > Aggregate Graph
Add > Listener > View Results Tree

Running the load test

Click on Run > Start or "ctr+r"
Click on "Aggregate Graph"
- Click "Display Graph" for chart

Click on "View Results Tree"

To Re-run the test
- Click on Run > Clear All or "ctr+e"
- Click on Run > Start or "ctr+r"

Troubleshooting

View Results Tree hold the "Request" and "Response" data for each request so it's a really good place to verify, if test is running correctly or not.

"Request" Tab shows data sent to web server

"Response Data" Tab shows server response body

Guava: Some useful IO utilities

2012-05-18T01:16:00.001+05:30

Guava IO package provides very useful utility classes for input/ouput stream, byte stream, file handling and many more.

Here are few example which show case how these utilities can make your code much cleaner, modular and more readable.

Copy “InputStream” to “OutputStream”

        InputStream is = CopyStreams.class.getResourceAsStream("test.txt");
        OutputStream os = System.out;
        ByteStreams.copy(is, os);

Changing “InputStream” to “byte[]”

        InputStream is = CopyStreams.class.getResourceAsStream("test.txt");

        byte[] isBytes = ByteStreams.toByteArray(is);      

 // Now if you want to get base64 encoded string then it will be like this  
        String isBase64Str = new sun.misc.BASE64Encoder().encode(isBytes);

Combining two files in one

        File input1 = new File("c:\\testio\\AWords.txt");
        File input2 = new File("c:\\testio\\BWords.txt");
        File output = new File("c:\\testio\\ABWords.txt");
        
        InputSupplier<InputStreamReader> rs1 = Files.newReaderSupplier(input1, Charsets.UTF_8);
        InputSupplier<InputStreamReader> rs2 = Files.newReaderSupplier(input2, Charsets.UTF_8);        
        InputSupplier<Reader> combined = CharStreams.join(rs1, rs2);
        
        OutputSupplier<OutputStreamWriter> ws = Files.newWriterSupplier(output, Charsets.UTF_8, false);
        CharStreams.copy(combined, ws);

Processing the file

public class IOTest {
    public static LineProcessor<List<String>> collectWordsStartWithZ = 
        new LineProcessor<List<String>>() {
            List<String> collector = Lists.newArrayList();
            final static String PREFIX = "z";
    
            @Override
            public boolean processLine(String line) {
                String line_ = Strings.nullToEmpty(line).trim().toLowerCase();
                if (!line_.isEmpty() && line_.startsWith(PREFIX)) {
                    collector.add(line);
                }
                return true;
            }
    
            @Override
            public List<String> getResult() {
                return collector;
            }
        };

    public static void main(String[] args) throws IOException {
        URL resource = IOTest.class.getResource("test.txt");
        List<String> lines = Resources.readLines(resource, Charsets.UTF_8, collectWordsStartWithZ);

        for (String line : lines) {
            System.out.println(line);
        }
    }
}

JavaScript [ExtJs3]: Total “Record” count in filtered store

2012-03-26T16:30:00.001+05:30

There is two way to get record count from the Store

store.getTotalCount()

This function depend on server response value. For accuracy of the value, property shell if return by the server.

Property name for the diff. reader:

totalProperty for JsonReader,

totalRecords for XmlReader

store.getCount()

Will return you the number of record from the store.
Or if you have filter on the store, it will give you the number of filtered record.

But if you want to get the total number of record regardless filtering, Then it will be like this

var totalRecords = store.snapshot ? store.snapshot.length : store.getCount();

“snapshot” is the variable in “Store” which hold the actual data in case if you have applied a filter.

Coding

Application Design Notes

CSS Specificity

Many time different CSS rules overlap on one or more element. And some people always get confuse about, which rule will take higher priority then other and why? CSS Specificity is the answer of all these kind of questions.

How to store user password at server!!!

You're Probably Storing Passwords Incorrectly

Storing Passwords - done right!"

Serious Security: How to store your users’ passwords safely

ERROR: Ignored call to 'alert()'. The document is sandboxed, and the 'allow-modals' keyword is not set.

JavaScript: Next Unique ID Function

JavaScript: Utility function to default function in parameters

JavaScript: Light weight wrapper class for window.localStorage

API functions

New Features and Enhancements from JDK-5 to JDK-7

JavaScript [ExtJs3]: Avoid default filtering in ComboBox

Think “SOLID”

Debugging common errors in ExtJs

“Bloom Filter” to optimize expensive data lookups

"Stop Words" in full text search

[JavaScript] Updating the existing function behaviour

JavaScript [Q.JS] Are you stuck in nested callback functions?

Google Guice: Dependency Injection with Guice 3.0

JavaScript: underscorejs with examples

Don’t reinvent the wheel: Some useful JS libraries

BOM Character: Unknown guest in your file

“80–20 rule” in Software - Some Interesting facts

Java: Singleton class - double-checked locking

Java: Strong References, Soft References and Weak References

Strong Reference

JMeter: Creating First Load Test

Guava: Some useful IO utilities

JavaScript [ExtJs3]: Total “Record” count in filtered store