linuxwochen2018/index.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   5   <meta name="Author" content="KaiRo - Robert Kaiser">
   6   <title>Mozilla Emerging Technologies</title>
   7   <link rel="stylesheet" type="text/css" href="slides.css">
   8   <script type="text/javascript" src="slides.js"></script>
   9   <link rel="contents" href="#index" title="Überblick">
  10   <link rel="index" id="link-toc" href="#toc" title="Inhalt">
  11   <link rel="start" id="link-start" href="#index" title="Start">
  12 </head>
  13 <body onload="docLoaded();">
  14 <header id="header"><div id="header-text">Emerging Tech</div>
  15   <div id="subheader-text"></div>
  16   <a id="headerlogo" href="#index" title="Startseite">Mozilla</a>
  17 </header>
  18 <nav id="slidenav">
  19   <a href="#toc" id="nav-toc" accesskey="t">toc</a> ||
  20   <a href="#index" id="nav-start" accesskey="s">start</a> ||
  21   <a href="#" id="nav-prev" accesskey="p" hidden>&lt; back</a>
  22   <span id="nav-prev-nolink" class="nolink">&lt; back</span> |
  23   <a href="#" id="nav-next" id="goNext" accesskey="n" hidden>fwd &gt;</a>
  24   <span id="nav-next-nolink" class="nolink">fwd &gt;</span>
  25 </nav>
  26
  27 <article id="toc" data-title="Inhalt">
  28 <h1><span>Table of Contents</span></h1>
  29 <h2>Mozilla Emerging Technologies</h2>
  30
  31 <div class="captionedbox">
  32 <p class="captionedbox-caption">The following slides are available in this presentation:</p>
  33 <div class="captionedbox-content">
  34 <ul id="toc-list">
  35 </ul>
  36 </article>
  37
  38 <article id="index" data-title="Start Page" data-seconds="600">
  39 <h1><span>Mozilla Emerging Technologies</span></h1>
  40 <h2>New Technologies for the Open Web</h2>
  41
  42 <div class="simplebox decofont">
  43 <mark><a href="http://home.kairo.at/">Robert Kaiser</a></mark>,
  44 "KaiRo" &lt;kairo@kairo.at&gt;
  45 <br><small>Mozilla Tech Speaker</small>
  46 </div>
  47
  48 <div class="captionedbox">
  49 <p class="captionedbox-caption decofont">Slides:
  50   <a href="https://slides.kairo.at/linuxwochen2018/">https://slides.kairo.at/linuxwochen2018/</a></p>
  51 <div class="captionedbox-content small">
  52 <ul class="small">
  53   <li>Created for a
  54     <a href="https://cfp.linuxwochen.at/de/LWW18/public/events/741">presentation</a>
  55     at <a href="http://www.linuxwochen.at/">Linuxwochen 2018</a> in Wien/Vienna.</li>
  56   <li>Written in HTML 5 with CSS 3 and JavaScript.</li>
  57   <li>Navigation via links on all slides, via access keys
  58    (e.g. "n"/Alt+Shift+N for "next") or back/forward arrow keys</li>
  59   <li><a href="#toc">Contents</a></li>
  60   <li><a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/"><img
  61       alt="Lizenziert unter CC-BY-SA," class="ccinline" src="cc-by-sa.svg"></a>
  62     04/2018 Robert Kaiser -
  63     "Mozilla", "Firefox" and their logos are
  64     <a href="http://www.mozilla.org/foundation/trademarks/list.html">trademarks
  65     of Mozilla Foundation</a>.</li>
  66 </ul>
  67 </div>
  68 </div>
  69 </article>
  70
  71 <article id="mozet" data-title="Emerging Technologies Group">
  72 <h1><span>Emerging Technologies Group</span></h1>
  73
  74 <div class="simplebox">
  75 <ul>
  76   <li>R&amp;D organization @ Mozilla, a.k.a. <mark>Mozilla Research</mark></li>
  77   <li><a href="https://research.mozilla.org/">research.mozilla.org</a></li>
  78   <li><a href="https://www.mozilla.org/en-US/technology/">mozilla.org/technology</a></li>
  79   <li>Multiple teams for different technologies</li>
  80 </ul>
  81 </div>
  82 </article>
  83
  84 <article id="webxr" data-title="Mixed Reality">
  85 <h1><span>Mixed Reality (XR)</span></h1>
  86
  87 <div class="simplebox">
  88 <img src="vrheadset-boy.png" class="slidepic"
  89  alt="Boy with VR headset">
  90 <ul>
  91   <li>WebXR - <mark>Virtual &amp; Augmented Reality</mark> (WebVR &amp; AR)</li>
  92   <li><a href="https://research.mozilla.org/mixed-reality/">research.mozilla.org/mixed-reality</a></li>
  93   <li><a href="https://webvr.info/">webvr.info</a>, <a href="https://webxr.io/">webxr.io</a> -
  94     <a href="https://github.com/immersive-web/webxr">WebXR Device API</a>,
  95     <mark>Open Standard</mark> (proposal)</li>
  96   <li>In concert with WebGL, WebAudio and Gamepad APIs</li>
  97   <li>Windows: Firefox release, Mac: Nightly, Linux: in development</li>
  98 </ul>
  99 <p class="ensurepicinbox"></p>
 100 </div>
 101 </article>
 102
 103 <article id="aframe" data-title="A-Frame">
 104 <h1><span>A-Frame - XR Made Simple</span></h1>
 105
 106 <div class="simplebox">
 107 <img src="aframe-sticker.png" class="slidepic"
 108  alt="A-Frame - aframe-io">
 109 Example:
 110 <pre>
 111 &lt;<mark>a-scene</mark>&gt;
 112   &lt;a-sphere <small>position="0 1.25 -1" radius="1.25" color="#EF2D5E"</small>&gt;&lt;/a-sphere&gt;
 113   &lt;<mark>a-cube</mark> <small>position="-1 0.5 1" rotation="0 0 0" …</small>&gt;
 114     &lt;<mark>a-animation</mark> <small>attribute="rotation" … to="0 360 0"</small>&gt;&lt;/a-animation&gt;
 115   &lt;/a-cube&gt;
 116   &lt;a-cylinder <small>position="1 0.75 1" …</small>&gt;&lt;/a-cylinder&gt;
 117   &lt;a-plane <small>…</small>&gt;&lt;/a-plane&gt;
 118   &lt;a-sky <small>color="#ECECEC"</small>&gt;&lt;/a-sky&gt;
 119 &lt;/a-scene&gt;
 120 </pre>
 121 <p><a href="https://codepen.io/mozvr/pen/jqERjQ">edit/view</a>
 122 - More at <a href="https://aframe.io/">aframe.io</a>
 123 <p class="ensurepicinbox"></p>
 124 </div>
 125 </article>
 126
 127 <article id="codecs" data-title="Open Media Codecs">
 128 <h1><span>Open Media Codecs</span></h1>
 129
 130 <div class="simplebox">
 131 <img src="av1-comingsoon.png" class="slidepic" alt="AV1 - Coming Soon">
 132 <ul>
 133   <li><a href="https://www.opus-codec.org/">Opus</a>: <mark>royalty-free, open, universal</mark> audio codec</li>
 134   <li>Next target: do the same with video</li>
 135   <li>Mozilla/Xiph: Daala + Google: VP9 + Cisco: Thor</li>
 136   <li><a href="http://aomedia.org/">Alliance for Open Media (AOMedia)</a> for collaboration</li>
 137   <li><a href="https://aomedia.org/the-alliance-for-open-media-kickstarts-video-innovation-era-with-av1-release/">Released</a>:
 138     AV1 bitstream frozen since March/April 2018</li>
 139   <li>Next: Opimized de-/encoders, hardware support, ...</li>
 140 </ul>
 141 <p class="ensurepicinbox"></p>
 142 </div>
 143 </article>
 144
 145 <article id="speech" data-title="Speech &amp; Learning">
 146 <h1><span>Speech &amp; Machine Learning</span></h1>
 147
 148 <div class="simplebox">
 149 <img src="speechlearning.png" class="slidepic" alt="Speech Recording + Learning">
 150 <ul>
 151   <li><a href="https://voice.mozilla.org/">Common Voice</a>: Open repository for <mark>voice recordings</mark></li>
 152   <li>Machine learning to train speech-to-text (STT) systems</li>
 153   <li>DeepSpeech / Pipsqueak: Mozilla STT, open source</li>
 154   <li><mark>Offline speech recognition</mark> engine, for security + privacy, can run on RPi3</li>
 155   <li><a href="https://blog.mozilla.org/blog/2017/11/29/announcing-the-initial-release-of-mozillas-open-source-speech-recognition-model-and-voice-dataset/">Only
 156     6.5% error rate on first released model</a></li>
 157   <li><a href="https://research.mozilla.org/machine-learning/">research.mozilla.org/machine-learning</a></li>
 158 </ul>
 159 <p class="ensurepicinbox"></p>
 160 </div>
 161 </article>
 162
 163 <article id="rust" data-title="Rust">
 164 <h1><span>Rust Language</span></h1>
 165
 166 <div class="simplebox">
 167 <img src="rust-logo.svg" class="slidepic" alt="Rust logo">
 168 <ul>
 169   <li>Systems programming language</li>
 170   <li>Focus on <mark>speed</mark>, <mark>memory safety</mark> and <mark>parallelism</mark></li>
 171   <li>Low-level language but prevents segmentation faults and guarantees thread safety</li>
 172   <li>Mozilla as founder and sponsor, active volunteer community</li>
 173   <li>Used at Mozilla e.g. in Servo and Firefox Quantum</li>
 174   <li><a href="https://www.rust-lang.org/">rust-lang.org</a></li>
 175 </ul>
 176 <p class="ensurepicinbox"></p>
 177 </div>
 178 </article>
 179
 180 <article id="servo" data-title="Servo">
 181 <h1><span>Servo Web Engine</span></h1>
 182
 183 <div class="simplebox">
 184 <img src="servo.png" class="slidepic" alt="Servo logo">
 185 <ul>
 186   <li>Experimental web engine, <mark>written in Rust</mark></li>
 187   <li>Modular architecture, embeddable</li>
 188   <li><mark>Memory safe</mark>: more stability &amp; security</li>
 189   <li><mark>Fast</mark>: parallelism + newer algorithms</li>
 190   <li>Mature modules can be integrated into Gecko (Firefox Quantum)</li>
 191   <li>Possible base for a WebVR/XR runtime, etc.</li>
 192   <li><a href="https://servo.org/">servo.org</a>,
 193     <a href="https://research.mozilla.org/servo-engines/">research.mozilla.org/servo-engines</a></li>
 194 </ul>
 195 <p class="ensurepicinbox"></p>
 196 </div>
 197 </article>
 198
 199 <article id="wasm" data-title="WebAssembly">
 200 <h1><span>WebAssembly (wasm)</span></h1>
 201
 202 <div class="simplebox">
 203 <img src="web-assembly-logo.svg" class="slidepic" alt="WebAssembly logo">
 204 <ul>
 205   <li>New, low-level, assembly-like language to run in browsers</li>
 206   <li>Backward-compatible with <a href="http://asmjs.org/">asm.js</a></li>
 207   <li>Good target to <mark>compile C/C++ or Rust</mark> (via
 208     <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Projects/Emscripten">Emscripten</a>)
 209     <mark>for the browser</mark></li>
 210   <li>Enables <mark>fast compute-intensive applications</mark> (games et al.) on the web</li>
 211   <li>Already supported in Firefox, Chrome, Edge, Safari</li>
 212   <li><a href="http://webassembly.org/">webassembly.org</a></li>
 213 </div>
 214 </article>
 215
 216 <article id="iot" data-title="Project Things">
 217 <h1><span>IoT - Project Things</span></h1>
 218
 219 <div class="simplebox">
 220 <img src="mozilla_iot_illustration.png" class="slidepic" alt="Project Things illustration">
 221 <ul>
 222   <li>Experimental framework for connecting "things" to the web</li>
 223   <li>Target: decentralized Internet of Things that is safe, open and interoperable</li>
 224   <li><mark>Web Thing API: Proposed W3C standard</mark></li>
 225   <li>Things Gateway connects existing things/protocols to the web</li>
 226   <li>Cloud services are optional and configurable</li>
 227   <li><mark>Giving control back to the user</mark></li>
 228   <li><a href="https://iot.mozilla.org/">iot.mozilla.org</a></li>
 229 </ul>
 230 <p class="ensurepicinbox"></p>
 231 </div>
 232 </article>
 233
 234 <article id="end" data-title="The End">
 235
 236 <div class="simplebox endslidecontainer">
 237 <h1 class="cent endslidetext">Questions?</h1>
 238 <h2 class="cent endslidetext"><span><a href="https://www.mozilla.org/en-US/technology/">mozilla.org/technology</a></span></h2>
 239 <h3 class="cent endslidetext"><span>kairo@kairo.at</span></h3>
 240 <img src="mister_tricorder.jpg" class="sshot endslidepic" alt="Data &amp; Mister Tricorder">
 241 </div>
 242 </article>
 243
 244 </body>
 245 </html>