\documentclass{beamer} \let\oldhref\href \def\href#1#2{\oldhref{#1}{\color{cloogledark!50!clooglemain} #2}} \def\https#1{\href{https://#1}{#1}} \def\mailto#1{\href{mailto:#1}{#1}} \title[Cloogle]{\texorpdfstring{\includegraphics[width=5em]{logo}}{Cloogle}} \subtitle{A programming language search engine and its applications} \author[Camil Staps]{\texorpdfstring{Camil Staps\\[1em]\footnotesize\mailto{camil@cloogle.org}}{Camil Staps}} \date{January 5\textsuperscript{th}, 2018} \usetheme{CambridgeUS} \usecolortheme{cloogle} \useinnertheme{circles} \setbeamertemplate{itemize item}[triangle] \setbeamertemplate{itemize subitem}[circle] \usepackage[british]{babel} \usepackage{csquotes} \usepackage{tikz} \usepackage{clooglearch} \usepackage{minted} \setminted{fontsize=\small} \usepackage{menukeys} % https://tex.stackexchange.com/a/23522/23992 \def\imagetop#1{\vtop{\null\hbox{#1}}} \AtBeginSubsection[]{% \begin{frame} \frametitle{Table of Contents} \tableofcontents[currentsection,currentsubsection] \end{frame}} \begin{document} \maketitle \section{Background} \subsection{Why build a search engine?} \begin{frame}[fragile]{Background} \begin{itemize}[<+->] \item What is wrong with this code? \begin{minted}[gobble=4]{clean} incAll :: [Int] -> [Int] incAll [] = [] incAll [x:xs] = [x+1:incAll xs] \end{minted} \item Better: \begin{minted}[gobble=4]{clean} incAll = map ((+) 1) \end{minted} \end{itemize} \end{frame} \begin{frame}{Background} Lack of abstraction due to... \begin{itemize} \item Poor conceptualisation of the programmer? \pause \item Poor knowledge of the standard libraries? \medskip \quad\enquote{There is this function \texttt{map}, but where is it defined?} \end{itemize} \pause Solution: build a search engine! \end{frame} \section{Functionality} \begin{frame}{Functionality} \centering \begin{tabular}{l l} \imagetop{\includegraphics[width=.45\textwidth]{scrot-search-name}} & \pause \imagetop{\includegraphics[width=.45\textwidth]{scrot-search-unify}} \pause\\ \imagetop{\includegraphics[width=.45\textwidth]{scrot-search-typedef}} \pause& \imagetop{\includegraphics[width=.45\textwidth]{scrot-search-class}} \end{tabular} \end{frame} \section{Architecture} \subsection{Overview} \begin{frame}{Architecture} \centering \footnotesize \begin{tikzpicture}[every node/.style={draw,block}] \useasboundingbox (-5,-4) rectangle (3.5,4); \only<1->\tikzsource \only<2->\tikzbuilddb \only<3->\tikzbackend \only<4->\tikzcache \only<5->\tikzfrontend \only<6->\tikzfrontendsrc \only<7->\tikzstats \only<8->\tikzclientA \only<9->\tikzclientB \only<10->\tikzclientC \only<11->\tikzclientD \only<12->\tikzclientE \end{tikzpicture} \end{frame} \subsection{Running locally: cloogle-tags} \begin{frame}[fragile]{What if we want to run Cloogle locally?} \begin{itemize} \item Most common use case: finding definitions in personal libraries \pause \item Many editors support \emph{tagfiles}: \begin{minted}[gobble=4]{text} drop StdList.dcl 46 fopen StdFile.dcl 27 ... \end{minted} \pause \item How to use Cloogle to generate tagfiles? \end{itemize} \end{frame} \begin{frame}{Running locally: old architecture} \centering \footnotesize \begin{tikzpicture}[every node/.style={draw,block}] \useasboundingbox (-5,-4) rectangle (3.5,4); \tikzsource \tikzbuilddb \tikzbackend \tikzcache \tikzfrontend \tikzfrontendsrc \tikzstats \tikzclientA \tikzclientB \tikzclientC \tikzclientD \tikzclientE \end{tikzpicture} \end{frame} \begin{frame}{Running locally: new architecture} \centering \footnotesize \begin{tikzpicture}[every node/.style={draw,block}] \useasboundingbox (-5,-4) rectangle (3.5,4); \tikzsource \tikzbuilddb[1] \only<1>{% \tikzbackend[1] \tikzcache[1] \tikzfrontend[1] \tikzfrontendsrc[1] \tikzstats[1] \tikzclientA \tikzclientB \tikzclientC \tikzclientD \tikzclientE} \only<2->{% \tikzbackend[2] \tikzcache[2] \tikzfrontend[2] \tikzfrontendsrc[2] \tikzstats[2] \tikzclientB[2] \tikzclientC[2] \tikzclientD[2] \tikzclientE[2] \tikzcloogletags} \only<2>{\tikzclientA[2]} \only<3>{\tikzclientA[3]} \only<4>{\tikzclientA[4]} \end{tikzpicture} \end{frame} \begin{frame}{Editor integration (vim-clean)} \begin{itemize}[<+->] \item Search command: \texttt{:Cloogle take} \item Search for word under cursor ({\small\keys{\textbackslash+c}}) \item Tagfiles \item Jumping to definition/implementation ({\small\keys{\textbackslash+d+t}}) \item Automatic imports ({\small\keys{\textbackslash+a+i}}) \item Status line: \medskip \begin{center} \includegraphics[width=.5\textwidth]{statusline} \end{center} \end{itemize} \end{frame} \section*{The end} \subsection*{Evaluation} \begin{frame}[fragile]{Evaluation} \begin{itemize}[<+->] \item The first generation of students was very enthusiastic \begin{itemize} \item The second not so much... \item But statistics show they used it more and more during the course \end{itemize} \item Unification search has some issues: you will never find \begin{minted}[gobble=4]{clean} fopen :: String Int *f -> (Bool, *File, *f) \end{minted} \begin{itemize} \item Hoogle uses an edit distance on types \item But a unifier gives useful information, like required instances \item In the future, we will probably combine both approaches \end{itemize} \item It's not just about search: indexing code has many use cases! \begin{itemize} \item Jumping to definitions (tagfiles) \item Automatic imports (vim-clean) \item Type-based code completion? \end{itemize} \end{itemize} \end{frame} \subsection*{Acknowledgements} \begin{frame}[shrink]{Acknowledgements} Cloogle was conceived and built by: \begin{itemize} \item Camil Staps \item Mart Lubbers \end{itemize} With contributions by: \begin{itemize} \item Erin van der Veen \item Koen Dercksen \end{itemize} Using: \begin{itemize} \item The Clean compiler (the Clean team) \end{itemize} With thanks to: \begin{itemize} \item All users, for new ideas and bug reports (explicitly or in the query log) \end{itemize} Authors of clients: \begin{itemize} \item CLI app: Koen Dercksen \item IRC bot: Mart Lubbers \item vim-clean integration, Telegram bot, email client: Camil Staps \item Visual Studio Code plugin: Lucas Franceschino \end{itemize} \end{frame} \appendix \AtBeginSubsection[]{} \newcounter{finalframe} \setcounter{finalframe}{\value{framenumber}} \section{Appendices} \begin{frame} \frametitle{Appendices} \tableofcontents[currentsection] \end{frame} \subsection{Can I use Cloogle for language X?} \begin{frame}{Can I use Cloogle for language X?} \begin{itemize} \item It will work best on a language with the Hindley-Milner type system \begin{itemize} \item It can still be useful to less strongly typed languages \item It would be interesting to develop a search engine for dependent types \end{itemize} \item The search system is language-agnostic, but you need a tool to index source code into our JSON format \item Also see: \https{neilmitchell.blogspot.nl/2011/03/hoogle-for-your-language-ie-f-scala-ml.html} \item Contact me! \end{itemize} \end{frame} \subsection{Couldn't you use Hoogle?} \begin{frame}{Couldn't you use Hoogle?} \begin{itemize} \item When we started we didn't realise it would be so much work \item Right now, having the pipeline set up turns out to be really useful for other goals as well \end{itemize} \end{frame} \subsection{Numbers} \begin{frame}{Numbers\setcounter{footnote}{0}\footnotemark} \setcounter{footnote}{1} \begin{columns}[t] \begin{column}{.5\textwidth} \begin{itemize} \item Database \begin{description}[Syntax constructs] \small \item[Modules] 765 \item[Functions] 15,439 \item[Unique types] 7,610 \item[Type tree depth] 8 \item[Type definitions] 2,218 \item[Classes] 274 \item[Instances] 1986 \item[Derivations] 1,175 \item[Syntax constructs] 37 \end{description} \end{itemize} \end{column} \begin{column}{.5\textwidth} \begin{itemize} \item Lines of code\footnotemark % cloc --exclude-dir=clean-compiler,CleanRep.2.2_files,CleanRep.2.2.css,storage,cache,Clean\ System\ Files,types.json,typetree.dot,cloogle.log,tags . \begin{description}[Bourne Shell] \small \item[Clean] 4,811 \item[JavaScript] 1,717 \item[PHP] 857 \item[HTML] 580 \item[CSS] 440 \item[Python] 182 \item[Bourne Shell] 104 \end{description} \end{itemize} \end{column} \end{columns} \medskip \begin{itemize} \item Visitor statistics: \https{cloogle.org/stats/longterm.html} \end{itemize} \setcounter{footnote}{1} \footnotetext{2018-01-01} \setcounter{footnote}{2} \footnotetext{On the web frontend and submodules, excluding the Clean compiler} \end{frame} \subsection{Links} \begin{frame}[shrink]{Links} \footnotesize \textbf{Core system:} \begin{description}[VS Code plugin] \item[API] \https{github.com/clean-cloogle/libcloogle} \item[Core] \https{github.com/clean-cloogle/Cloogle} \item[Web] \https{github.com/clean-cloogle/cloogle.org} \item[JS highlighter] \https{github.com/clean-cloogle/clean.js} \item[Pygments lexer] \https{github.com/clean-cloogle/pygments-lexer-clean} \item[Pretty printer] \https{github.com/clean-cloogle/CleanPrettyPrint} \item[Type unifier] \https{github.com/clean-cloogle/CleanTypeUnifier} \end{description} \textbf{Clients:} \begin{description}[VS Code plugin] \item[vim-clean] \https{github.com/camilstaps/vim-clean} \item[CLI app] \https{github.com/clean-cloogle/cloogle-cli} \item[Telegram bot] \https{telegram.me/CloogleBot}; \https{github.com/clean-cloogle/CloogleBot} \item[IRC bot] \#cloogle on \https{freenode.net}; \https{github.com/clean-cloogle/clean-irc} \item[Email client] \mailto{query@cloogle.org}; \https{github.com/clean-cloogle/cloogle-mail} \item[VS Code plugin] \https{github.com/W95Psp/CleanForVSCode} \end{description} \textbf{Miscellaneous:} \begin{description}[Pygments lexer] \item[cloogle-tags] \https{github.com/clean-cloogle/cloogle-tags} \item[These slides] \https{github.com/clean-cloogle/presentation-NL-FP-2018} \end{description} \end{frame} \setcounter{framenumber}{\value{finalframe}} \end{document}