@Joss internet connections may be getting faster but there’s two very good reasons why you should be concerned with these sort of code optimisations:
Access to the Internet via mobiles is increasing at a much faster rate than for desktops, and file size is still a concern for most, not only in how long you have to wait, but in how much you have to pay.
Google has just announced that page speed will be included in their algorithm for search results, so page optimisation will also be an SEO factor.
@Aaron – You would be surprised. There are definitely people still using “with”, but moreso eval(). Since JSON became popular, and native JSON parsing has only recently been introduced, most JavaScript libraries used eval(), and as such, didn’t get the best compression of their code.
optimizing the code is something any developer should do
I can’t agree with this—any developer should be able to optimise code, but only when it is shown to be necessary. I completely agree with aaron and dsevil re the reasons not to use eval and with, but any kind of optimisation that reduces code readability/maintainability (and most do) should only be used when it has been proved that it is essential.
Copy & paste the code below to embed this comment.
atk
The compressed code is not debuggable anymore, since all of it is in 1 line (JavaScript Error messages tell only the line number on which the error occurred).
Google’s Closure Compiler has another problem in its maximum compression mode: it cannot recognize instances or properties which are dynamically addressed. Since Closure compiler does not detect its use, it will treat the instance/property as unused and remove its definition from the code.
More than that, the code is not readable anymore without the use of some source beautifier or unpacker.
In some cases, the minification leads to bigger compressed files – especially if one replaces window or document with a shorthand, because those cannot be compressed much further.
BTW, it helps to keep the memory footprint of your JS small even without compression. Since there is a lack for very small Toolkits, it started one myself: http://tinyjs.sf.net – in the next version, I want to remove those selectors which are not very useful in normal cases to an external plugin.
This is just my two cents, but really, I’m surprised by how much this “minification/optimization makes debugging harder” argument still comes up. A simple one step build process which takes your CSS and JS and minifies/optimizes it isn’t that hard to come up with. I use a little Ruby script for that but you can even do it by hand! Just make sure you are using an scm tool like Git (in case you screw something up) and also that you have separate development and staging directories.
As someone who is going to school for Graphic Design/Website Design. This is one of those articles that teaches you something that they don’t teach in school. This is something i’ll certainly keep in mind, when using JS. :-)
I recommend this site for anyone who likes playing in the bingo hall but likes online aswell!bingo is very crazy and popular game.It is a game of chance in which each player has one or more cards printed with differently numbered squares on which to place markers when the respective numbers are drawn and announced by a caller.I like to play bingo online….http://www.888enjoy.eu..
21 Reader Comments
Back to the ArticleJohn Faulds
@Joss internet connections may be getting faster but there’s two very good reasons why you should be concerned with these sort of code optimisations:
Nicholas C. Zakas
@Aaron – You would be surprised. There are definitely people still using “with”, but moreso eval(). Since JSON became popular, and native JSON parsing has only recently been introduced, most JavaScript libraries used eval(), and as such, didn’t get the best compression of their code.
skilldrick
@Tasarım –
I can’t agree with this—any developer should be able to optimise code, but only when it is shown to be necessary. I completely agree with aaron and dsevil re the reasons not to use eval and with, but any kind of optimisation that reduces code readability/maintainability (and most do) should only be used when it has been proved that it is essential.
atk
The compressed code is not debuggable anymore, since all of it is in 1 line (JavaScript Error messages tell only the line number on which the error occurred).
Google’s Closure Compiler has another problem in its maximum compression mode: it cannot recognize instances or properties which are dynamically addressed. Since Closure compiler does not detect its use, it will treat the instance/property as unused and remove its definition from the code.
More than that, the code is not readable anymore without the use of some source beautifier or unpacker.
In some cases, the minification leads to bigger compressed files – especially if one replaces window or document with a shorthand, because those cannot be compressed much further.
BTW, it helps to keep the memory footprint of your JS small even without compression. Since there is a lack for very small Toolkits, it started one myself: http://tinyjs.sf.net – in the next version, I want to remove those selectors which are not very useful in normal cases to an external plugin.
Stargazer
Very nice article. Some extremely good points.
Clea Walford
very nice and interesting article Nicholas – and thanks for telling us why not to use eval and with!
Thiago Cavalcanti
This is just my two cents, but really, I’m surprised by how much this “minification/optimization makes debugging harder” argument still comes up. A simple one step build process which takes your CSS and JS and minifies/optimizes it isn’t that hard to come up with. I use a little Ruby script for that but you can even do it by hand! Just make sure you are using an scm tool like Git (in case you screw something up) and also that you have separate development and staging directories.
Nicholas C. Zakas
@Thiago – You’re definitely not the only one. There’s actually a chapter in my latest book, High Performance JavaScript, that covers this very topic.
jcgallaher
As someone who is going to school for Graphic Design/Website Design. This is one of those articles that teaches you something that they don’t teach in school. This is something i’ll certainly keep in mind, when using JS. :-)
Nicolas Chevallier
Thanks for sharing these tips about boosting YUI compressor ratio.
I already try to never use eval or with statement, and I will continue !
Betting
I recommend this site for anyone who likes playing in the bingo hall but likes online aswell!bingo is very crazy and popular game.It is a game of chance in which each player has one or more cards printed with differently numbered squares on which to place markers when the respective numbers are drawn and announced by a caller.I like to play bingo online….http://www.888enjoy.eu..