Recommended
More Related Content
What's hot
What's hot (20)
Similar to Data presentation with dust js technologies backing linkedin
Similar to Data presentation with dust js technologies backing linkedin (20)
Recently uploaded
Recently uploaded (20)
Data presentation with dust js technologies backing linkedin
- 1. Data Presentation with Dust.js Technologies backing By : Ruhaim Izmeth
- 2. Presentation with Dust.js Technologies What is Dust? 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
- 3. Presentation with Dust.js Technologies Choosing Dust.js backing 18 templating technologies 4 finalists Google Closure Templates mustache handlebars dust.js WINNER
- 4. Presentation with Dust.js Technologies Most Viewed Page types on Linkedin backing User Profiles
- 5. Presentation with Dust.js Technologies Most Viewed Page types on Linkedin backing Company Profiles
- 6. Presentation with Dust.js Technologies Most Viewed Page types on Linkedin backing Jobs
- 7. Presentation with Dust.js Technologies LinkedIn presentation layer in 2010 backing html browser server grails jruby java
- 8. Presentation with Dust.js Technologies LinkedIn presentation layer after Dust.js in 2011 backing html json browser server <dust-template>.js grails jruby java cdn
- 9. Presentation with Dust.js Technologies Simple Dust.js usage 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>
- 10. Presentation with Dust.js Technologies Simple Dust.js usage backing
- 11. Presentation with Dust.js Technologies Some features of Dust templates backing simple - {name} loops - {#names}...{/names} Conditionals if conditions - {@if cond="condition"} exists - {?names}...{/names} not exist - {^names}...{/names} Selection - @select key=”<>” + @eq,@ne,@lt,@gt,@lte,@gte Math function - @math Nested JSONs contexts and sections paths And more at - https://github.com/linkedin/dustjs/wiki/Dust-Tutorial
- 12. Presentation with Dust.js Technologies Advantages 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.
- 13. Presentation with Dust.js Technologies Disadvantages 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
- 14. Presentation with Dust.js Technologies Next major client side improvement in 2013 backing Introducing Fizzy - deferred rendering read more at http://engineering.linkedin.com/profile/engineering-new-linkedin-profile