Mashing Up JavaScript – Advanced Techniques for Modern Web Applications

Javascript & HTML5
Location: Portland Ballroom
Average rating: ****.
(4.62, 21 ratings)

Nowadays many modern web applications are solely relying on JavaScript to render their frontend and only provide an API endpoint at their backend, resulting in a much more fluent and desktop-application-like user experience. But if you want to create mashups, load data from many different places or include external widgets into your site, you are quickly running into boundaries because of browser and security restrictions. In this presentation I will talk about techniques, some older, some brand new, and show you examples which will help you to:

  • make API calls to external domains.
  • authenticate these calls through OAuth without compromising your secrets.
  • load external content and JavaScript widgets safely.
  • send JavaScript messages between frames on different domains.
  • get real-time notifications from your backend.
  • and use the browser to store the some of the user’s data.
Photo of Bastian Hofmann

Bastian Hofmann


Bastian Hofmann is a senior system engineer at SysEleven, a full-service hosting company, where he focuses on bringing the power of Kubernetes to its customers. Previously, he was focused on performance, monitoring, web security, and developer productivity at ResearchGate, the social network for researchers and scientists. When he’s not developing stuff or looking at graphs, he likes to cycle, do yoga, or go to beer gardens, and he frequently speaks at international conferences on software architecture, scaling web applications, and open standards and protocols.

Comments on this page are now closed.


April Johnson
07/29/2011 1:31pm PDT

great session! love the code samples and demos.

Picture of Bastian Hofmann
Bastian Hofmann
07/29/2011 6:37am PDT

Thanks for the great feedback.

As promised here is a screencast of the now working demo:

The problem was, that the page was not fully loaded yet, because of the slow internet connection (the page includes some external stuff, like a map), which resulted in a csrf token or something similar to be missing.

The joy of live demos.

The slides are available here: but they will be uploaded here by O’Reilly as well.

The source code for the demo is available here:

Ben Brewer
07/29/2011 4:37am PDT

Thanks for introducing me to some projects I was not aware of and for a very enjoyable presentation.

Jeff Cross
07/29/2011 4:37am PDT

Jam-packed with hands-on information.