How to optimise JS code for minimisation purposes
What it is about
- Writing a code which can be efficiently minimised
- Discovering tricks to write short code
- Use language flexibility to achieve the previous points
What it is not about
- Optimisation on the code's performances
Why?
- Smaller code == less bandwidth == faster app
- Some advanced techniques good to know for any developer
- Because it's fun
Kind of changes
- The good
- The bad
- The ugly
The good changes
- Code readability not really reduced
- Will save bytes during the code minimisation
var keyword factorisation
- If var not factorised, YUI Compressor will fail
- Cafeful with commas vs semi column
var keyword factorisation
Duplicated strings
- Strings are not minimisable
- Sometimes useful to factorise them
When?
Duplicated strings
Depends on the the string's length and the number of times it's repeated.
Duplicated string - case 1
Duplicated strings - case 2
Arrays vs Objects
- Objects' attributes are not minimised
- Attributes can be used as array's elements
- array's elements are strings
Arrays vs Objects
Arrays vs Objects
- Depends also on the size of the used attributes and of the number of times they are used
Know your operators
- classic operations (+, -, /, *)
- bitwise operations (|, &, ^, ~)
- To work with integers (as results)
~ operator
- Bit definition: one-complement, switch every 1-bits to 0 and 0-bits to 1
- Integer definition: For signed integers, ~a = -1*a - 1
- Interesting case: ~-1 = 0
~ operator
Floor operation
The bad changes
- Will not help to minimise
- Will reduce the code's readability
Comments
Comments are just removed in a minimised code, don't feel bad about commenting your code
Spaces
All useless spaces will be removed from the code, let your code breathe.
Variables names
Variables are automatically renamed, so use meaningful names.
The ugly changes
- Useful changes to minimise the code
- Highly reduce the code readability
- To use only if the code must be as small as possible, at any price
Example
https://github.com/jed/140bytes/wiki/Byte-saving-techniques
Only in JavaScript?
Some of those tricks are useful in other languages, but mostly for fun or challenging purposes.
Conclusion
- Duplicated code can often be optimised
- Optimise only when your code is ready
- Have fun playing arround with the languages