Developer Resources

Ignite Learning Labs

  • Introduction

    Emerging web technology like WebGL and WebRTC will have major impact on the applications we use in the future. Think, for instance, of how WebGL might impact education and medicine. Suddenly, hardware-accelerated graphics could be available in the standard learning portal, opening the possibilities for "hands-on" learning online.

    But there's another big shift on the horizon: faster internet speeds and programmable networks. As better internet service becomes more commonplace, how might that impact all those new capabilities we got with HTML5?

    We're putting together a series of learning labs that explores what exactly that impact might looks like. We're talking to experts, and putting together hackable demo projects that you can jump into, and explore for yourself. Read and watch what we've got to say about WebRTC, WebGL, Websockets, SPDY, and more.

  • Lab 5: SPDY - Eliminating Web Bottlenecks and Taking Full Advantage of 1 Gb/s

    Our learning labs have focused on buildings apps that take advantage of high-speed internet at 1 Gb/s, but a major part of achieving optimal web speeds are removing the basic bottlenecks inherent in HTTP 1.x.

    This lab explores SPDY, a modification of the HTTP protocol that allows web browsers to download webpage assets over a single connection. Instead of a browser opening a separate TCP connection to download each javascript, image, video, or stylesheet file, all of those resources can come in over one connection — greatly increasing page load times.

    What happens when we introduce devices capable of bandwidth as high as 1 Gbp/s? Watch this lab to see hackers from the Firefox team, Joyent, and Mickly discuss SPDY in detail, and how it can be used to enhance the benefits of high-speed internet.

    Don't forget to check out the hackable demo project which lets you enable and disable SPDY at the flick of a switch, letting you compare load times for an asset-heavy webapp. You can also check out a live version here — be sure to approve the SSL notification!

    Hackable Demo

    Jump into the example project at https://github.com/mozilla/mozilla-ignite-learning-lab-demos/tree/master/lab-5-spdy

  • Lab 4: Websockets - Unlocking the Web in Full-Duplex At 1 Gbps

    Our last lab discussed how WebRTC's data channel API could be used to initiate low-level TCP and UDP communication right inside the browser. That's great for next-generation apps which require peer-to-peer or client-server connectivity, but it might be too low-level for your needs.

    Websockets is a Javascript API for event-driven, message-based communication between the client and server. At any moment, the server can push messages down to a client, and the client can push messages back up at the exact same time. Websockets replaces the need for AJAX polling where real-time updates are needed.

    In this video, experts discuss the applications Websockets have to the gaming, industrial, and medical fields in the future internet. They'll also discuss the importance of low latency, high-bandwidth network speeds in building those future applications.

    Be sure to check out the hackable demo which revisits the project from Lab 1 to expose how exactly Websockets were used to stream point-cloud data from the server to the client.

    Hackable Demo

    Jump into the example project at https://github.com/mozilla/mozilla-ignite-learning-lab-demos/tree/master/lab-4-websockets

  • Lab 3: How WebRTC Data Will Push Webapps Into the Future

    Much like WebRTC Audio/Video, WebRTC's data channel API adds functionality that 3rd party browser plugins and workarounds had long been in use for: peer to peer connections in the browser. It's a major step toward making in-browser applications as powerful as desktop applications.

    If you're familiar with basic networking, then you've probably heard of TCP and UDP, two core protocols that internet communication is based on. The open-ended nature means that through a javascript API you can send arbitrary data between applications.

    With such powerful building block for richer web applications now available in the most modern browsers, what might the future of gaming, medicine, and general webapps look like? What happens when we introduce 1Gbps internet service and HTML5's file access API? Dive into Learning Lab 3 and hear what industry experts and hackers have to say.

  • Lab 2: Thinking about WebRTC Audio and Video at 1 Gb/s

    WebRTC is going to change the way we integrate audio and video streaming into our web applications. Today, building audio and video conferencing into our web applications isn't easy without third party browser plugins to make peer-to-peer connections and additionally, provide mic and camera access.

    With WebRTC's audio and video functionality, native, browser-based audio and video streaming is possible via a new javascript API. Think about all the collaborative apps that could benefit from video conferencing, like online office suites, project management apps, etc! Possibilities really open up when gigabit internet for everyone is a reality.

    In this lab, we've got experts from Google, Mozilla, BigBluebutton, and TokBox offering thoughts on WebRTC and where it's headed. And don't forget to check out the hackable demo, which uses node.js' WebRTC.io project to demonstrate multi-person video conferencing that you can drop into your own apps.

    Hackable Demo

    Jump into the example project at https://github.com/mozilla/mozilla-ignite-learning-lab-demos/tree/master/lab-2-webrtc-video

  • Lab 1: Future Uses for WebGL in Education, Medicine, and Graphics

    In this lab we'll talk to WebGL experts at Google, the founders of next-generation graphics software TeamUp, and super-hacker Andor Salga. They've provided us an especially compelling glimpse into what exactly WebGL might be used for in the future, how it could have big impacts on medicine and education in addition to games and general graphics editing.

    Once you're done watching the lab, be sure to check out the hackable demo we've put together: A node.js project which renders a pointcloud of Radiohead's Thom Yorke with WebGL. All that data is streamed over the wire with websockets!

    Hackable Demo

    Jump into the example project at https://github.com/mozilla/mozilla-ignite-learning-lab-demos/tree/master/lab-1-webgl

External Resources