X-Git-Url: https://eleni.mutantstargoat.com/git/?p=webkit_codecamp;a=blobdiff_plain;f=codecamp.tex;h=a89b2a92cac58e7a31f4104849251cd671b8763c;hp=6c41365b0ddee763b5c1dd880a1177e34b253844;hb=00fff1064313e541fe72c536c8304788a9d4c8a2;hpb=da72bf859e2bddc8876f2f7d705479c19c77eddf diff --git a/codecamp.tex b/codecamp.tex index 6c41365..a89b2a9 100644 --- a/codecamp.tex +++ b/codecamp.tex @@ -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} + +%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% + %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%