Performance difference in JavaScript

LearningjQuery has an interesting article about different speeds of show and hide html elements.

From fast to slow:

  • Enabling/Disabling a stylesheet
  • .css(‘display’, ”), .css(‘display’, ‘none’)
  • addClass(), .removeClass()
  • .show(), .hide()
  • .toggle()
  • jQuery toggle seems to fail pretty bad speed wise, while the “Enabling/Disabling a stylesheet” seems to be such an usual approach and probably make it confusing to a lot web develoeprs (yours truly included: would have said WTF if hadn’t read the article).

    I’d go with .css(‘display’, ”), .css(‘display’, ‘none’) in the case where performance is important (i.e. multiple, alot of layers to be hidden or shown), and in other case, .show()/hide() or even toggle() seems to be fine to me. “Program Readability” > “Performance” in a lot of situations.

    Netbean Fonts & Colors Profile – Oblivion Revival

    *update 2011-02-10
    A IntelliJ/PhpStorm port of this is released here

    *update 2010-08-27
    Updated the color per Conrad’s request

    Made this based on the Oblivion color scheme on gEdit, it colors PHP/CSS/Javascript/HTML/etc in Netbeans, should work in all Netbean 6 versions.

    Download: oblivion_revival

    Use the Import function in options to import this color scheme.
    Tested under Netbeans 6.9. Remember to choose font & color in your options to enable this.