\put(0,-110.7){%
\begin{minipage}[b][38mm][t]{220mm}
- \usebeamerfont{title}{\inserttitle\par}
+ \usebeamerfont{title}{\textbf{Adoption of ANGLE in
+ WPE/WebKitGTK}\par}
\usebeamerfont{author}{\insertauthor\par}
\end{minipage}
}
\setbeamertemplate{blocks}[default]
\setbeamercolor{block title}{fg=amber,bg=black}
-\title{\textbf{Sharing texture data between drivers}}
+\title{\textbf{Sharing texture data across EGL drivers}}
\author[Eleni Maria Stea <estea@igalia.com>]{\small{Eleni Maria Stea
<estea@igalia.com>}\\\\\includegraphics{data/igalia.eps}}
\date{\tiny{WebKit Codecamp}}
\end{comment}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
-\section[Introduction]{Introduction: Using ANGLE in WebGL2}
+\section[Introduction]{Introduction: Using ANGLE in WebGL2 (WebKit)}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\begin{frame}[fragile,c]
{\footnotesize{
\begin{enumerate}
\itemsep0.3cm
- \item {\color{coolblack}\textbf{Use ANGLE and EGL in the same program:
- create 2 X11 windows, and draw 2 images from 2 different contexts
- by 2 different drivers.}
+ \item {\color{coolblack}\textbf{Similar to WebKit: I've
+ used ANGLE and EGL in the same program (created 2 X11 windows, and
+ rendered 2 images from 2 different contexts by 2 different
+ drivers on them.}
\tiny{{(In several cases ANGLE behaves
different from EGL: e.g. when \texttt{eglMakeCurrent} doesn't
call \texttt{eglMakeCurrent}!!).}}
}
- \item {\color{coolblack}\textbf{Fix the problem with shared
- context and shared textures.}
+ \item {\color{coolblack}\textbf{Shared context: Filled a shared texture with ANGLE,
+ displayed it with the native driver. (REJECTED)}
\tiny{{(required
modifications in ANGLE OpenGL driver, writing an ANGLE extension, forcing the
EGL/OpenGL backend, and it wouldn't work with multiple
processes)}}
}
- \item {\color{coolblack}\textbf{Fix the problem by sharing a Linux kernel
- dma-buf buffer across drivers.}
+ \item {\color{coolblack}\textbf{DMA-buffers: Filled two textures
+ from two drivers simultaneously by using a shared Linux kernel
+ dma-buf buffer. (ADOPTED)}
- \tiny{{(drivers must support some EGL/GL extensions, but both mesa and
+ \tiny{{(drivers should support some EGL/GL extensions: both mesa and
ANGLE support them)}}
}
- \item {\color{coolblack}\textbf{Solve the multiple processes case.}
+ \item {\color{coolblack}\textbf{Investigated the multiple processes
+ case. (FUTURE)}
\tiny{{(we need some sort of IPC to exchange the dma-buf FD)}}
}
\begin{center}
\scriptsize{
I've ran my experiments using test programs and ANGLE,\\
- and I had to
- \textbf{\color{mediumred-violet}modify the default set up} to
- debug/explore ANGLE calls with GDB:
+ and I had to modify the default set up to step into ANGLE calls with GDB:
}
\end{center}
\vspace{0.1cm}
- \setbeamertemplate{blocks}[rounded]
-
- \begin{block}{\footnotesize{\textbf{Problems when building ANGLE:}}}\scriptsize{\texttt{
+ \setbeamertemplate{itemize/enumerate body begin}{\scriptsize}
+ \begin{block}{\scriptsize{Things that need attention when building ANGLE for
+ debugging:}}\scriptsize{
+ \vspace{0.2cm}
\begin{itemize}
\itemsep0.1cm
\color{coolblack}
\item {{\textbf{dwarf5} is not fully implemented on GDB, and so it's
impossible to step without errors when it's enabled.}}
\item {\textbf{Debugging symbols} aren't enabled by default.}
- \end{itemize}}}
+ \end{itemize}}
\vspace{0.2cm}
\end{block}
\setbeamertemplate{itemize item}[circle]
\begin{itemize}
\item {\textbf{Blog post} on how to set up
- \textbf{\color{mediumred-violet}{ANGLE}} and \textbf{\color{mediumred-violet}{GDB}} for debugging: \url{https://eleni.mutantstargoat.com/hikiko/debug-angle/}}
- \item {\textbf{Gist} with the \textbf{\color{mediumred-violet}{GN args}}
+ {\color{black}{ANGLE}} and {\color{black}{GDB}} for debugging: \url{https://eleni.mutantstargoat.com/hikiko/debug-angle/}}
+ \item {\textbf{Gist} with the {\color{black}{GN args}}
I've used: \url{https://gistof.com/gnargs}}
\end{itemize}}
\vspace{0.2cm}
\setbeamertemplate{itemize/enumerate subbody begin}{\tiny}
\setbeamertemplate{itemize/enumerate subsubbody begin}{\tiny}
\setbeamertemplate{itemize items}[triangle]
- \setbeamertemplate{blocks}[rounded]
\begin{center}
\textbf{\color{coolblack}First Test}
\end{center}
\vspace{-0.1cm}
\scriptsize{\color{coolblack}
- I've first written a program where both ANGLE and native system driver render
- images on two different X11 windows and displayed them side by side:
+ I've first written a program where both ANGLE and the native system driver render
+ images on X11 windows:
}
\vspace{-0.1cm}
\begin{center}
padding=1ex}{\includegraphics[height=1.5cm]{data/angle_egl.png}}
\end{center}
\vspace{-0.1cm}
- \begin{block}{\footnotesize{Things I had to take care of:}}
+ \begin{block}{\footnotesize{Some parts that needed attention:}}
\begin{itemize}
\item {Set ANGLE \textbf{library paths} in Makefile and link
with native system EGL.}
\vspace{-0.1cm}
\begin{center}
- \textbf{\color{coolblack}More on Makefile changes and dynamic loading:}
+ \textbf{\color{coolblack}Read more about invalidation and dynamic
+ loading:}
\end{center}
\setbeamertemplate{itemize/enumerate body begin}{\tiny}
\\
\rowcolor{platinum}
\textbf{new\_ctx} = {\color{mediumred-violet}eglCreateContext}(new\_ctx\_dpy, new\_ctx\_config,
- \textbf{native\_ctx}, new\_ctx\_attrib);\\
+ \textbf{shared\_ctx}, new\_ctx\_attrib);\\
\rowcolor{platinum}\\
\hline
\end{tabular}
\vspace{0.1cm}
\scriptsize{
- \textbf{\color{coolblack}{A texture generated by each context can be bound and used by the
- other\\ without ever leaving the GPU!}}
+ \textbf{\color{coolblack}{Each texture created by the
+ \texttt{shared\_ctx} can
+ be bound and used by the \texttt{new\_ctx} while it stays in the GPU!}}
}
\vspace{0.01cm}
\vspace{0.3cm}
- \begin{block}{Requirements to use shared context/textures in \textbf{WebKit}:}
+ \begin{block}{What would we need to change in \textbf{WebKit} for
+ shared context to work?}
\begin{itemize}
- \item We should use the \textbf{ANGLE EGL/OpenGL backend in
+ \item Force the \textbf{ANGLE EGL/OpenGL backend in
WebGL2} to
match the main Graphics Pipeline API/driver (both contexts
should be OpenGL or GLESv2 and from the same driver!)
\item We'd need an \textbf{ANGLE extension} to allow passing
native shared context to ANGLE's eglCreateContext instead of
ANGLE shared context.
- \item We should never move WebGL2 and Graphics Pipeline in
+ \item We should never split WebGL2 and Graphics Pipeline in
different processes. Shared contexts should be created by
the same process! (\textbf{Reason we've rejected this
method}).
OpenGL context between native EGL and ANGLE EGL using
\texttt{EGL\_ANGLE\_native\_shared\_context}:}
- \vspace{0.2cm}
- \begin{itemize}
- \item \tiny{We'd pass the native EGL context (created by the native system
- driver) as {\color{black}shared context} to the
- native OpenGL context that is created {\color{black}in the ANGLE
- OpenGL backend} using the native system driver!}
- \item \tiny{We'd need use the {\color{black}new EGL attribute
- (\texttt{EGL\_NATIVE\_SHARED\_CONTEXT\_ANGLE})} to let ANGLE know
- that the shared context \textit{\color{coolblack}is not ANGLE but native}
- context!}
- \end{itemize}
- \vspace{-0.2cm}
-
+ \vspace{0.5cm}
\begin{table}[t]
\centering
\begin{tabular}{l}
\setbeamercolor{block body}{bg=white}
\begin{center}
- \begin{block}{\tiny{Extension
- \texttt{EGL\_NATIVE\_SHARED\_CONTEXT\_ANGLE}:}}
+ \begin{block}{\tiny{What happens inside ANGLE
+ (with \texttt{EGL\_NATIVE\_SHARED\_CONTEXT\_ANGLE}):}}
\vspace{0.2cm}
\tiny{
\begin{table}[h]
\centering
- Worked on the extension implementation (draft state, there are
- bugs).\\
\begin{tabular}{l}
- \\
- \textbf{Concept:}\\
\begin{adjustbox}{max width=\textwidth}
\adjustbox{valign=t}{\includegraphics[scale=0.2]{data/shared_ctx3.png}}
- \end{adjustbox}\\
+ \end{adjustbox}
\end{tabular}
\end{table}
}
\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!}}
+ content sharing across different Linux drivers!}}
\vspace{-0.1cm}
\begin{table}[t]
\end{tabular}
\end{table}
- \textbf{\scriptsize{\color{coolblack}A few things that need our attention:}}\\
+ \textbf{\scriptsize{\color{coolblack}A few interesting things about
+ content sharing with dma buffers:}}\\
\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}!
+ extensions} to make it easier!
+ \item It's a {\color{coolblack}driver independent} method!
\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
+ import a dma\_buf file descriptor this method is also
{\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)
+ \item DMA buffers are a {\color{coolblack}Linux-only} thing...
+ but we won't need to support other systems! (Žan Doberšek)
\end{itemize}
\end{block}
\end{center}
\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{comment}
+% \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}
+% \end{comment}
+
+ \begin{block}{\scriptsize{EGL and GL extensions to share content across
+ drivers using dma\_buf buffers:}}
\begin{center}
\begin{itemize}
\item
\end{itemize}
\end{center}
\end{block}
+ \begin{block}{\scriptsize{Example Programs:}}
+ \begin{center}
+ \begin{itemize}
+ \item Associating two textures with the contents of the same
+ buffer without copy taking place.\\
+ Blog post: \url{https://eleni.mutantstargoat.com/hikiko/egl-dma-1/} \\
+ Code: \url{https://gistof.com/dma-egl-version}
+ \item Sharing texture data between ANGLE and the native system
+ driver using DMA buffers and EGL. \\
+ Blog post: \url{https://eleni.mutantstargoat.com/hikiko/angle-dma/}\\
+ Code: \url{https://gistof.com/dmaangleeglversion}
+ \end{itemize}
+ \end{center}
+ \end{block}
+
\end{frame}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\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}}
+ \adjustbox{valign=t}{\includegraphics[height=6.5cm]{data/dma_export_and_struct.png}}
\end{adjustbox}\\
\end{tabular}
\end{table}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\begin{frame}
- \frametitle{Test program}
+ \frametitle{Final test program (WORKS!)}
\begin{block}{\scriptsize{An exporter-importer that uses ANGLE and native
EGL}}
\setbeamertemplate{itemize/enumerate body begin}{\scriptsize}
\begin{itemize}
\itemsep0.3cm
- \itemsep0.2cm
\item First context is EGL/OpenGL like the one in main graphics
pipeline.
\item Second is ANGLE with EGL/GLESv2 backend like the one in
\begin{frame}[fragile,c]
\frametitle{What if WebGL and Graphics pipeline were separate processes?}
- \setbeamertemplate{blocks}[rounded]
\vspace{0.3cm}
\center{
pipeline in two processes. (Žan Doberšek)}}}
\vspace{0.5cm}
+ \setbeamercolor{block body}{bg=white}{\scriptsize}
\begin{block}{Can we still use shared DMA buffers?}
\footnotesize{
\frametitle{WIP WebKit:}
\center{\normalsize{\textbf{\color{coolblack}{Ongoing work on WebKit}}}}
- \vspace{0.3cm}
-
- {\footnotesize{
- \begin{block}{DONE/WIP/TODO}
- \begin{itemize}
- \item{Use the right CMake options (one can't simply enable
- \texttt{USE\_ANGLE\_WEBGL} ☺):
- \color{coolblack}{\textbf{FIXED }}}
- \item{There were compile errors when ANGLE was used:
- \color{coolblack}{\textbf{FIXED/Pending to send the patches}}}
- \item{Link errors when ANGLE is used:
- \color{coolblack}{\textbf{WIP/Partially FIXED}}}
- \item{Copy replacement: \color{coolblack}{\textbf{WIP/TODO}}}
- \end{itemize}
- \end{block}
- }}
-
- \vspace{0.2cm}
+ \vspace{0.1cm}
\begin{center}
\setbeamertemplate{itemize/enumerate body begin}{\scriptsize}
\setbeamertemplate{itemize/enumerate subbody begin}[circle]{\tiny}
something else (libgbm? copying?)}
\end{itemize}
\end{center}
+ \vspace{0.05cm}
+ {\scriptsize{
+ \begin{block}{DONE/WIP/TODO}
+ \begin{itemize}
+ \item{Use the right CMake options (one can't simply enable
+ \texttt{USE\_ANGLE\_WEBGL}!):
+ \color{coolblack}{\textbf{FIXED }}}
+ \item{There were compile errors when ANGLE was used:
+ \color{coolblack}{\textbf{FIXED/Pending to send the patches}}}
+ \item{Link errors when ANGLE is used:
+ \color{coolblack}{\textbf{WIP/Partially FIXED}}}
+ \item{Copy replacement: \color{coolblack}{\textbf{WIP/TODO}}}
+ \end{itemize}
+ \end{block}
+ }}
+
\end{frame}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\end{frame}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+\section[TheEnd]{Closing}
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+\begin{frame}[plain]
+\begin{minipage}[b][0.6\textheight]{\linewidth}
+ \begin{picture}(0, 0)
+ \put(0, -76){%
+ \pgfuseimage{igaliabglight}
+ }
+ \begin{minipage}[b][0.4\textheight]{\linewidth}
+ \begin{figure}
+ \includegraphics[scale=0.6]{data/mesa.png}
+ \end{figure}
+ \end{minipage}
+ \put(-200, 0) {
+ \hfill \huge{\textbf{\color{coolblack}Thank you!}}\\
+ }
+ \end{picture}
+\end{minipage}
+\end{frame}
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\end{document}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%