\documentclass[10pt,a4paper]{article} % Packages \usepackage{fancyhdr} % For header and footer \usepackage{multicol} % Allows multicols in tables \usepackage{tabularx} % Intelligent column widths \usepackage{tabulary} % Used in header and footer \usepackage{hhline} % Border under tables \usepackage{graphicx} % For images \usepackage{xcolor} % For hex colours %\usepackage[utf8x]{inputenc} % For unicode character support \usepackage[T1]{fontenc} % Without this we get weird character replacements \usepackage{colortbl} % For coloured tables \usepackage{setspace} % For line height \usepackage{lastpage} % Needed for total page number \usepackage{seqsplit} % Splits long words. %\usepackage{opensans} % Can't make this work so far. Shame. Would be lovely. \usepackage[normalem]{ulem} % For underlining links % Most of the following are not required for the majority % of cheat sheets but are needed for some symbol support. \usepackage{amsmath} % Symbols \usepackage{MnSymbol} % Symbols \usepackage{wasysym} % Symbols %\usepackage[english,german,french,spanish,italian]{babel} % Languages % Document Info \author{\_allisonwalker} \pdfinfo{ /Title (cs-3500-final-notes.pdf) /Creator (Cheatography) /Author (\_allisonwalker) /Subject (CS 3500 Final Notes Cheat Sheet) } % Lengths and widths \addtolength{\textwidth}{6cm} \addtolength{\textheight}{-1cm} \addtolength{\hoffset}{-3cm} \addtolength{\voffset}{-2cm} \setlength{\tabcolsep}{0.2cm} % Space between columns \setlength{\headsep}{-12pt} % Reduce space between header and content \setlength{\headheight}{85pt} % If less, LaTeX automatically increases it \renewcommand{\footrulewidth}{0pt} % Remove footer line \renewcommand{\headrulewidth}{0pt} % Remove header line \renewcommand{\seqinsert}{\ifmmode\allowbreak\else\-\fi} % Hyphens in seqsplit % This two commands together give roughly % the right line height in the tables \renewcommand{\arraystretch}{1.3} \onehalfspacing % Commands \newcommand{\SetRowColor}[1]{\noalign{\gdef\RowColorName{#1}}\rowcolor{\RowColorName}} % Shortcut for row colour \newcommand{\mymulticolumn}[3]{\multicolumn{#1}{>{\columncolor{\RowColorName}}#2}{#3}} % For coloured multi-cols \newcolumntype{x}[1]{>{\raggedright}p{#1}} % New column types for ragged-right paragraph columns \newcommand{\tn}{\tabularnewline} % Required as custom column type in use % Font and Colours \definecolor{HeadBackground}{HTML}{333333} \definecolor{FootBackground}{HTML}{666666} \definecolor{TextColor}{HTML}{333333} \definecolor{DarkBackground}{HTML}{CBC3E3} \definecolor{LightBackground}{HTML}{F2F0F8} \renewcommand{\familydefault}{\sfdefault} \color{TextColor} % Header and Footer \pagestyle{fancy} \fancyhead{} % Set header to blank \fancyfoot{} % Set footer to blank \fancyhead[L]{ \noindent \begin{multicols}{3} \begin{tabulary}{5.8cm}{C} \SetRowColor{DarkBackground} \vspace{-7pt} {\parbox{\dimexpr\textwidth-2\fboxsep\relax}{\noindent \hspace*{-6pt}\includegraphics[width=5.8cm]{/web/www.cheatography.com/public/images/cheatography_logo.pdf}} } \end{tabulary} \columnbreak \begin{tabulary}{11cm}{L} \vspace{-2pt}\large{\bf{\textcolor{DarkBackground}{\textrm{CS 3500 Final Notes Cheat Sheet}}}} \\ \normalsize{by \textcolor{DarkBackground}{\_allisonwalker} via \textcolor{DarkBackground}{\uline{cheatography.com/181463/cs/38486/}}} \end{tabulary} \end{multicols}} \fancyfoot[L]{ \footnotesize \noindent \begin{multicols}{3} \begin{tabulary}{5.8cm}{LL} \SetRowColor{FootBackground} \mymulticolumn{2}{p{5.377cm}}{\bf\textcolor{white}{Cheatographer}} \\ \vspace{-2pt}\_allisonwalker \\ \uline{cheatography.com/allisonwalker} \\ \end{tabulary} \vfill \columnbreak \begin{tabulary}{5.8cm}{L} \SetRowColor{FootBackground} \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Cheat Sheet}} \\ \vspace{-2pt}Not Yet Published.\\ Updated 2nd May, 2023.\\ Page {\thepage} of \pageref{LastPage}. \end{tabulary} \vfill \columnbreak \begin{tabulary}{5.8cm}{L} \SetRowColor{FootBackground} \mymulticolumn{1}{p{5.377cm}}{\bf\textcolor{white}{Sponsor}} \\ \SetRowColor{white} \vspace{-5pt} %\includegraphics[width=48px,height=48px]{dave.jpeg} Measure your website readability!\\ www.readability-score.com \end{tabulary} \end{multicols}} \begin{document} \raggedright \raggedcolumns % Set font size to small. Switch to any value % from this page to resize cheat sheet text: % www.emerson.emory.edu/services/latex/latex_169.html \footnotesize % Small font. \begin{multicols*}{4} \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Networking}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Key Networking Issues -Data Arrival}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}You never know how much data will arrive at any given time Some or all may "Show up" - What does arrive will be in order Therefore: all data concatenated/stored Search "all data" for messages Protocol of "what is a message?" Newline/Period/etc.} \tn % Row Count 7 (+ 7) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Key Parts to Networking Object}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Callbacks -This is how the network code communicates state to the "user" program TcpClient/TcpListener objects -The main object you will be using See SimpleChat{[}Client/Server{]}TcpClient code ID -A unique identifier for the connection Settable (default → socket)} \tn % Row Count 14 (+ 7) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{p{0.3433 cm} p{0.3433 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{3.833cm}}{\bf\textcolor{white}{DataBase Principles - SQL and C\# Interface to DB}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{2}{x{3.833cm}}{} \tn % Row Count 0 (+ 0) \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Good Software Practices}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{GSPs refer to tools, techniques, processes, etc., that are used to ensure our code is:}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Easier to maintain Contains fewer defects} \tn % Row Count 3 (+ 3) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Examples include:}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Versioning (git/github/github projects) Design Patterns System Architecture decisions (e.g., MVC) SOLID, DRY Diagramming/UML Testing Unit Testing, Integration Testing, open/closed-box testing, C\# test syntax, e.g., TestClass(){]}…)} \tn % Row Count 9 (+ 6) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Self Documenting Code}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}"Self-documenting code is ostensibly written using human-readable names, typically consisting of a phrase in a human language which reflects the symbol's meaning…"} \tn % Row Count 14 (+ 5) % Row 3 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Refactoring}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Changing code (often automatically) to be more maintainable} \tn % Row Count 17 (+ 3) % Row 4 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Refactoring Techniques 1}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Inline Temp That being said: Extract Variable (Self-Documenting Code) Decompose-conditional Split-temporary-variable Self-encapsulate-field} \tn % Row Count 21 (+ 4) % Row 5 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Refactoring Techniques 2}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Extract-interface Extract-method \seqsplit{Consolidate-duplicate-conditional-fragments}} \tn % Row Count 24 (+ 3) % Row 6 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Refactoring Techniques 3}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Hide-method \seqsplit{Replace-exception-with-test} Extract-class What SOLID is this?} \tn % Row Count 27 (+ 3) % Row 7 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Visual Studio (to the rescue!?!)}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Visual Studio support… None – Some operations will be done by hand Some – Some operations, like renaming can be done quickly. A lot – Some operations, like method extraction, can be done completely!} \tn % Row Count 33 (+ 6) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Good Software Practices (cont)}} \tn % Row 8 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Visual Studio (to the rescue!?!) Continued}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Note: you cannot extract private methods to an interface… this doesn't make sense as interfaces expose functionality. Note 2: Phase1 and Phase2 are probably poor examples of where you would create an interface.} \tn % Row Count 6 (+ 6) % Row 9 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Code Analysis}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Apply computer programs to Analyze and Improve computer programming Code Analysis Tools Complexity Analysis - e.g., how many lines of code Duplicate Code Analysis - e.g., could be refactored into methods Style Guides - e.g., put spaces around parameters Code Cleanup - e.g., remove unused using statements} \tn % Row Count 14 (+ 8) % Row 10 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Code Analysis Continued}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Code Analysis is run upon compilation Shown as warnings/messages in Error List} \tn % Row Count 17 (+ 3) % Row 11 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Code Cleanup}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Auto-Tools for "cleaning up" code base E.G., remove unnecessary usings Many of the "suggestions" you see with the underline squigglys Note: All "styles" should be agreed upon by team at start of development} \tn % Row Count 23 (+ 6) % Row 12 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Design Patterns}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Design Patterns Well understood and beneficial ways to effectively solve recurring problems Anti-Patterns Common ways of solving problems that have unintended side effects. Examples included: Iterator, and Null object} \tn % Row Count 29 (+ 6) % Row 13 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Design Pattern -Iterator}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}collection = new List( … ) Foreach (var x in collection) collection = new Dictionary( … ) Foreach (var x in collection) collection = new Tree( … ) Foreach (var x in collection) They all work and collection Type can even be changed without changing the loop! We don't care how the Data Structure iterates, just that it does Aside: How does a Dictionary iterate?} \tn % Row Count 38 (+ 9) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Good Software Practices (cont)}} \tn % Row 14 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Design Pattern -Null Object}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}// BAD Logger logger = null; If (logger != null) logger.LogDebug(...); // GOOD Logger logger = NullLogger.Instance; logger.LogDebug( … )} \tn % Row Count 5 (+ 5) % Row 15 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Anti-Pattern: Hard Coded Constants}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}All constants in your code should be replaced by named constants/read-only variables What is difference between read only and const? All \seqsplit{loops/data-structures/etc}., should be able to handle "any size" of data.} \tn % Row Count 11 (+ 6) % Row 16 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Anti-Pattern: Premature Optimization}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Don't write complex code to speed up a potential bottleneck. \_DO\_ use well known data structures and worry about Big O (Complexity). Optimize when you have empirical evidence that what you think is the bottleneck, actually is. Next Lecture → Profiling} \tn % Row Count 18 (+ 7) % Row 17 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Rigor}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Documenting Subdividing (separation of concerns) Big methods broken into multiple small methods Big tasks broken into multiple small tasks Hard Tasks "approximated" first Naming Debugging} \tn % Row Count 24 (+ 6) % Row 18 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Software Practice Principles}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Understand the problem you are trying to solve Seek clarification of requirements early Approach each step in isolation Toy programs Separation of concerns Iterate - small steps Use versioning often} \tn % Row Count 30 (+ 6) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{MAUI/GUI}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Dispatcher}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Dispatcher Puts requests for GUI changes into a queue When the GUI thread "has a chance", take care of requests in queue Always runs on GUI thread Warning - More than one thread (GUI + networking(s)): LOCKING!!! If your GUI thread deals with an object that a networking thread also uses, you must protect the code using locks!} \tn % Row Count 9 (+ 9) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{MVC in A7}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Tendency is to write all of our logic together Assignment 7 Server "logics" Networking ← Model GUI ← View/Controller Connected Clients ← Model} \tn % Row Count 14 (+ 5) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Separation of concerns GUI server}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Everything to do with storing multiple clients should be "abstracted" (i.e., put into a model class) Everything to do with Networking should be put into the Networking class Everything to do with the GUI should stay in the GUI class} \tn % Row Count 21 (+ 7) % Row 3 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{GUI/Network Multi-threading}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Guis are generally multi-threaded, -unless your GUI doesnt do any processing that requires time, you must use a BG worker to do the work so the GUI remains responsive. Networking code is multi-threaded.} \tn % Row Count 27 (+ 6) % Row 4 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Invalidate}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Invalidate i.e., \seqsplit{PlaySurface.Invalidate();} Can be called anywhere (not just on GUI thread) Tell GUI Thread: At next opportunity, redraw the affected region Suggested Options Always (inside Draw Scene) → BAD :( "Burns" cycles On Message Received → Locked with Server → Okay Timer → X times per second → Good as well Especially if your client did "interpolation"!} \tn % Row Count 37 (+ 10) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{MAUI/GUI (cont)}} \tn % Row 5 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Dispatching}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}All GUI updates must be done on the GUI thread (thread 1) When there are multiple threads in your program Any access to the GUI should be through the Dispatcher.} \tn % Row Count 5 (+ 5) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Basic Web Server ideas, e.g. HTTP/HTML/CSS}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Web Server}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Simply a program that listens on a port for a connection (e.g., from a web browser) and sends back web pages Using HTTP Hypertext transport protocol} \tn % Row Count 5 (+ 5) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{HTTP Sequence}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Point browser to a web server, e.g., http://www.webpage.com Browser opens socket to address Server accepts socket Browser sends text: "GET / HTTP/1.1" + stuff Server replies with text: "HTTP/1.1 200 OK …" + "\textless{}html\textgreater{}…\textless{}/html\textgreater{}" Server closes socket – every HTTP request uses a new connection} \tn % Row Count 13 (+ 8) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Protocol}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}hwww.khanacademy.org \seqsplit{hypertext-transfer-protocol-http} Just a bunch of strings sent through sockets on the net… Request, e.g., GET / HTTP/1.1 Host: www.cs.utah.edu Response, e.g., HTTP/1.1 200 OK Content-Type: text/html; charset-UTF-8} \tn % Row Count 20 (+ 7) % Row 3 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{HTTP Web Response}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Just a string that follows the protocol, e.g., Header {[}New Line{]} Body. Example: HTTP/1.1 200 OK\textbackslash{}n Connection: close\textbackslash{}n Content-Type: text/html; charset=UTF-8\textbackslash{}n \textbackslash{}n \textless{}text or html\textgreater{}} \tn % Row Count 25 (+ 5) % Row 4 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{HTML Body Example}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}\textless{}!DOCTYPE html\textgreater{} \textless{}!-{}- From w3schools –\textgreater{} \textless{}html\textgreater{} \textless{}body\textgreater{} \textless{}h1\textgreater{}My First Heading\textless{}/h1\textgreater{} \textless{}p\textgreater{}My first paragraph.\textless{}/p\textgreater{} \textless{}/body\textgreater{} \textless{}/html\textgreater{}} \tn % Row Count 29 (+ 4) % Row 5 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{URL}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Uniform Resource Locator \seqsplit{scheme://host:port/path?query} scheme → protocol (e.g. ftp, http, https) host → server name or address e.g. www.cs.utah.edu Port → 80/443 by default We will continue to use 11000} \tn % Row Count 35 (+ 6) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Basic Web Server ideas, e.g. HTTP/HTML/CSS (cont)}} \tn % Row 6 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{HTML Keywords}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}HTML very similar to XML Headers → h1, h2, h3, … Paragraph → \textless{}p\textgreater{} … \textless{}/p\textgreater{} Image → \textless{}img src="url" alt="english"/\textgreater{} Format → \textless{}b\textgreater{} bold, \textless{}u\textgreater{} underline, etc. Logical Divisions → \textless{}div\textgreater{} Document → \textless{}doctype\textgreater{} Link -\textgreater{} \textless{}a …\textgreater{} Many more} \tn % Row Count 7 (+ 7) % Row 7 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{URL -Path}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}scheme://host:port/path path → file/directory/page to access Optional Default is assumed to be file "index.html" Interpreting path is entirely up to the server www.cs.utah.edu/\textasciitilde{}germain www.twitter.com/search \seqsplit{https://www.google.com/search?q=abc\&oq=abc\&aqs=chrome..69i57j0l6j46.552j0j7\&sourceid=chrome\&ie=UTF-8}} \tn % Row Count 15 (+ 8) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{C\#}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Compiler Optimization in C\#}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}In C\#, we don't have much control Optimization is done by the runtime (JIT) And partly by the CIL compiler \seqsplit{https://www.geeksforgeeks.org/what-is-just-in-time-jit-compiler-in-dot-net/} This is fine for most purposes C\# is not the language of choice for (super) high performance…} \tn % Row Count 7 (+ 7) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Micro Optimization - Data Access}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Accessing data in certain patterns (order) can be faster than others Caching Memory system Prefetching} \tn % Row Count 11 (+ 4) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{When to "Micro Optimize"}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}If you've picked all the right algorithms… …and profiled everything …and it's still not fast enough Then maybe start micro-optimizing Learn more about this in CS 4400 Games and graphics need a lot of this} \tn % Row Count 17 (+ 6) % Row 3 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Profiling}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}First, determine where our program spends time. Every once-in-a-while, stop the program and examine where it is executing (Sampling) Accumulate samples over time – attribute them to methods "Once-in-a-while" is on the order of milliseconds} \tn % Row Count 24 (+ 7) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Logging}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Logging Definition}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Logging is the act of recording information about the what is happening during the run time of your program} \tn % Row Count 4 (+ 4) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Logs can be sent to one or more of the following:}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Console Debug Display in Visual Studio GUI Files Databases Windows Event Log Etc.} \tn % Row Count 8 (+ 4) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Log Levels}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Some information is more important (to certain people) than other. Too much information is often not useful. Log Levels Refers to how much and how "high a level" (or low) the information is E.g. Debug vs Critical Error} \tn % Row Count 14 (+ 6) % Row 3 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{0 Trace}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}every little detail.. way too much information... turn this off most of the time Stakeholder: Developer - Something really odd is going on… Show me all the mouse X,Y values as the mouse traverses the screen} \tn % Row Count 20 (+ 6) % Row 4 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{1 Debug}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}standard detail level... usually too much info to store... use this for development Stakeholder: Developer - Standard Development Cycle Show me every collision between two objects in the game} \tn % Row Count 26 (+ 6) % Row 5 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{2 Information}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}high level information... for example "when a client connects"... use this to understand "meta-level" of application Stakeholder: Developer/Site Administrator Show me who logged into the system.} \tn % Row Count 32 (+ 6) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Logging (cont)}} \tn % Row 6 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{3 Warning}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}something is probably going wrong, but we haven't handled it yet Stakeholder: Developer/Site Administrator Show me when an unauthorized user attempts to access data} \tn % Row Count 5 (+ 5) % Row 7 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{4 Error}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}something has gone wrong and we didn't know how to (or didn't want to spend the time) to handle it Stakeholders: Site Administrators, Project Lead, (Developer) Bank software cannot transfer to another bank} \tn % Row Count 11 (+ 6) % Row 8 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{5 Critical}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}the application is about to die... can we do it gracefully? Stakeholders: Site Administrator, Project Lead Bank software "died" because database is not accessible} \tn % Row Count 16 (+ 5) % Row 9 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{6 None}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}turn off messaging. Reasons to do: My code is perfect. Disk space is very expensive. (Note: neither of these are a reason to do this, nor are they true)} \tn % Row Count 21 (+ 5) % Row 10 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Where in Code to place Logging}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Any "big" action Connection on the net Any "complicated" action For debugging complete message building Any "catastrophic" event Let developer manager know where to go back to look for problem} \tn % Row Count 27 (+ 6) % Row 11 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Example of levels to log messages at}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Position of mouse \_logger.LogTrace(\$ "\{MousePosition\}" ); Partial messages coming over internet \_logger.LogDebug( \$"Data Receive: \{data\}" ); Information (or maybe just warning) New Chat Client Connected \_logger.LogInformation( \$" \{name\} connected from \{ip\_address\}" );} \tn % Row Count 34 (+ 7) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Logging (cont)}} \tn % Row 12 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Setting Up Logger on a C\# program}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}To (correctly) use Loggers and Dependency Injection, you must instrument the following places of your code: The Main Program The Class Constructor Class Methods} \tn % Row Count 5 (+ 5) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Threading}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Async}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Async methods should do "something" that may take a long time E.g., DB lookup, network connection, big computation} \tn % Row Count 4 (+ 4) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Await}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}await keyword tells program to "yield" cpu to other tasks while the long running operation completes Then resume at the given line when task is done WARNING: may be on a different thread} \tn % Row Count 10 (+ 6) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Networking and GUI → Threads}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Network communications come in "Async" Handled on DIFFERENT threads GUI work MUST BE DONE on the GUI thread Solution: Dispatcher.Dispatch( ( ) =\textgreater{} \{ MessagesAndStatus.Text = \$"Server Shutdown!" + Environment.NewLine; \}} \tn % Row Count 16 (+ 6) % Row 3 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Which thread is running}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Use: \seqsplit{Environment.CurrentManagedThreadId} Print this next to every log message to help you understand what is going on. If value != 1, then not the GUI thread! Also Remember: Debug Window Parallel Stacks} \tn % Row Count 22 (+ 6) % Row 4 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Race Condition}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}The Clients list is "shared" by all threads, thus becoming a Race Condition How do we fix this? Answer: locking! Warning for Server: Don't "hold on to" client list while doing lots of work (e.g., sending messages to all clients) Copy client list (while locked) Then iterate over the copied list!} \tn % Row Count 30 (+ 8) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{Threading (cont)}} \tn % Row 5 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Race Condition Continued}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}GUI and Networking code use Threads to execute Any object that is referenced in methods that may be executing simultaneously in two or more threads MUST lock the data * Why is "lock the data" misleading in the statement above?} \tn % Row Count 6 (+ 6) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{x{1.7165 cm} x{1.7165 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{3.833cm}}{\bf\textcolor{white}{Dependency Injection}} \tn % Row 0 \SetRowColor{LightBackground} {\bf{Key Ideas:}} & Code (objects) need other Code (objects) to work (or to be more effective) Databases, Loggers, UserManagers, etc., \tn % Row Count 6 (+ 6) % Row 1 \SetRowColor{white} {\bf{Where do those other objects come from?}} & Static Globals? Parameters? \tn % Row Count 9 (+ 3) % Row 2 \SetRowColor{LightBackground} {\bf{Summary}} & Objects that need other objects to help do their job Want to be able to use different objects without modifying source code: Define functionality as an interface Pass object in at construction time (and save in class field) Important: only works for classes that the "system" builds for you E.g., you MAUI program MainPage! \tn % Row Count 26 (+ 17) \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{JSON/Serialization}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{JSON Serialization -Default Option}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}What constructor is used BEFORE data put in: Default constructor What is serialized? Public properties What is not serialized? Fields, private properties How do we change that? Attributes (Metadata Tags)} \tn % Row Count 6 (+ 6) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{JSON Serialization "Recursion"}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Is it recursive? Yes - all objects inside public Properties are also serialized. Deep Copy (not shallow copy) "Cloning" ?? Circular References ??} \tn % Row Count 11 (+ 5) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{JSON De/Serialization}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Reflection Runtime - inspect code Deserialization Calls default constructor *(or constructor that matches field names in JSON string). "Finds" the names of the properties Reads the JSON looking for matching names Puts data directly into properties Serialization "Finds" names of properties and auto-generates json string} \tn % Row Count 19 (+ 8) % Row 3 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{JSON Attribute Tags and Options}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}{[}JsonConstructor{]} Specify the specific constructor to use Constructor parameters must match names of Json Fields {[}JsonInclude{]} Force property to be part of the serialization {[}JsonIgnore{]} For property to not be part of the serialization {[}JsonRequire{]} If field \_not\_ there then error} \tn % Row Count 26 (+ 7) % Row 4 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Parsing JSON ex}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Food f = new Food(); List\textless{}Food\textgreater{} list = new(); list.Add(f); message = \seqsplit{JsonSerializer.Serialize(} list ); JsonSerializer.DeSerialize\textless{}List\textless{}Food\textgreater{}\textgreater{}( message ); DeSerialize(message, new List\textless{}Food\textgreater{}().Type()) \{CMD\_Food\}{[}\{X:50,Y:50,ID:5..\},...{]}} \tn % Row Count 32 (+ 6) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{JSON/Serialization (cont)}} \tn % Row 5 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{JSON – Message Passing Optimization}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Content of message (JSON string) is "too big" for value, i.e., we can compress the information in the JSON string into \_far\_ fewer bytes. What are we doing to do about it? Answer: Nothing} \tn % Row Count 6 (+ 6) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{MVC}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{MVC for Agario}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}World status should be its own class (Model) GameClient interactions should be its own class Have important methods like: HandleMessageFromServer( … ) SendMoveRequestToServer( … ) Uses a World object Networking code Updates client with messages GUI code Reads client's World information and draws it Need to make all references to client/world Thread Saf} \tn % Row Count 9 (+ 9) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{MVC for Agario Continued}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Start simple. Put most/all code in MainPage.xaml.cs As you start to see patterns, build helper classes to handle them Then in the later stages of development review code such that MainPage.xaml.cs is very short. See "refactoring" idea of extracting methods.} \tn % Row Count 16 (+ 7) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{p{0.3433 cm} p{0.3433 cm} } \SetRowColor{DarkBackground} \mymulticolumn{2}{x{3.833cm}}{\bf\textcolor{white}{SQL}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{2}{x{3.833cm}}{} \tn % Row Count 0 (+ 0) \hhline{>{\arrayrulecolor{DarkBackground}}--} \end{tabularx} \par\addvspace{1.3em} \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{CS 3500}} \tn % Row 0 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Purpose of CS 3500}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}What is it you are supposed to learning in CS 3500? CS 3500 is primarily about learning to: Solve complex problems with software Afterall, software rules the world And that, that software should Contains fewer defects Be more maintainable} \tn % Row Count 7 (+ 7) % Row 1 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Maintainable/Testable Software}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Simple (as possible) Organized/Architected (e.g., MVC) SOLID (e.g., Separation of Concerns/Single Responsibility) DRY \seqsplit{Documented/Commented/Describable} READMEs Pictures/Figures/UML Testable} \tn % Row Count 12 (+ 5) % Row 2 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Teamwork}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Working with another developer Versioning, e.g., git usage Iterating Asking questions Discussing} \tn % Row Count 16 (+ 4) % Row 3 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{Components software systems will need}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Databases Networking (e.g., client/server architecture) Multi-threading GUI Logging} \tn % Row Count 19 (+ 3) % Row 4 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{IDE}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}IDE support - Visual Studio Debug tools Optimization tools Database interface tools Multi-Architecture Deployment (e.g., MAUI) Intellisense Copilot?, GPT? XML documentation} \tn % Row Count 24 (+ 5) % Row 5 \SetRowColor{white} \mymulticolumn{1}{x{3.833cm}}{{\bf{C\# Programming}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}C\# is one of many choice (albeit a good one) it could have been C++, or Ruby, or Python, or Java, or Go, or …. What are elements of the language that support GSPs? Long winded essay question possibility: "Describe multiple reasons we should use C\# on our next project to support making maintainable software?"} \tn % Row Count 32 (+ 8) \end{tabularx} \par\addvspace{1.3em} \vfill \columnbreak \begin{tabularx}{3.833cm}{X} \SetRowColor{DarkBackground} \mymulticolumn{1}{x{3.833cm}}{\bf\textcolor{white}{CS 3500 (cont)}} \tn % Row 6 \SetRowColor{LightBackground} \mymulticolumn{1}{x{3.833cm}}{{\bf{Some Niceties of the C\# Language}}} \tn \mymulticolumn{1}{x{3.833cm}}{\hspace*{6 px}\rule{2px}{6px}\hspace*{6 px}Functions as Values - Delegates, Event Handlers, etc. Lambdas, Closures Events - Design code around events "happening" Threading OOL, Library support Exceptions Garbage collection GUI Support Much much more.} \tn % Row Count 6 (+ 6) \hhline{>{\arrayrulecolor{DarkBackground}}-} \end{tabularx} \par\addvspace{1.3em} % That's all folks \end{multicols*} \end{document}