116
xorith
8y

Spaces Vs Tabs - A real world case.

So one of the menial tasks I was given here was to take a pretty mock and turn it into an HTML email template. Needless to say, I hate emails and HTML.

After many weeks of trial and error, rejection and tweaks, we're doing our final tests when someone noticed that Google's clients are chopping off the footer and saying "View Full Email".

A few searches yield that Google has a 102KB cut off for email size. We did some checks and found that we were at 104KB. I immediately thought it was my CSS inliner being a little too verbose, but as I went in to edit things, I noticed that the file was intended with spaces!

Now I'm a fan of Silicon Valley, and I recalled an episode from this past season where Richard mentioned something about saving file size by using tabs. I had never really considered that point.

So I went back into VSCode and told it to convert all of the individual templates that make up this giant email to indent with tabs...

The file size dropped from 104kb to 82kb.

I wasn't very polarized on the Tabs vs Spaces debate, but this here has given me a nice real world example as to why tabs rule.

Comments
  • 14
    I think tabs might be better for web stuff, especially since it has to be downloaded, it saves space. but all else, I think as long as the project stays uniform and consistent, either or will do.
  • 3
    @vinerz The build process isn't mine, but minifying is being looked in to now.

    Still. :P
  • 4
    Tbh I think that as long as everyone uses the same standard in your company it's fine. It's when you have a standard and people don't follow it that performing merges or file difference operations become a nightmare when trying to commit to source control.
  • 5
    Yes, TABS!
  • 7
    i hate when sometimes ide or code editor uses tab key as autocomplete key .
    just fuck them!!
  • 1
    Now it's mostly, Ctrl+Space and you can change it in the 99% of the IDEs and 100% of mature IDEs.
    @mohit3112
  • 4
    You should always minify the files and tabs space doesn't even matter
  • 1
    @tahnik
    Yes. On this I was only the guy who had the horrible job of taking a mock and making something that looked similar but worked in a majority of email clients.

    Another dev took the (several) pieces of the conditional email template and stitched them together.

    When it came back as "too long", it was kicked back to me.
  • 3
    Huh. This is the first solid argument I've heard.
  • 1
    Minifying inline CSS is a pain, tbh. Want to edit? Time to unminify
  • 1
    Definitely TABS 😉
  • 2
    @SithLord umm, not really.You can write code normally with beautiful syntax and use webpack with uglify to minify it before serving. It takes a bit of time to understand webpack but that's what we all do right? Learn new stuff!
  • 2
    @tahnik i learn new stuff all the time :)
  • 2
    @SithLord

    I have a gulpfile that handles all that. I work on clean HTML broken out into various templates as the email is conditionally generated (not all recipients get all the bits and pieces)

    So I fire off a process that in-lines the CSS into each template. Then the developer on the back-end picks and chooses which bits and pieces to include when generating the email.

    I always have a non-ugly source handy. :)
  • 1
    Good to know I've saved TBs on bandwidth
  • 1
    u opened my eyes :/
  • 0
    @SithLord why the hell you are using inline css
  • 0
    @vikaskr When doing email campaigns, inline CSS is a requirement. But usually it's an automated process before sending and not kept that way.
  • 0
    @xorith so that is a particular case. I prefer spaces, because i don't want to mix tabs and spaces. When a particular statement it too long , i prefer breaking it into two lines and by prepending 1-2 spaces it looks elegent. In case of tabs i have to mix tabs and spaces. If if use tabs to adjust a single statement broken into two lines it never aligns.
  • 0
    Tabs ftw. One tab = one indent, then you can tell your IDE/editor to make one tab appear as wide as you want without ever touching the code. You can't do that with spaces.
Add Comment