more
[webkit_codecamp] / codecamp.tex
index 6c41365..a89b2a9 100644 (file)
@@ -728,11 +728,165 @@ program}
     \frametitle{DMA buffers for the win!}
 
     \begin{center}
+               \textbf{\color{coolblack}Fortunately we are on Linux!}
+
+               \setbeamercolor{block body}{bg=white}
+               \setbeamercolor{block title}{bg=white, fg=coolblack}
+               \begin{block}{\scriptsize{There is a Linux kernel framework that can be used for
+                       content sharing between different Linux drivers!}}
+
+                       \vspace{-0.1cm}
+                       \begin{table}[t]
+                               \centering
+                               \begin{tabular}{l}
+                                       \begin{adjustbox}{max width=\textwidth}
+                                               \adjustbox{valign=t}{\includegraphics[height=3.1cm]{data/dma_buf_sharing.png}}
+                                       \end{adjustbox}
+                               \end{tabular}
+                       \end{table}
+
+                       \textbf{\scriptsize{\color{coolblack}A few things that need our attention:}}\\
+                       \vspace{0.1cm}
+
+                       \setbeamertemplate{itemize/enumerate body begin}{\tiny}
+                       \begin{itemize}
+                               \item There are {\color{coolblack}EGL and OpenGL/GLESv2
+                                       extensions} to make this content sharing easier!
+                               \item It's {\color{coolblack}driver independent}!
+                               \item It works with {\color{coolblack}multiple processes}!
+                               \item As long as ANGLE can expose the required extensions to
+                                       import a dma\_buf file descriptor this method is
+                                       {\color{coolblack}"ANGLE backend
+                                       independent"}!
+                               \item Works {\color{coolblack}only on Linux}... but in case of
+                                       WPE we won't need to support other systems! (Žan Doberšek)
+                       \end{itemize}
+               \end{block}
     \end{center}
 \end{frame}
 
 %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
 
+\begin{frame}
+       \frametitle{Extensions and new approach}
+
+       \setbeamercolor{block body}{bg=white}
+       \setbeamertemplate{itemize/enumerate body begin}{\tiny}
+
+       \begin{block}{\scriptsize{How the kernel DMA buffers would help us avoid copying
+               the WebGL texture data?}}
+
+               \begin{center}
+                       \begin{itemize}
+                               \item Each texture is backed by a Linux kernel dma\_buffer.
+                               \item Multiple textures can use the same dma buffer as backing
+                                       storage if they meet some requirements.
+                               \item We can export the file descriptor of one buffer from one
+                                       driver and use it to access the buffer from the other
+                                       driver.
+                               \item So we can export the FD that corresponds to the compositor
+                                       texture, import it in WebGL when we create the render target
+                                       and when the WebGL texture is filled, the compositor texture
+                                       will be also filled, as they share the backing storage!
+                       \end{itemize}
+               \end{center}
+       \end{block}
+       \begin{block}{\scriptsize{EGL and GL extensions that can be used:}}
+               \begin{center}
+                       \begin{itemize}
+                               \item
+                                       \href{https://www.khronos.org/registry/EGL/extensions/MESA/EGL\_MESA\_image\_dma\_buf\_export.txt}{EGL\_MESA\_image\_dma\_buf\_export}:
+                                       \\ This extension allows creating one or multiple Linux dma\_buf
+                                       file descriptors from the EGLImage that corresponds to a texture.
+                               \item \href{https://www.khronos.org/registry/EGL/extensions/EXT/EGL\_EXT\_image\_dma\_buf\_import.txt}{EGL\_EXT\_image\_dma\_buf\_import}:
+                                       \\ This extension allows creating an EGLImage (that will be used to create a
+                                       texture) from one or multiple Linux dma\_buf file
+                                       descriptors.
+                               \item \href{https://www.khronos.org/registry/EGL/extensions/EXT/EGL\_EXT\_image\_dma\_buf\_import\_modifiers.txt}{EGL\_EXT\_image\_dma\_buf\_import\_modifiers}:
+                                       \\ This extension builds on EGL\_EXT\_image\_dma\_buf\_import, in order to support
+                                       format modifiers used for tiling, compression, and additional non-linear
+                                       modes.
+                               \item \href{https://www.khronos.org/registry/OpenGL/extensions/OES/OES\_EGL\_image\_external.txt}{OES\_EGL\_image\_external}: 
+                                       \\ This extension provides a mechanism for creating EGLImage texture targets
+                                       from EGLImages.
+                       \end{itemize}
+               \end{center}
+       \end{block}
+\end{frame}
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+\begin{frame}
+       \frametitle{Example:}
+
+       \setbeamercolor{block body}{bg=white}{\scriptsize}
+       \setbeamertemplate{itemize/enumerate body begin}{\tiny}
+
+       \begin{block}{\scriptsize{I've written an example:}}
+               \begin{center}
+                       \begin{itemize}
+                               \item First using EGL!\\
+                                       Blog post: \url{https://eleni.mutantstargoat.com/hikiko/egl-dma-1/} \\
+                                       Code: \url{https://gistof.com/dma-egl-version}
+                               \item Then using a native EGL context and a context from ANGLE!\\
+                                       Blog post: \url{https://eleni.mutantstargoat.com/hikiko/angle-dma/}\\
+                                       Code: \url{https://gistof.com/dmaangleeglversion}
+                       \end{itemize}
+               \end{center}
+       \end{block}
+       \vspace{-0.3cm}
+       \begin{block}{\scriptsize{Snippet from the exporter:}}
+               \vspace{-0.1cm}
+               \tiny{
+               \begin{table}[t]
+                       \centering
+                       \begin{tabular}{l}
+                               {\color{coolblack}Exporting a dma buffer from a texture
+                               \texttt{texA}:}\\ 
+                               \begin{adjustbox}{max width=\textwidth}
+                                       \adjustbox{valign=t}{\includegraphics[height=4cm]{data/dma_export_and_struct.png}}
+                               \end{adjustbox}\\
+                       \end{tabular}
+               \end{table}
+               }
+       \end{block}
+\end{frame}
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+\begin{frame}
+       \frametitle{Example continued}
+       \setbeamercolor{block body}{bg=white}{\scriptsize}
+       \setbeamertemplate{itemize/enumerate body begin}{\tiny}
+
+       \begin{block}{\scriptsize{Snippets from the importer:}}
+               \vspace{-0.1cm}
+               \tiny{
+               \begin{table}[t]
+                       \centering
+                       \begin{tabular}{l}
+                               {\color{coolblack}Creating an EGLImage from the dma buffer using
+                               the exported fd and the exported modifiers:}\\ 
+                               \\
+                               \begin{adjustbox}{max width=\textwidth}
+                                       \adjustbox{valign=t}{\includegraphics[height=3.5cm]{data/dma_import.png}}
+                               \end{adjustbox}\\
+\\
+\\
+                               {\color{coolblack}Creating a texture using that external
+                               EGLImage:}\\ 
+                               \\
+                               \begin{adjustbox}{max width=\textwidth}
+                                       \adjustbox{valign=t}{\includegraphics[height=2cm]{data/dma_targetteture2does.png}}
+                               \end{adjustbox}\\
+                       \end{tabular}
+               \end{table}
+               }
+       \end{block}
+\end{frame}
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
 %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
 %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
 %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%