set up a node environment

May 14th, 2013 § 0 comments § permalink

Setting up a development environment starts with installing a version manager, so that we can install different versions and switch and test to versions we needed. For nodejs development environment, I start with installing node version manager, NVM.

Installing NVM

The installation of NVM is quite simple, either you can run install script or do it manually by cloning the git repo. I find the install script as handy.

https://raw.github.com/creationix/nvm/master/install.sh | sh

OR you can clone the git repo

git clone git://github.com/creationix/nvm.git ~/.nvm

Then add the following to your .bashrc file. if you are using zsh, add to .zshrc file.

 . ~/.nvm/nvm.sh

Install the node

Install the node versions you need.

nvm install v0.10.5

npm.js will be installed by default with nodejs version > 0.10.0

Switch the version you need using the command

nvm use v0.10.5

Install packages

Now you can install the packages globally or locally, as your need. You won’t require to use sudo when installing packages globally.

npm install -g grunt-cli

Hooray, you are done. Try node on terminal to enter into node console.

Thank you.

 

Get ubuntu codename

April 7th, 2013 § 0 comments § permalink

Here is simple command which can give you the codeaname of your ubuntu distribution

here is result after running on my machine.

Ubuntu codename

Ubuntu codename

 

writing js module compatible for node and browser

April 4th, 2013 § 0 comments § permalink

This is a simple blog post which will help you to write js modules which is compatible to node and browser.

In this I am writing a module named mylibrary which can used in both node environment and browser environment.

In mylibrary we have firstFunction and secondFunction as methods.

For browser we can use the methods as

In node Environment

Thats it.

Thanks.

Reducing reflow using DocumentFragement

April 3rd, 2013 § 0 comments § permalink

This is a simple post which will demonstrate how you can reduce the reflow in browser and enhance the performance of the webpage. Before getting started with it lets look into what is reflow?

what is reflow?

According to Google,

Reflow is the name of the web browser process for re-calculating the positions and geometries of elements in the document, for the purpose of re-rendering part or all of the document.

So any actions, like adding an element to DOM, changing style or position of element etc may lead to reflow. Since this is really an expensive operation we have to reduce to get maximum performance.

Using DocumentFragement

Consider a case that you have a <ul> tag and you need to append 5 <li> tags into it.

Of course this code will works fine, But the issue is the appendChild is called in side loop, means 5 times it append a new element to DOM which leads to 5 reflow. Here is the rewrite for the same functionality.

Here we Introduced a new element called DocmentFragment. According to Mozilla,

A DocumentFragment is a minimal document object that has no parent. It is used as a light-weight version of document to store well-formed or potentially non-well-formed fragments of XML.

Since it is an Document object you can access it a like a node/container and call any document method, But since it doesn’t have a root node and not a part of DOM appending to documentFrament won’t trigger a reflow.

Thats where our second part gain importance, In that we create a documentFragment and append the <li> initially into it while in the loop. So the DocumentFragment can hold it like <ul> itself. Then We append the DocumentFragment to the <ul> in DOM, after exiting the loop, means the reflow will trigger only once even though we appended 5 <li> tags.

Now we reduced reflow to 1 instead of 5.

Thanks

Javascript : constructor pattern

March 1st, 2013 § 0 comments § permalink

Its just a simple demo of constructor pattern on Javascript. In case if you didn’t noticed, in my last post I ready used constructor pattern with Object.create.

In Vanilla JS

I recommend, you should checkout why you should use prototype instead of this.

jsperf : prototype v/s this

In CoffeeScript

Simple inheritance in ECMAScript 5

February 26th, 2013 § 1 comment § permalink

Here is the simple inheritance in Javascript (ECMAScript 5).

Avoid function redefinition using prototype

February 6th, 2013 § 1 comment § permalink

The problem of function redefinition

Here is the simple javascript constructor pattern,  in the first look it looks good and of-course it works fine.

function Person(name, school, college){
	this.name = name;
	this.school = school;
	this.college = college;

	this.toString = function(){
		return this.name + " attended " + this.school + " and " + this.college;
	};
}

var first = new Person("Revath", "st. Joseph's BHSS", "NTTF");
var second = new Person("S Kumar", "Model HSS", "Nettur");
console.log(first.toString());
console.log(second.toString());

The issue in this piece of code is toString() method. The toString() will be redefined for each new objects. Ideally every method should be shared by every instance of Person.

The solution using prototype

Here is the simple work around to get rid of this.

function Person(name, school, college){
	this.name = name;
	this.school = school;
	this.college = college;
}

Person.prototype.toString = function(){		
	return this.name + " attended " + this.school + " and " + this.college;
};

var first = new Person("Revath", "st. Joseph's BHSS", "NTTF");
var second = new Person("S Kumar", "Model HSS", "Nettur");
console.log(first.toString());
console.log(second.toString());

This prototype method will save memory since it uses the same object of toString method with all the instances of Person.  Using `this` results each instance having independent copy of function toString.

Git : delete remote branch

January 26th, 2013 § 0 comments § permalink

Delete local branch

Deleting a local git branch is easy, using options `-d` or `-D` will do it. Its is always safe to use `-d` option because it won’t allow us to delete unmerged branch, where as `-D` will delete the unmerged branch without any warning or notification.

git branch -d branch_name_to_delete

But this will delete only branch in our local system.

Delete remote branch

So how can we delete a remote branch? Any way none of the option for git branch won’t delete it. Remote branch can only deleted by using git push command.

 git push origin :branch_name_to_delete

You have to notice the full-colon (:) prefixed to the branch name. The prefixed colon is the one asking git to do the trick.

Thanks.

Some useful screen commands

January 25th, 2013 § 0 comments § permalink

For multi-tasking on unix server either we need login into server from multiple terminals. But screen program make this easy and we can open multiple windows from the same login.
Main hi-light of this screen program is even though we lost the connection to server, the screen windows survive and we can resume after the nextlogin.  So screen will be useful to run some tedious tasks, so that it will execute in the separate screen and continue the execution even after the ssh connection is timeout.
We can name each screen that we create so that we can easily resume it on next login.
Here are the some useful command for the smooth usage of screen program on server.
screen -S <name> start new screen
 Ctrl + a + c  create new window
 Ctrl + d  close the current window
 Ctrl + a + d  Detach a window
 Ctrl + a + ”  list windows and select
 Ctrl + a + n  next window
 Ctrl + a + p /
Ctrl + a + backspace		  previous window
 Ctrl + a + S  split horizontally
 Ctrl + a  |  split vertically
 Ctrl + a TAB  switch the screen
 Ctrl + a Q  to full screen (remove split)
 screen -x   list all screens
 screen -r <pid.screenname>   resume screen
This is just a beginning. There are lot more to it.
Try man screen to learn more about it
Thanks

awk : find sum of a column

January 24th, 2013 § 0 comments § permalink

Recently I had a situation that I need to find the sum of the values of a particular column in a tab seperated file. Using Excel/Libre office will be too expensive since it contains around > 40K rows. The same file looks like,
sample.txt

A        10 
B        20 
C        30 
D        40 
E        50 
F        60

Here I need to find the sum of second column. For me easy way find is writing a awk script. Here it is

Here `-F` option will notify awk that imput is a tab seperated file. So the awk will divide the columns based on tabs(\t).

$2 is the column number which we need to find the sum. Here it is $2 since we are summing second column. if it is first column then it should be replaced with $1.

The command outputs  210.

Thanks.

« Older Entries