Spotlight session taken from the Future of Web Apps Boston (http://futureofwebapps.com/boston-2014)

1. Welcome
Building a Commercial Web Application
Toolkit and SDK
Corey Lanum

2. Cambridge Intelligence
• Founded in 2011
• Offices in Cambridge UK & Boston USA
• We help organizations understand connected data
– KeyLines – our award-winning graph visualization SDK
– Niche developer services
– Expert know-how

3. KeyLines
KeyLines is a commercial SDK for
building fully customized graph
visualization applications for
end-users
• Runs in any browser
• Works on any device
• Powerful functionality
• A fast developer experience
• Simple deployment
• Easy maintenance

4. KeyLines
Create Interactive, Professional Visualizations
inside your web application
Features
• Pure HTML5 Canvas
• Works on IE 7, 8 via Flash
• Full event model
• Time Bar
• Graph layouts
• Graph analytics
– SNA measures, path finding & more
• Full workflow support
– Image generation for reports, undo
stack, etc
• Very quick integration time
• Thorough documentation
• Good performance
• Great support

5. • Are lazy
Developers
–Never read anything!
– Want to copy and paste for everything
– Have no visual style
• Hate to say they are stuck
• Don’t like telephones
• Think they know everything
• Severely underestimate almost every task
• Are under severe time pressure

6. Environments
Runtimes
• IE7, IE8, IE9, IE10, IE11
• Chrome
• Firefox
• Safari
(iOS, OSX, Linux, Windows, Android)
• WPF, .NET
• Java Swing
Frameworks etc
• jQuery
• RequireJS
• GWT
• Vaadin
• AngularJS
• Prototype (!)
• Government stacks

7. Why Canvas?
• It is way faster than SVG
• Canvas API is small & simple
– draws what you tell it to draw, when you want to
draw it
• Canvas implementations are very similar
nowadays
– (bugs aside)
• It has friends…

8. requestAnimationFrame
• Tells you when to draw stuff
• Use timers to discover what the inter-frame
gap was
• Read up on game loops

9. document.createElement(‘canvas’)

10. document.createElement(‘canvas’)

11. More reasons to love canvas!
• No need to fiddle about with needless DOM
stuff
• No new language to learn
• No XML
• Get images out via toDataURL
• You can actually profile everything (and fix
slow code)

12. KeyLines

13. Thanks!
info@cambridge-intelligence.com
@CambridgeIntel Cambridge-Intelligence.com