blob: df685dbef25f9c29d028c9cc9e4b02295cdda91c [file] [log] [blame]
{{+bindTo:partials.standard_nacl_article}}
<section id="webassembly-migration-guide">
<span id="migration"></span><h1 id="webassembly-migration-guide"><span id="migration"></span>WebAssembly Migration Guide</h1>
<h2 id="p-nacl-deprecation-announcements">(P)NaCl Deprecation Announcements</h2>
<p>Given the momentum of cross-browser WebAssembly support, we plan to focus our
native code efforts on WebAssembly going forward and plan to remove support for
PNaCl in Q2 2019 (except for Chrome Apps). We believe that the vibrant
ecosystem around <a class="reference external" href="http://webassembly.org">WebAssembly</a>
makes it a better fit for new and existing high-performance
web apps and that usage of PNaCl is sufficiently low to warrant deprecation.</p>
<p>We also recently announced the deprecation Q1 2018 of
<a class="reference external" href="https://blog.chromium.org/2016/08/from-chrome-apps-to-web.html">Chrome Apps</a>
outside of ChromeOS.</p>
<h2 id="toolchain-migration">Toolchain Migration</h2>
<p>For the majority of (P)NaCl uses cases we recommend transitioning
from the NaCl SDK to <a class="reference external" href="http://webassembly.org/getting-started/developers-guide/">Emscripten</a>.
Migration is likely to be reasonably straightforward
if your application is portable to Linux, uses
<a class="reference external" href="https://www.libsdl.org/">SDL</a>, or POSIX APIs.
While direct support for NaCl / Pepper APIs in not available,
we&#8217;ve attempted to list Web API equivalents.
For more challenging porting cases, please reach out on
<a class="reference external" href="mailto:native-client-discuss&#37;&#52;&#48;googlegroups&#46;com">native-client-discuss<span>&#64;</span>googlegroups<span>&#46;</span>com</a></p>
<h2 id="api-migration">API Migration</h2>
<p>We&#8217;ve outlined here the status of Web Platform substitutes for each
of the APIs exposed to (P)NaCl.
Additionally, the table lists the library or option in Emscripten
that offers the closest substitute.</p>
<p>We expect to add shared memory threads support to WebAssembly in 2017,
as threads are crucial to matching (P)NaCl&#8217;s most interesting use
cases. Migration items which assume forthcoming threads support
are marked below. If your application&#8217;s flow control relies heavily on blocking
APIs, you may also find threads support is required for convenient porting.</p>
<p>While we&#8217;ve tried to be accurate in this table,
there are no doubt errors or omissions.
If you encounter one, please reach out to us on
<a class="reference external" href="mailto:native-client-discuss&#37;&#52;&#48;googlegroups&#46;com">native-client-discuss<span>&#64;</span>googlegroups<span>&#46;</span>com</a></p>
<h2 id="ppapi">PPAPI</h2>
<table>
</table>
<h3>PPB_Audio</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">x </td>
<td style="font-size: 11px; padding: 5px;">SDL (partial) </td>
<td bgcolor="#ffeecc" style="font-size: 11px; padding: 5px;">GAP (partial) - AudioWorkletNode ROUGHLY equivalent</td>
<td style="font-size: 11px; padding: 5px;">Still being standardized. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetCurrentConfig </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioContext.* (gets back settings passed in) </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">StartPlayback </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioBufferSourceNode.start </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">StopPlayback </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioBufferSourceNode.stop </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_AudioBuffer</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetTimestamp </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioBufferSourceNode.start (parameter) </td>
<td style="font-size: 11px; padding: 5px;">Passed in each time instead of attached to the buffer. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">SetTimestamp </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioBufferSourceNode.start (parameter) </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetSampleRate </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioBuffer.sampleRate </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetSampleSize </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - WebAudio only uses 32-bit float, PPAPI does 16-bit int.</td>
<td style="font-size: 11px; padding: 5px;">PPAPI theoretically supports multiple sampling sizes. In practice, it only supports 16-bit samples. Unfortunately, developers have requested 16-bit sample sizes to save on memory use. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetNumberOfChannels </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioBuffer.numberOfChannels </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetDataBuffer </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioBuffer.getChannelData </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetBufferSize </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioBuffer.length </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_AudioConfig</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">CreateStereo16Bit </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - Only 32-bit float samples supported</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetSampleRate </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioContext.sampleRate </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetSampleFrameCount </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioBuffer.length </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">RecommendSampleRate </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">AudioContext.sampleRate (from default construct) </td>
<td style="font-size: 11px; padding: 5px;">An AudioContext will have the preferred sampling rate by default. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">RecommendSampleFrameCount </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No mechanism to get a recommended buffer size.</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_Console</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Log </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">utime </td>
<td style="font-size: 11px; padding: 5px;">console.log/warn/error/... </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">LogWithSource </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">PPAPI provides a way to override the source filename and line number in a console message.
(Though JS API provides way to style text). </td>
</tr>
</table>
<h3>PPB_Core</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">getTime </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">utime </td>
<td style="font-size: 11px; padding: 5px;">new Date().getTime() </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">getTimeTicks </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">utime </td>
<td style="font-size: 11px; padding: 5px;">new Date().getTime() </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">IsMainThread </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">window.document !== undefined </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">CallOnMainThread </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">Worker.postMessage + Atomics.wait </td>
<td style="font-size: 11px; padding: 5px;">Equivalent synchronization can be built. </td>
</tr>
</table>
<h3>PPB_FileIO</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">FileReader / FileWrite (Entry.createReader / Entry.createWriter) </td>
<td style="font-size: 11px; padding: 5px;">Create and open are used differently, but the pieces are of equal power. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Open </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">FileReader / FileWrite (Entry.createReader / Entry.createWriter) </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Query </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">Entry.getMetadata </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Touch </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td bgcolor="#ffeecc" style="font-size: 11px; padding: 5px;">GAP (partial) - No direct equivalent, but no access time either.</td>
<td style="font-size: 11px; padding: 5px;">Modify time can be bumped by writing. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Read </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">Entry.getFile + Blob.slice + FileReader.getBinaryData </td>
<td style="font-size: 11px; padding: 5px;">Note, this API requires an extra copy to get a read into linear memory, and may be worse than that if Blob slices are not optimizes to use mmap. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Write </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">FileWriter.seek + FileWriter.write 'write*' Events </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">SetLength </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">FileWriter.truncate + 'write*' Events </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Flush </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent, no way to flush.</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Close </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">No equivalent, open files and directories are implicitly closed. </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">ReadToArray </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent.</td>
<td style="font-size: 11px; padding: 5px;">Allows multiple subrange reads in parallel. </td>
</tr>
</table>
<h3>PPB_FileRef</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">Entry.getFile(..., {create:true}) </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetFileSystemType </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">FileSystem.type </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetName </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">Entry.name </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetPath </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">Entry.fullPath </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetParent </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">Entry.getParent </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">MakeDirectory </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">Entry.getDirectory(..., {create:true}) </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Touch </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td bgcolor="#ffeecc" style="font-size: 11px; padding: 5px;">GAP (partial) - No direct equivalent, but no access time either.</td>
<td style="font-size: 11px; padding: 5px;">Modify time can be bumped by writing. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Delete </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">Entry.remove </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Rename </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">Entry.moveTo </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Query </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">Entry.getMetadata </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - JS API has file size and last modified date, but doesn't have creation date and last accessed date.</td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">ReadDirectoryEntries </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">Directory.readEntries </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_FileSystem</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">FS (partial) </td>
<td style="font-size: 11px; padding: 5px;">window.requestFileSystem </td>
<td style="font-size: 11px; padding: 5px;">JS API does both in one step </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Open </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">window.requestFileSystem </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - Filesystems API is chrome only. IndexedDB has additional performance limitations around subrange writes.</td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetType </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">FileSystem.type </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_Fullscreen</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">IsFullScreen </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">html5.h </td>
<td style="font-size: 11px; padding: 5px;">Document.fullscreenEnabled </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">SetFullscreen </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">html5.h </td>
<td style="font-size: 11px; padding: 5px;">Document.requestFullscreen </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetScreenSize </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">html5.h </td>
<td style="font-size: 11px; padding: 5px;">Document.exitFullscreen </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_Gamepad</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Sample </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Gamepad.* </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - PPAPI exposes a timestamp value, but the JS API doesn't provide this (though it is spec'd).</td>
</tr>
</table>
<h3>PPB_Graphics2D</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Canvas.getContext('2d') </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Describe </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Canvas.clientWidth + Canvas.clientHeight </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PaintImageData </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">CanvasRenderingContext2d.putImageData </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Scroll </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">CanvasRenderingContext2d.scrollIntoView </td>
<td bgcolor="#ffeecc" style="font-size: 11px; padding: 5px;">GAP (partial) - Not an exact match (might have to resort to getImageData + putImageData which will be slow). Not a cross-browser standard.</td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">ReplaceContents </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">CanvasRenderingContext2d.drawImage </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Flush </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - Only returning to the event loop triggers the flush.</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">SetScale </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">CanvasRenderingContext2d.scale </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetScale </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">CanvasRenderingContext2d.currentTransform </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">SetLayerTransform </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">CanvasRenderingContext2d.setTransform
CanvasRenderingContext2d.scale
CanvasRenderingContext2d.translate </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_Graphics3D</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetAttribMaxValue </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - Canvas.getContext lets you set booleans requesting depth / stencil buffers of certain sizes, but does not have a way to query what's possible (or get anything other than on or off for each)</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Canvas.getContext </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetAttribs </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">WebGLRenderingContext.getContextAttributes </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">SetAttribs </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Canvas.getContext(.., OPTIONS) </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetError </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">WebGLRenderingContext.getError </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">ResizeBuffers </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Canvas.width = w; Canvas.height = h; </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">SwapBuffers </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No way to explicitly flip a frame, must return to the event loop.</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_ImageData</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetNativeImageDataFormat </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">ImageData mandates RGBA order </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">IsImageDataFormatSupported </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">ImageData mandates RGBA order </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">CanvasRenderingContext2d.createImageData </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Describe </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">ImageData never has a stride </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Map </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">ImageData.data </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Unmap </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">ImageData.data </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_InputEvent</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">RequestInputEvents </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">No direct equivalent </td>
<td style="font-size: 11px; padding: 5px;">The lack of this feature is probably less relevant as JS / Wasm runs on the main thread and can more cheaply filter events without incurring a cross process round-trip. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">RequestFilteringInputEvents </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">mouse* key* wheel* touch* composition* Events </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;"> </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Element.addEventListener </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">ClearInputEventRequest </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Element.removeEventListener </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetType </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Event class descendants </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetTimeStamp </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Event.timeStamp </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetModifiers </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">*Event.altKey/shiftKey/metaKey/ctrlKey </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_MouseInputEvent</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">MouseEvent </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetButton </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">MouseEvent.button </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetPosition </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">MouseEvent.client*/page*/offset* </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetClickCount </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">dblclick' vs 'mousedown' Events </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetMovement </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">MouseEvent.movement* </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_WheelInputEvent</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">WheelEvent </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetDelta </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">WheelEvent.delta* </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetTicks </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - deltaMode kinda of contains this info, but incompletely.</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetScrollByPage </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - deltaMode kinda of contains this info, but incompletely.</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_KeyboardInputEvent</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">KeyboardEvent </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetKeyCode </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">KeyboardEvent.keyCode </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetCharacterText </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">KeyboardEvent.key </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetCode </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">KeyboardEvent.code </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_TouchInputEvent</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">TouchEvent </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">AddTouchPoint </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">TouchEvent.touches.push </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetTouchCount </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">TouchEvent.touches.length </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetTouchByIndex </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">TouchEvent.touches[i] </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetTouchById </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Touch.indentifer (to figure this out yourself) </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_IMEInputEvent</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">CompositionEvent </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetText </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">CompositionEvent.data </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetSegmentNumber </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No direct equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetSegmentOffset </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No direct equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetTargetSegment </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No direct equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetSelection </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No direct equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_Instance</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">BindGraphics </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Canvas.getContext (moot as binding is automatic). </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">IsFullFrame </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent to mime type handlers.</td>
<td style="font-size: 11px; padding: 5px;">NaCl apps can be registered to handle a particular mime type and own the whole document. </td>
</tr>
</table>
<h3>PPB_MediaStreamAudioTrack</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Configure </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetAttrib </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">MediaStreamSettings.channelCount </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;"> </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">MediaStreamSettings.sampleSize </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;"> </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">MediaStreamSettings.sampleRate </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;"> </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - no equivalent to PP_MEDIASTREAMAUDIOTRACK_ATTRIB_BUFFERS</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;"> </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - no equivalent to PP_MEDIASTREAMAUDIOTRACK_ATTRIB_DURATION</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetId </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">MediaStream.id </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">HasEnded </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">MediaStream.ended </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetBuffer </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">RecycleBuffer </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Close </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_MediaStreamVideoTrack</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;">Ability to create synthetic stream. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Configure </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetAttrib </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">MediaStreamSettings.width </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;"> </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">MediaStreamSettings.height </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;"> </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - no equivalent to PP_MEDIASTREAMVIDEOTRACK_ATTRIB_BUFFERED_FRAMES</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;"> </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - no equivalent to PP_MEDIASTREAMVIDEOTRACK_ATTRIB_FORMAT</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetId </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">MediaStream.id </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">HasEnded </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td style="font-size: 11px; padding: 5px;">MediaStream.ended </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetFrame </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">RecycleFrame </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Close </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetEmptyFrame </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PutFrame </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_MessageLoop</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Create </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">N/A </td>
<td style="font-size: 11px; padding: 5px;">Mostly moot, workers get an implicit event loop. </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetForMainThread </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">N/A </td>
<td style="font-size: 11px; padding: 5px;">Mostly moot, workers get an implicit event loop. </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">GetCurrent </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">N/A </td>
<td style="font-size: 11px; padding: 5px;">Mostly moot, workers get an implicit event loop. </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">AttachToCurrentThread </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">N/A </td>
<td style="font-size: 11px; padding: 5px;">Mostly moot, workers get an implicit event loop. </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Run </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">N/A </td>
<td style="font-size: 11px; padding: 5px;">Mostly moot, workers get an implicit event loop. </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PostWork </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">N/A </td>
<td style="font-size: 11px; padding: 5px;">Mostly moot, workers get an implicit event loop. </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PostQuit </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">N/A </td>
<td style="font-size: 11px; padding: 5px;">Mostly moot, workers get an implicit event loop. </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_Messaging</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PostMessage </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">N/A </td>
<td style="font-size: 11px; padding: 5px;">Window.postMessage </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">RegisterMessageHandler </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">N/A </td>
<td style="font-size: 11px; padding: 5px;">Window.addEventListener </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">UnregisterMessageHandler </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">N/A </td>
<td style="font-size: 11px; padding: 5px;">Window.removeEventListener </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_MouseCursor</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">SetCursor </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Element.style.cursor </td>
<td style="font-size: 11px; padding: 5px;">Same set of stock cursors are supported.
Custom cursors can be done with url(..).
Dynamic custom cursors can be done with data URIs.
CSS3 supports specifying the hotspot. </td>
</tr>
</table>
<h3>PPB_MouseLock</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">LockMouse </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Element.requestPointerLock </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">UnlockMouse </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">SDL </td>
<td style="font-size: 11px; padding: 5px;">Element.exitPointerLock </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_OpenGLES2</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">Several Methods </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td style="font-size: 11px; padding: 5px;">OpenGLES </td>
<td style="font-size: 11px; padding: 5px;">Close to WebGL 1.0 in functionality. </td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;"> </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">x </td>
<td style="font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - Without offscreen canvas, rendering must be done on the main thread.</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
</table>
<h3>PPB_TextInputController</h3>
<table>
<tr bgcolor="#77ccff" style="color:white; font-weight: bold;">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">PPAPI Method </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;">Assumes Threads </td>
<td style="font-size: 11px; padding: 5px;">Emscripten </td>
<td style="font-size: 11px; padding: 5px;">Web API </td>
<td style="font-size: 11px; padding: 5px;">Limitations </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">SetTextInputType </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent hints to browser about canvas containing input.</td>
<td style="font-size: 11px; padding: 5px;">Some developers would like to either be able to hint in this fashion, or preferably the ability to intercept and display IME events / output inline inside a canvas. </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">UpdateCaretPosition </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent hints to browser about canvas containing input.</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: 5px;">CancelCompositionText </td>
<td style="width: 50px; text-align: center; font-size: 11px; padding: 5px;"> </td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP</td>
<td bgcolor="#ffcccc" style="font-size: 11px; padding: 5px;">GAP - No equivalent hints to browser about canvas containing input.</td>
<td style="font-size: 11px; padding: 5px;"> </td>
</tr>
<tr bgcolor="#fcfcfc">
<td style="font-weight: bold; font-size: 11px; padding: