On Flipboard.com and Idealism vs. Pragmatism

Warning This article was written over six months ago, and may contain outdated information.

I’ve been think­ing a lot recent­ly about the clash between ide­al­ism and prag­ma­tism. I’ve been work­ing on the Web for many years, and for much of that time I’ve tried to do things the ‘right’ way; stan­dards-com­pli­ant, val­i­dat­ed, mobile-first, respon­sive, acces­si­ble, clean, exten­si­ble, etc. I’m def­i­nite­ly not claim­ing that I’ve always suc­ceed­ed, but the inten­tion and effort was there.

In the past few years the explo­sive growth of the Web, and the devices used to access it, has meant a par­al­lel increase in the pow­er and com­plex­i­ty of the tools need­ed to build it. And of course we want to make sites that are fast and light and per­form com­pet­i­tive­ly with native apps. But I think in this sharp focus on the tech­ni­cal side of build­ing, we risk los­ing sight of why we are build­ing, and who for.

Late last year I attend­ed Front End Lon­don, where James Hig­gs, the Tech­ni­cal Direc­tor of Made By Many, gave a great talk on trade-offs; when it’s okay not to be per­fect, when PHP is bet­ter than Python, when the ‘right’ approach has to make way for the ‘good enough’. His talk real­ly had me nod­ding along in agree­ment, and it con­tains a quote I just love:

Your per­son­al pro­duc­tiv­i­ty, or pride in the clean­li­ness of your work, are not legit­i­mate goals in themselves.

Last week, David Bush­nell wrote When can a web­site be over 1mb?, in which he chal­lenged the pre­vail­ing ‘no heavy sites’ ortho­doxy, refut­ing crit­i­cism of an expe­ri­en­tial site for the Nin­ten­do game, Majora’s Mask:

It’s impos­si­ble to deliv­er the kind of visu­al fideli­ty Majora’s Mask offers with­out fat con­tent. How do you spark the imag­i­na­tion — rekin­dle child­hood mem­o­ries — with some bor­ing “flat design” bol­locks? The load is worth it.

Which brings us to Flip­board. This week they announced their Web ver­sion, and in an intro­duc­to­ry blog post they explained that they found the DOM too slow to achieve 60fps scrolling on mobile, so reim­ple­ment­ed it using react.js and canvas. Essen­tial­ly it turned their main page into a sin­gle image, in the process los­ing the abil­i­ties to select text, search in the page, or – much worse – be read­able by assis­tive tech­nol­o­gy. On Hack­er News, Nick Williams very neat­ly artic­u­lat­ed my opin­ion of the result:

[This shows] the flex­i­bil­i­ty and pow­er of Reac­t’s com­po­nent and ren­der mod­el. It’ll prob­a­bly have a big impact on game UI for the web. [But] doing this on a con­tent-dri­ven site is absolute mad­ness. It breaks so many things, and throws away so many fun­da­men­tal tenets of the web. By the time they’ve reim­ple­ment­ed every­thing they’ll have prob­a­bly lost all per­for­mance wins. The fan­cy ani­ma­tions are a minus­cule gain for such a great loss of functionality.

I’m not going to go to deep into why I think this is such a bad idea — Faruk Ateş does that much bet­ter in his post How Flip­board Chose Form Over Func­tion For Their Web Ver­sion — but I will say that it’s symp­to­matic of the way that, for some (many?) devel­op­ers today, tech­ni­cal ide­al­ism is val­ued over prag­ma­tism. The obses­sion with 60fps has lead Flip­board to com­plete­ly reim­ple­ment the DOM, but with­out any of the things that the DOM is good for, rein­tro­duc­ing many of the prob­lems that we fought against for many years in the form of Flash.

This is like mak­ing your car­go boat go faster by not car­ry­ing any cargo.

I should add — as if it need­ed to be said — I’m not argu­ing for doing a shod­dy job of cod­ing, or for not car­ing about file size and load times, or against the pur­suit of the best pos­si­ble scrolling per­for­mance. But the quest for tech­ni­cal per­fec­tion can’t come at the expense of a solu­tion that’s best for every­one. An ide­al is a wor­thy end goal, some­thing to strive for; but to reach it, it’s vital to take prag­mat­ic steps.

