\frametitle{A few words about ANGLE}
\center{\textbf{\color{coolblack}{ANGLE is an EGL/GLESv2 implementation}}}
- \setbeamertemplate{itemize/enumerate body begin}{\footnotesize}
+ \setbeamertemplate{itemize/enumerate body begin}{\scriptsize}
\setbeamertemplate{itemize/enumerate subbody begin}{\tiny}
\setbeamertemplate{itemize/enumerate subsubbody begin}{\tiny}
\setbeamertemplate{itemize items}[triangle]
\setbeamertemplate{blocks}[rounded][shadow]
- \begin{block}{\color{afblue}{\footnotesize\textbf{EGL/GLESv2}:}}
+ \vspace{0.3cm}
+ \begin{block}{\color{afblue}{\scriptsize\textbf{EGL/GLESv2}:}}
\begin{itemize}
+ \itemsep0.2cm
\item GLESv2 is used to render graphics using the GPU (graphics
API).
\item EGL is used to create a GLESv2 context.
\end{itemize}
\end{block}
+ \vspace{0.3cm}
-
- \begin{block}{\color{afblue}{\footnotesize\textbf{ANGLE EGL/GLESv2}:}}
+ \begin{block}{\color{afblue}{\scriptsize\textbf{ANGLE EGL/GLESv2}:}}
\begin{itemize}
- \item GLESv2 is implemented on top of other APIs (OpenGL,
+ \itemsep0.2cm
+ \item GLESv2 is implemented \textbf{on top of other APIs} (OpenGL,
Vulkan, GLESv2). EGL too (EGL, GLX, gbm, headless display).
\item Users can select the most convenient backend using some
- \textit{ANGLE EGL extensions} (\texttt{eglext\_angle.h}) that
+ \textbf{ANGLE EGL extensions} (\texttt{eglext\_angle.h}) that
provide extra attributes to some standard EGL API stucts.
- \item Primary purpose of ANGLE is to provide EGL/GLESv2 to systems
+ \item Primary \textbf{purpose} of ANGLE is to provide EGL/GLESv2 to systems
lacking it.
\end{itemize}
\end{block}
\center{\textbf{\color{coolblack}{Using ANGLE (EGL/GLESv2 backend) in WebGL2 }}}
\vspace{0.2cm}
- \setbeamertemplate{itemize/enumerate body begin}{\footnotesize}
+ \setbeamertemplate{itemize/enumerate body begin}{\scriptsize}
\setbeamertemplate{itemize/enumerate subbody begin}{\tiny}
\setbeamertemplate{itemize/enumerate subsubbody begin}{\tiny}
\setbeamertemplate{itemize items}[triangle]
\setbeamertemplate{blocks}[rounded][shadow]
+ \vspace{0.1cm}
- \begin{block}{\color{afblue}{\footnotesize\textbf{Reasons}:}}
+ \begin{block}{\color{afblue}{\scriptsize\textbf{Reasons}:}}
\begin{itemize}
- \item better performance (Žan Doberšek)
- \item it'll be mostly a wrapper around the native driver (Linux mesa
- drivers implement GLESv2, Linux desktop provides libGLES*)
+ \item better performance in some cases (Žan Doberšek)
+ \item it'll be mostly an optimized wrapper around the native driver (libGLES*
+ is available on Linux desktop!)
\end{itemize}
\end{block}
- \begin{block}{\color{afblue}{\footnotesize\textbf{Problem}:}}
+ \vspace{0.3cm}
+ \begin{block}{\color{afblue}{\scriptsize\textbf{Problem}:}}
\begin{itemize}
- \item ANGLE renders on a GLESv2 texture created by ANGLE context
- \item WebKit graphics pipeline components use OpenGL textures that
- are composited by the WebKit compositor
+ \item \textbf{ANGLE} renders on a \textbf{GLESv2 texture} created by ANGLE context
+ \item {\color{coolblack}WebKit \textbf{graphics pipeline} components use
+ \textbf{OpenGL textures} that
+ are composited by the WebKit compositor}
\item We are currently \textbf{\textit{copying}} the ANGLE texture data to
an OpenGL texture to assemble the final image and this is
\textbf{\textit{slow}}!
\end{itemize}
\end{block}
+ \vspace{0.1cm}
+
\center{\textbf{\color{coolblack}{We need to replace this copy with
something better!}}}
\end{frame}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
-
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\section[Experiment 1]{Experiment 1: Using ANGLE and the native system driver in the same
\begin{frame}[fragile,c]
\frametitle{Step 1: Setting up to debug ANGLE with GDB}
+
+ \vspace{0.2cm}
+
\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:
+ }
\end{center}
+
+ \vspace{0.1cm}
+
+ \setbeamertemplate{blocks}[rounded][shadow]
+
+ \begin{block}{\footnotesize{\textbf{Problems when building ANGLE:}}}\scriptsize{\texttt{
+ \begin{itemize}
+ \itemsep0.1cm
+ \color{coolblack}
+ \item {{Default \textbf{gn} configuration redirects debugging
+ symbols into separate files where GDB can't find them.}}
+ \item {\textbf{GDB} doesn't know where to find the ANGLE
+ installation directories.}
+ \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}}}
+ \vspace{0.2cm}
+ \end{block}
+
+ \vspace{0.3cm}
+
+ \scriptsize{
+ \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}}
+ I've used: \url{https://gistof.com/gnargs}}
+ \end{itemize}}
+ \vspace{0.2cm}
\end{frame}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\begin{frame}[fragile,c]
\frametitle{Step 2: Contexts from two drivers in the same
- program}
+ program 1/2}
+
+ \setbeamertemplate{itemize/enumerate body begin}{\scriptsize}
+ \setbeamertemplate{itemize/enumerate subbody begin}{\tiny}
+ \setbeamertemplate{itemize/enumerate subsubbody begin}{\tiny}
+ \setbeamertemplate{itemize items}[triangle]
+ \setbeamertemplate{blocks}[rounded][shadow]
+
+ \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:
+ }
+ \vspace{-0.1cm}
+ \begin{center}
+ \adjustbox{valign=t, margin=1ex,
+ 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{itemize}
+ \item {Configure Makefile to find ANGLE \textbf{library paths} and link
+ with native system EGL.}
+ \item {\textbf{Dynamically open} ANGLE EGL and load its functions prefixed with
+ \texttt{angle\_} to distinguish them from native EGL ones.}
+ \item {Do the same for GLESv2.}
+ \item {\textbf{Invalidate the ANGLE context} at every display call.\\
+ (\textit{When ANGLE is not the only
+ implementation available \texttt{MakeCurrent} is not working as
+ expected!!!})}
+ \end{itemize}
+ \end{block}
+\end{frame}
+
+\begin{frame}[fragile,c]
+ \frametitle{Step 2: Contexts from two drivers in the same
+ program 2/2}
+ \vspace{-0.1cm}
+ \begin{center}
+ \textbf{\color{coolblack}Why invalidate MakeCurrent?}
+ \\
+ \begin{table}[c]
+ \begin{tabularx}{\textwidth}{l X}
+ \tiny{\textbf{\color{mediumred-violet}Context is cached in ANGLE!}} &
+ \adjustbox{valign=c, margin=0.1ex,
+ padding=0.1ex}{\includegraphics[height=2cm]{data/makecurrent.png}} \\
+ \end{tabularx}
+ \end{table}
+ \end{center}
+
+ \vspace{-0.1cm}
+ \begin{center}
+ \textbf{\color{coolblack}More on Makefile changes and dynamic loading:}
+ \end{center}
+
+ \setbeamertemplate{itemize/enumerate body begin}{\tiny}
+ \setbeamertemplate{itemize items}[circle]
+
+ \scriptsize{
+
+ \textbf{Blog post:}\\
+ Sharing texture data between ANGLE and the native system driver:\\
+ \url{https://eleni.mutantstargoat.com/hikiko/angle-dma/}
+ \begin{itemize}
+ \item \texttt{Makefile changes and dynamic loading:}\\
+ {\color{mediumred-violet}Step 1: Using
+ both libraries in the same program.}
+ \item \texttt{ANGLE MakeCurrent problem:}\\
+ {\color{mediumred-violet}{About ANGLE MakeCurrent.}}
+ \end{itemize}
+
+ \vspace{-0.1cm}
+
+ \textbf{Code:}\\
+ \url{https://github.com/hikiko/shctx/tree/wip/system\_egl\_dynamic\_angle}
+
+ }
+\end{frame}
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+\section[Experiment 2]{Experiment 2: Sharing a texture across drivers using shared context}
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+\begin{frame}[fragile,c]
+ \frametitle{}
\begin{center}
\end{center}
\end{frame}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
-\section[Experiment 2]{Experiment 2: Sharing a texture across drivers using shared context}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\section[Multiple Processes]{Multiple Processes}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\itemsep0.3cm
\item {\color{coolblack} \textbf{YES!} DMA buffers can be shared across
multiple processes.}
- \item {\color{coolblack} But we need some sort of \textit{interprocess
- communication} to exchange the file descriptor.}
- \item {\color{coolblack} This is a client-server example that uses unix
+ \item {\color{coolblack} But we need some sort of \textbf{\textit{interprocess
+ communication}} to exchange the file descriptor.}
+ \item {\color{coolblack} This is a client-server
+ \textbf{\textit{example}} that uses unix
sockets to pass the dma-buf FD from one process to the other:
- \url{https://gitlab.com/blaztinn/dma-buf-texture-sharing}. It could
- be adapted to our needs when we switch to multiple processes.}
+ \url{https://gitlab.com/blaztinn/dma-buf-texture-sharing}.}
\end{itemize}
}
\end{frame}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\section[WebKit Integration]{WebKit Integration}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\end{frame}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
+
+%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\section[References]{References}
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%\setbeamertemplate{bibliography entry title}{}
projects / webkit_codecamp / commitdiff