JavaScript went on to become cult right after its launch due to its extensive list of features. It also gave programmers the chance to give their webpages a more eye-popping look and website visitors were happier than ever.
Despite the large number of developers that sing the praises of JavaScript, there are those Internet users who see its dark side.
Webpages using multiple JavaScript codes are slow to load and overuse of JavaScript contributes to making webpages look cluttered and ugly. In no time the smart use of JavaScript became a hot topic amongst programmers.
Without further ado, let us dive into our list of JavaScript best practices that will save you from this unwanted criticism.
Keep it short, stupid!
You have read this a zillion times already. As a programmer/webmaster you might have applied this tip multiple times too but never forget this in case of JavaScript.
- Use comments and white spaces while in development mode to keep your code readable.
- Remove white spaces and comments before publishing your scripts in live environment. Also, try to shorten your variable and function names.
- Consider using third party tools to compress your JavaScript code before publishing the same.
Think before you touch object prototypes
Appending new properties to object prototypes is one of the most common reasons for script failures.
yourObject.prototype.anotherFunction = ‘Hello’;
yourObject.prototype.anotherMethod = function () { … };In above case all variables will be affected as they are inherited from “yourObject”. Such usage might cause unexpected behaviour. Henceforth, it is suggested to delete such modifications right after its usage:
yourObject.prototype.anotherFunction = ‘Hello’;
yourObject.prototype.anotherMethod = function () { … };
test.anotherMethod();
delete yourObject.prototype.anotherFunction = ‘Hello’;
delete yourObject.prototype.anotherMethod = function () { … };Debug JavaScript Code
Even the best programmers make mistakes. To limit them, run your JavaScript code through a JavaScript debugger to make sure that you haven’t made any silly blunders that can easily be prevented.
Avoid Eval
Your JavaScript can work well without the use of “eval” function. For those not aware, “eval” gives access to JavaScript compiler. If a string is passed as parameter of “eval” then its result can be executed.
This will degrade your code’s performance though it acts as a boon during development phase. Avoid “eval” in live environment.
Minimize DOM access
DOM is one of the most complex APIs that slows down the code execution process. At times the webpage might not load or it might load incompletely. Better to avoid DOM.
Learn JavaScript before using JavaScript libraries
Internet is chock full of JavaScript libraries that perform various functions. Programmers end up using JavaScript libraries without understanding the side effects of the same. It is strongly advisable to learn the basics of JavaScript before using third party JavaScript libraries; otherwise, be prepared for disastrous results.
Never use “SetTimeOut” and “SetInterval” as alternatives to “Eval”
setTimeOut( “document.getID(‘value’)”, 3000);In above code document.getID(‘value’) is used as a string that is processed within the “setTimeOut” function. This is similar to “eval” function which executes a string during every execution of code thus degrading performance. Henceforth, it is suggested to pass a function within such functions:
setTimeOut(yourFunction, 3000);[] is better than “new Array();”
“A common error in JavaScript programs is to use an object when an array is required or an array when an object is required. The rule is simple: when the property names are small sequential integers, you should use an array. Otherwise, use an object.” – Douglas Crockford, writer of JavaScript: Good Parts.
Suggested:
var a = [‘1A’,’2B’];Avoid:
var a = new Array();
a[0] = “1A”;
a[1] = “2B”;Never use “var” multiple times
While initializing every variable programmers tend to use “var” keyword. Instead, it is suggested that you use commas to avoid redundancy of keywords and reduce code size:
var variableOne = ‘string 1’,
variableTwo = ‘string 2’,
variableThree = ‘string 3’;Never Miss Semicolons
This is one of the programming bugs that can consume hours of debugging. Personally, I have spent hours looking for problems in my code when the reason was the missing semicolon.
I am pretty sure that you must have read most of the above points but at times we tend to ignore the basics. Did you ever miss a semicolon? Has “eval” keyword messed up your code’s performance?
