Data presentation with dust js technologies backing linkedin

Data Presentation with Dust.js

Technologies backing

By : Ruhaim Izmeth

What is Dust?Presentation with Dust.js Technologies

backing

https://github.com/linkedin/dustjs/

Dust is a JavaScript templating engine designed to provide a clean separation between presentation and logic without

sacrificing ease of use

Choosing Dust.js Presentation with Dust.js Technologies

backing

18 templating technologies

Google Closure Templates

mustache

handlebars

dust.js

4 finalists

WINNER

Most Viewed Page types on LinkedinPresentation with Dust.js Technologies

backing

User Profiles


backing

Company Profiles


backing

Jobs

LinkedIn presentation layer in 2010Presentation with Dust.js Technologies

backing

grails jruby java

html

browser

server

LinkedIn presentation layer after Dust.js in 2011Presentation with Dust.js Technologies

backing

grails jruby java

html

jsonbrowser

server

cdn

<dust-template>.js

Simple Dust.js usagePresentation with Dust.js Technologies

backing

<html>

<script type="text/javascript" src="dust-full.min.js"></script><script type="text/javascript" src="jquery.min.js"></script>

<script type="text/javascript">var json = “<json structure>”;var _t = “<dust template>”;

dust.render(_t, json, function(error, data){$(“mydiv”).html(data)

});</script>

<div id=”mydiv”></div>

</html>

Simple Dust.js usagePresentation with Dust.js Technologies

backing

Some features of Dust templatesPresentation with Dust.js Technologies

backing

simple - {name}loops - {#names}...{/names}

Conditionalsif conditions - {@if cond="condition"}exists - {?names}...{/names}not exist - {^names}...{/names}Selection - @select key=”<>” + @eq,@ne,@lt,@gt,@lte,@gte

Math function - @math

Nested JSONscontexts and sections paths

And more at - https://github.com/linkedin/dustjs/wiki/Dust-Tutorial

Advantages Presentation with Dust.js Technologies

backing

● Compilable Templates - Compiled JavaScript provide speed of execution

● Caching - can be served via CDN unlike a JSP output / less bandwidth

● Decoupling - templates aren’t bound to any business logic

● Easy Testing - No need for UI developers to start a Tomcat server to render

a page served with JSON-- much faster cycle time, less issues

● i18n - Localization support

● Write once and can run the same on both the client (browser) and server

using JS engine such as V8/rhino

● Progressive rendering - Load only what’s needed.

DisadvantagesPresentation with Dust.js Technologies

backing

● JS disabled clients / Clients with poor JSON parsing support eg:- ie6,7,8

won't render templated properly

● SEO unfriendly

● Need to run templating logic for emails - but this does not run on browser

Solution : do the templating on server using additional technology stack

Node.js, V8 engine, Rhino

Next major client side improvement in 2013Presentation with Dust.js Technologies

backing

Introducing Fizzy - deferred rendering read more at http://engineering.linkedin.com/profile/engineering-new-linkedin-profile

Date post:	04-Jul-2015
Category:	Internet
Upload:	ruhaim-izmeth
View:	107 times
Download:	1 times

Data presentation with dust js technologies backing linkedin

Internet