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