Update: Nice bal­anced piece by Chris­t­ian Heil­mann: Flip­board and the “mobile web” dream… I should have made it clear­er in my arti­cle above that I do appre­ci­ate the tech­ni­cal effort that went into react-can­vas; it’s impres­sive work, it’s just inap­pro­pri­ate­ly applied.

3 comments on
“On Flipboard.com and Idealism vs. Pragmatism”

  1. The prob­lem, the DOM is bro­ken by design, and by back­ward com­pat­i­bil­i­ty it needs to car­ry over. DOM imple­men­ta­tions need to stay com­pat­i­ble with web­sites made in 1996. If spec­i­fiers could start over today, they would­n’t come with all that bloat, and imple­menters could work on mak­ing some­thing fast by default.

    And nobody wants to break the Web. So that means the Web is slow by design, and for the longer it lives, the slow­er it will get — because of back­ward compatibility.

    Solu­tions are being worked out, work­ers, e10s, js engine opti­miza­tions and so on, but you can’t com­pete with ensur­ing com­pat with mre than 20 years of added tech­ni­cal debt.

  2. […] Link: [http://www.broken-links.com/2015/02/13/flipboard-com-idealism-vs-pragmatism/]. […]

  3. You redis­cov­ered why flash is good at what it’s meant to do and HMTL is not good in the same domains, because even if it copied every new gad­get from flash, they are just patch­es that don’t redesign the core of the tech. When HTML5 will be fin­ished, I mean that all the fea­tures will run smooth­ly on all the major brows­er on 98% of the real users(2030), it will be a lot worse than flash in per­for­mance, visu­al fideli­ty, ease of devel­op­ment (tools, doc). It will also have lost the abil­i­ty to be sim­ply a sim­ple doc­u­ment engine sup­port­ing all the accessibility/content index­ing features.
    Then maybe an apple genius will explain at a keynote that we need a com­mon imple­men­ta­tion of a new tech ori­ent­ed at multimedia/webapp, along­side the HTML to make it sta­ble, real­ly mul­ti-plat­form, maybe com­piled to ensure qual­i­ty dis­tri­b­u­tion and error check­ing, the lan­guage will have to be typed and OO, because webapp evolve towards com­plex sys­tems and it’s not the strong side of JS, and maybe the best form will be a vir­tu­al machine so it can run fast on dif­fer­ent hard/os.
    Oh I just invent­ed flash.
    So every­thing that we can real­ly miss from flash is the same thing that HTML5 is not deliv­er­ing, by sep­a­rat­ing the core fea­tures from the hacks built on top, it reveals what can real­is­ti­cal­ly be expect­ed when we try to mix to dif­fer­ent oppo­site needs.
    I tried hard to probe the lim­its of what can the HTML5 achieve and I dis­cov­ered numer­ous design flaws that don’t allow to deliv­er mixed typed con­tent, with tran­si­tion and ani­ma­tions, in a webapp with­out hav­ing to refresh the page or devel­op huge com­plex workaround. And even with every­thing you could dream of it terms of JS library, the design lim­i­ta­tion still does­n’t allow you to have a very good performance/fidelity, and often make you work twice as hard to pro­duce the con­tent vol­ume, with lim­it­ed options/variations.
    It would have been bet­ter that the W3C spon­sor the flash tech and make adobe release it as open source, then the flash play­er could have been inte­grat­ed a lot clos­er to the HTML, and all the effort build­ing a pale com­peti­tor would have been used to opti­mize the per­for­mance, add killer fea­ture, hunt for secu­ri­ty breach­es, inte­grate it in numer­ous browsers, sup­port­ing the macos/linux ecosys­tem more com­plete­ly, make the flash inter­act with the dom more close­ly. I don’t believe that it is sus­tain­able to devel­op XX time this kind of mul­ti­me­dia engine where even once it seems to not be feasible.

    Raphael Benzazon [February 16th, 2015, 17:55]