writing
This commit is contained in:
parent
c2ad7ed9d4
commit
71a15af647
@ -146,20 +146,28 @@ Benchmark.js combines these approaches. In a first step it approximates the runt
|
||||
\subsubsection{The benchmark suite}
|
||||
For running multiple benchmarks the class \texttt{BenchmarkSuite} was created. It takes a list of BenchmarkCases and runs them through a BenchmarkType. The Suite manages starting, pausing and stopping of going through list. It updates the statistics gathered on each cycle. By injecting an onCycle method, the \texttt{App} component can give live feedback about the progress.
|
||||
|
||||
\todo[inline]{Add digram: state machine for suite}
|
||||
\todo[inline]{Explain state machine}
|
||||
|
||||
\subsubsection{The user interface}
|
||||
|
||||
\begin{figure}[htbp]
|
||||
\begin{figure}[htb]
|
||||
\centering
|
||||
\fbox{\includegraphics[width=.9\linewidth]{images/benchmark-ui.png}}
|
||||
\caption{The user interface for benchmarking application. (not final)}
|
||||
\label{fig:benchmart-ui}
|
||||
\label{fig:benchmarking-statemachine}
|
||||
\fbox{\includegraphics[width=.8\linewidth]{images/benchmark-statemachine.jpg}}
|
||||
\caption{The state machine for the benchmark suite}
|
||||
\end{figure}
|
||||
|
||||
Figure \ref{fig:benchmarking-statemachine} shows the state machine of the suite. Based on this diagram the ui component shows action buttons so the user can interact with the state. While running the suite checks if a state change was requested and acts accordingly by pausing the benchmarks or resetting all statistics gathered when stopping.
|
||||
\clearpage
|
||||
\subsubsection{The user interface}
|
||||
|
||||
The user interface has three regions. One for configuring input parameters. One for controlling the benchmark process and at last a diagram of the results.
|
||||
|
||||
\begin{figure}[!htb]
|
||||
\centering
|
||||
\fbox{\includegraphics[width=.9\linewidth]{images/benchmark-ui.png}}
|
||||
\caption{The user interface for benchmarking application.}
|
||||
\label{fig:benchmark-ui}
|
||||
\end{figure}
|
||||
|
||||
|
||||
|
||||
\paragraph{Settings} At first the input parameters of the algorithm have to be specified. For that there are some polylines prepared to choose from. They are introduced in chapter \ref{ch:benchmark-data}. Instead of testing a single tolerance value the user can specify a range. This way the behavior of the algorithms can be observed in one chart. The high quality mode got its name from Simplify.js. If it is enabled there will be no radial-distance preprocessing step before applying the Douglas-Peucker routine. The next option determines which benchmarks will be run. The options are mentioned in chapter \ref{ch:benchmark-cases}. One of the three benchmark methods implemented can be selected. Depending on the method chosen additional options will show to further specify the benchmark parameters. The last option deals with chart rendering. Debouncing limits the rate at which functions fire. In this case the chart will delay rendering when datapoints come in at a fast rate.
|
||||
|
||||
\paragraph{Run Benchmark} This is the control that displays the status of the benchmark suite. Here benchmarks can be started, stopped, paused and resumed. It also shows the progress of the benchmarks completed in percentage and absolute numbers.
|
||||
@ -170,6 +178,30 @@ The user interface has three regions. One for configuring input parameters. One
|
||||
\subsection{The test data}
|
||||
\label{ch:benchmark-data}
|
||||
|
||||
Here the test data will be shown. There are two data sets chosen to operate on. The first is a testing sample used in Simplify.js the second one a boundary generated from the OpenStreetMap (OSM) data.
|
||||
|
||||
\paragraph{Simplify.js example}
|
||||
|
||||
\paragraph{Bavaria outline}
|
||||
This is the polyline used by Simplify.js to demonstrate its capabilities. Figure \ref{fig:dataset-simplify} shows the widget on its homepage. The user can modify the parameters with the interactive elements and view the live result. The data comes from a 10.700 mile car route from Lisboa, Portugal to Singapore and is based on OpenStreetMap data. The line is defined by 73.752 positions. Even with low tolerances this number reduces drastically. This example shows perfectly why it is important to generalize polylines before rendering them.
|
||||
|
||||
\begin{figure}[htb]
|
||||
\centering
|
||||
\includegraphics[width=.9\linewidth]{images/dataset-simplify.png}
|
||||
\caption{The Simplify.js test data visualized}
|
||||
\label{fig:dataset-simplify}
|
||||
\end{figure}
|
||||
|
||||
\paragraph{Bavaria outline}
|
||||
|
||||
The second polyline used for benchmarking contains 116.829 positions. It represents the outline of a german federate state, namely bavaria. It was extracted from the OSM dataset by selecting administrative boundaries. On the contrary to the former polyline this one is a closed line, often used in polygons to represent a surface. The plotted line can be seen in figure \ref{fig:dataset-bavaria}.
|
||||
|
||||
\begin{figure}[htb]
|
||||
\centering
|
||||
\includegraphics[width=.9\linewidth]{images/dataset-bavaria.png}
|
||||
\caption{The Bavaria test data visualized}
|
||||
\label{fig:dataset-bavaria}
|
||||
\end{figure}
|
||||
|
||||
\paragraph{Simple line}
|
||||
|
||||
There is a third line used in the application to choose from. This one is however not used for benchmarking since it contains only 8 points. It is merely a placeholder to prevent the client application to load a bigger data sets from the server on page load. This way the transmitted data size will be reduced. The larger lines will only be requested when they are actually needed.
|
@ -17,7 +17,9 @@ Each section in this chapter describes a set of benchmarks run on the same syste
|
||||
\caption{Problem dimensions of Case 1}
|
||||
\end{table}
|
||||
|
||||
Benchmark of dataset "Simplify.js example" using the web browsers of Google, Microsoft and Mozilla.
|
||||
At first it will be observed how the algorithms perform under different browsers. The chart to use for this is the "Simplify.js vs Simplify.wasm" chart. For that a Windows system was chosen as it allows to run benchmarks under three of the four browsers in question. The dataset is the Simplify.js example which will be simplified with and without the high quality mode.
|
||||
|
||||
The device is a \textsf{HP Pavilion x360 - 14-ba101ng}\footnote{\path{https://support.hp.com/us-en/product/hp-pavilion-14-ba100-x360-convertible-pc/16851098/model/18280360/document/c05691748}} convertible. It contains an Intel® Core™ i5-8250U Processor with 4 cores, 6MB cache. The operating system is Windows 10 and the browsers are on their newest versions with Chrome 76, Firefox 68 and Edge 44.18362.1.0.
|
||||
|
||||
\input{./results-benchmark/win_chro_simplify_vs_false.tex}
|
||||
\input{./results-benchmark/win_ffox_simplify_vs_false.tex}
|
||||
@ -40,6 +42,9 @@ Benchmark of dataset "Simplify.js example" using the web browsers of Google, Mic
|
||||
\caption{Problem dimensions of Case 2}
|
||||
\end{table}
|
||||
|
||||
|
||||
For this case the same device as in the former case is used. To compare the results of the two cases the same dataset is used. Under the Edge browser the Simplify.wasm runtime analysis was measured.
|
||||
|
||||
\input{./results-benchmark/win_edge_simplify_stack_false.tex}
|
||||
\input{./results-benchmark/win_edge_simplify_stack_true.tex}
|
||||
\clearpage
|
||||
@ -49,6 +54,8 @@ Benchmark of dataset "Simplify.js example" using the web browsers of Google, Mic
|
||||
\marginpar{4 charts}
|
||||
\marginpar{Chrome and FF comparable to results above}
|
||||
|
||||
A 2018 MacBook Pro 15" will be used to test the safari browser. For comparison the benchmarks will also be held under Firefox on MacOS. This time the bavarian boundary will be simplified with both preprocessing enabled and disabled.
|
||||
|
||||
\begin{table}[htb]
|
||||
\centering
|
||||
\includegraphics[width=.75\linewidth]{./images/dimensions-3.png}
|
||||
|
BIN
thesis/main.pdf
BIN
thesis/main.pdf
Binary file not shown.
@ -15,6 +15,7 @@
|
||||
\usepackage{todonotes} % for todo notes
|
||||
\usepackage{url} % for filepaths and urls
|
||||
\usepackage{hyperref} % for hyperlinks
|
||||
\usepackage{float}
|
||||
|
||||
% configure headers
|
||||
\usepackage{fancyhdr} % for headers
|
||||
@ -33,7 +34,7 @@
|
||||
|
||||
% Start sections on new pages
|
||||
\let\stdsection\section
|
||||
\renewcommand\section{\newpage\stdsection}
|
||||
\renewcommand\section{\clearpage\newpage\stdsection}
|
||||
|
||||
\title{Performance comparison of simplification algorithms for polygons in the context of web applications}
|
||||
\author{Alfred Melch}
|
||||
|
Loading…
Reference in New Issue
Block a user