JavaScript Best Practices by Christian Heilman

28 Oct 2009 4 Comments

The following is a presentation of well thought-out JavaScript tips and best practices by Christian Heilmann.

His tips include:

  • Make it understandable
  • Avoid globals
  • Stick to a strict coding style
  • Comment as much as needed but not more
  • Avoid mixing with other technologies
  • Use shortcut notations
  • Modularize
  • Enhance progressively
  • Allow for configuration and translation
  • Avoid heavy nesting
  • Optimize loops
  • Keep DOM access to a minimum
  • Don’t yield to browser whims
  • Don’t trust any data
  • Add functionality with JavaScript, not content
  • Build on the shoulders of giants
  • Development code is not live code

 

Related posts:

  1. Warn visitors to upgrade from Internet Explorer 6 (IE6) with a simple JavaScript
  2. Minify JavaScript code to obfuscate details and decrease load times
  3. 10 Cost-Effective web development tips by Drew McLellan
  4. 12 Tips to improve your jQuery code
  5. Disabling auto-formatting of telephone numbers by the Skype Browser Plugin
Twitter Digg Delicious Stumbleupon Technorati Facebook Email
coding, javascript, tips & tricks
, , , , , ,

4 Responses to “JavaScript Best Practices by Christian Heilman”

  1. Balaji Reply 28 Oct 2009 at 17:49

    Have you given any thoughts to JavaScript Best Practices by Christian Heilman? I’ve been hard pressed to find good resources, and judging from this article I’m guessing you may have something valuable to say. Thanks in advance!

  2. iresha Reply 29 Oct 2009 at 12:55

    I really like the “add functionality, not content” bit. That really rings true with me

  3. willem Reply 30 Oct 2009 at 09:23

    @Balaji: Some notes on this slideshow:

    —

    As for variable names, I like the following schema:

    [descriptive]{object}{attribute}

    … interpreted as:

    newCustomerId
validContactNumber

    … etc.

    —

    I agree with him that “good code explains itself” is an arrogant myth. Developers should comment all code where it’s purpose isn’t clear at a glance.

    His idea that comments shouldn’t go out to the end user ties in with my feeling on minifying code: On a development server you can use commented and un-minified code, but when you take a system live you should optimize it as much as possible.

    —

    Shortcut notations are, in my opinion, just as important to learn as regular expressions. So, use this:

    var x = v || 10;

    … instead of:

    if(v){
  var x = v;
} else {
  var x = 10;
}

    —

    His notes on loops tie in with my 4th point here:

    http://www.geekology.co.za/blog/2009/10/12-tips-improve-your-jquery-code/

    Loops are expensive, especially if they traverse arrays or the DOM, so optimize them where you can.

    —

    Finally and very importantly, build on the shoulders of giants: Find a good framework and learn how to use it. Frameworks cater for many browser issues and will let you approach problems in the same way no matter which browser the user has.

Trackbacks/Pingbacks

  1. Willem van Zyl (willemvzyl) « JavaScript Best Practices by Christian Heilman | Geekology « Chat Catcher - 28 Oct 2009

    [...] 2009-10-28T04:59:20  Great slideshow, thanks @costab :) . JavaScript Best Practices by Christian Heilman – [link to post] [...]
Afrigator