Why you should care about whitespace

Why you should care about whitespace

Short talk about the importance of handling whitespace properly to improve the authoring experience and diffs quality. MercadoLibre Front-end Meetup. December, 2014.

B35b6fc3b6a61787be1b3750511fbd95?s=128

Luciano Battagliero

December 12, 2014
Tweet

Transcript

  1. 5.
  2. 6.

    Unless you’re programming in whitespace, then it’s kind of a

    big deal... and maybe you’re with too much time in your hands
  3. 22.
  4. 23.

    Tab

  5. 26.
  6. 32.

    var foobar = function(obj, attrs) { ··var i = 0,

    ······len = obj.length; ··for (i; i < len; i++) { … } }
  7. 33.
  8. 36.

    var foobar = function(obj, attrs) { ——var i = 0,

    ——————len = obj.length; ——for (i; i < len; i++) { … } }
  9. 37.
  10. 39.

    var foobar = function(obj, attrs) { ——var i = 0,

    ——····len = obj.length; ——for (i; i < len; i++) { … } }
  11. 42.

    var foobar = function(obj, attrs) { ——var i = 0,

    ··————len = obj.length; ··for (i; i < len; i++) { … } }
  12. 43.

    Tab stops that don’t correlate with the amount of space

    characters could result in code that is really hard to read
  13. 44.

    var foobar = function(obj, attrs) { ———var i = 0,

    ··——————len = obj.length; ··for (i; i < len; i++) { … } }
  14. 52.

    var foobar = function(obj, attrs) {· ··var i = 0,···

    ······len = obj.length;·· ·········· ··for (i; i < len; i++) { … } }····
  15. 54.

    Do you want to go to the end of the

    line with a keystroke? Good luck!
  16. 56.

    var foobar = function(obj, attrs) { ··var i = 0,

    ······len = obj.length; ··for (i; i < len; i++) { … } }
  17. 62.

    var foobar = function(obj, attrs) {¬ ··var i = 0,¬

    ······len = obj.length;¬ ¬ ··for (i; i < len; i++) { … }¬ }¬
  18. 64.

    var foobar = function(obj, attrs) {\n ··var i = 0,\n

    ······len = obj.length;\n \n ··for (i; i < len; i++) { … }\n }\n
  19. 66.

    var foobar = function(obj, attrs) {\r ··var i = 0,\r

    ······len = obj.length;\r \r ··for (i; i < len; i++) { … }\r }\r
  20. 68.

    var foobar = function(obj, attrs) {\r\n ··var i = 0,\r\n

    ······len = obj.length;\r\n \r\n ··for (i; i < len; i++) { … }\r\n }\r\n
  21. 71.

    var foobar = function(obj, attrs) {\r ··var i = 0,\r\n

    ······len = obj.length;\n \n ··for (i; i < len; i++) { … }\r\n }\r
  22. 73.

    Psst! Git will consider that the whole line was modified

    even if the only change was the newline character
  23. 74.

    Oh! Good luck with a merge conflict in a file

    that uses different newline characters
  24. 83.

    Some files without a newline character at the end of

    it may not be recognised as a proper text file
  25. 84.

    Certain utilities could behave oddly if they aren’t able to

    recognize the end of a file and the beginning of another
  26. 95.

    Avoid to commit changes in lines where only whitespace has

    been modified together with changes in the code
  27. 98.

    root = true [*] charset = utf-8 end_of_line = lf

    indent_style = space indent_size = 4 insert_final_newline = true trim_trailing_whitespace = true
  28. 107.
  29. 108.