Google Coders Need To Go On An HTML Diet

[jasonkester]

It's worth noting that those 400 lines are not what's sent over the wire. Generally, you'll send something like this as a little snippet of JSON then tear it apart on the client and construct whatever HTML you need to render it nicely.

I suspect the author had a look in Firebug and came to the wrong conclusion.

So no, it's not bloat. It's just presentation.

[msy]

Just because it's only presentation doesn't mean it's not bloat. Assuming this is a rendered JSON object that's still a ton of extra HTML elements and CSS to render/instantiate than should be necessary to produce the same effect and while that might not be noticeable on your top-end MBP with safari for a lot of devices it does.

It's also just poor craftmanship, I think that's what really bugs me.

[masklinn]

> So no, it's not bloat. It's just presentation.

The overly complex and messy generation of crappy HTML is bloat.

[daleharvey]

when you work on something significantly more complicated than a run of the mill django/rails type website, you quickly find out that a lot of the "bad practices" you taught yourself out of, can actually be actually completely necessary

inline styles and javascript are really really fast, innerhtml can be a lot faster than dom methods, doing everything with fancy css selectors is a good way to completely kill a page and destroying your markup by adding html over the place and id='' attribute on everything, can actually be the right thing to do.

[iamelgringo]

I noticed that when I first started thinking about the Css v tables debate. Google uses a fair number of tables for layout in its designs. Noodle around on Google's site with the web developer toolbar and Outline->Tables->Table Cells. If you're a CSS purist, you'll be horrified. Google's front page makes prominent use of a table for layout. The autosuggest drop down is also a table. Gmail: tables all the time.

[baddox]

Actually. ;)

[scott_s]

  #include <stdio.h>

  int main()
  {
    printf("Hello World!");
    return 0;
  }

Becomes:

    .cstring
  LC0:
    .ascii "Hello World!\0"
    .text
  .globl _main
  _main:
    pushl   %ebp
    movl    %esp, %ebp
    pushl   %ebx
    subl    $20, %esp
    call    L3
  "L00000000001$pb":
  L3:
    popl    %ebx
    leal    LC0-"L00000000001$pb"(%ebx), %eax
    movl    %eax, (%esp)
    call    L_printf$stub
    movl    $0, %eax
    addl    $20, %esp
    popl    %ebx
    leave
    ret
    .section __IMPORT,__jump_table,symbol_stubs,
      self_modifying_code+pure_instructions,5
  L_printf$stub:
    .indirect_symbol _printf
    hlt ; hlt ; hlt ; hlt ; hlt
    .subsections_via_symbols

Look at all that bloat! I just want to write out "Hello World" to the screen. Why do I need to create a function stack of 20 whole bytes? What a waste! And when I do that, I have to go through the onerous effort of saving my stack pointer to a whole 'nother register. What a waste of my system resources.

It's bad enough I have to call printf in the first place when I really could just use the write system call, but look how it doesn't even call printf right away! First I have to call some locally defined function which has to allocate even more space for another stack. More waste and bloat. And look at how all of this is organized, these sections are completely unnecessary. I just want to write out something to the screen! I don't need this level of organization and abstraction to do this simple task.

[tumult]

Who cares, if it works? I don't personally consider HTML and CSS either elegant or efficient, so if they've abstracted over it in order to do things, and it works, what's the big deal? HTML by hand seems mostly like a waste of time, to me. Most of the impressive web apps don't do much markup and styling by hand. Cappuccino/Objective-J is an extreme (and good) example of this.

[mr_eel]

Well personally I care about good craft and elegance. These are subjective to be sure.

But I'm immediately suspicious of the statement "who cares if it works?". As if any old rubbish will do. I have a pact with myself; I'll stop working with the web if I ever gain that attitude. Nothing more depressing than a tradesman that doesn't respect his tools.

[geekypeek]

I'm the author, this is definitely sent over the wire as I'm building code that is scraping it right now (which I'll opensource soon). Since I deal in the mobile world, its especially critical to keep bloat minimal so people don't pay data charges for your poor coding. I hate fatty, fat code.

[mey]

GWT at work?

http://code.google.com/webtoolkit/

[Robin_Message]

None of the class names used are GWT class names, so I doubt it. It'll be the output of an internal template engine. Interestingly, AFAIK, most of Google is not written in GWT -- anyone know any production Google stuff that is? (I think Wave is.)

[philfreo]

While I agree this example is pretty ridiculous, Google is spending a lot more time innovating in web performance than most

[gruseom]

Yes. Moreover, web performance was one of Google's differentiating features right from the beginning. Arguably the most important, in fact.

[eli]

Given the choice between elegant high-level code that generates verbose and ugly HTML versus complicated and ugly high-level code that generates very tight HTML, I know which I'd choose.

[tszming]

Send the link to Steve Souders. (www.stevesouders.com)

[tzury]

If one will inspect a blip in the google wave, one cannot think how many Wikipedia's articles could those bytes feed.

I suspect it has allot to do with the GWT.

a .NET DataGrid or whatever it is called these days would looks just the same comparing to a simple HTML table structure.

[jonursenbach]

I'd be curious to see how much bandwidth they save by cutting this down a hundred lines.

[bnoordhuis]

As jasonkester pointed out, the HTML is only sent out once and then dynamically updated with AJAX (or AJAJ, as the case may be). So in the grand scheme of things, those few hundred lines of HTML don't matter much.

[sliverstorm]

Ahh, bloat at it's best. If we could understand machine code as easily, we'd probably see the same sort of thing at the core of a lot of software.

[lancashire]

Don't show him Google Calendar.